How to create login screen with alert view Controller using UIAlertController in SWIFT

How to create login screen with alert view Controller using UIAlertController in SWIFT

Alert views can also be used with text field. You can use it to quickly get some input text to image or table.How to take text input with alert view.
1. First lets set up the x code project as usual. Create new single view application X code project. Set the values as follows and save it on your desktop.

2. Go to main storyboard and select view controller. Set its size iPhone 4-inch in attribute section.

3. Add button to main storyboard & rename it to Log In

4. Connect button to view controller swift file

5. Create a function/method as following just below view did load

 

func printText(username:String, password:String)

{

print(username)

print(password)

}

This will just print username & password collected from log in screen.

6. Now add following code in Log In button we just created.

@IBAction func logInPressed(sender: UIButton) 
{

// 1
let loginController = UIAlertController(title: "Please Sign In", message: "Fill in the following", preferredStyle: UIAlertControllerStyle.Alert)

// 2
let loginAction = UIAlertAction(title: "Log In", style: UIAlertActionStyle.Default) { (action:UIAlertAction) -> Void in

let loginTextField = loginController.textFields![0] as! UITextField

let passwordTextField = loginController.textFields![1] as! UITextField

self.printText(loginTextField.text, password: passwordTextField.text)

}
loginAction.enabled = false

// 3
let signupAction = UIAlertAction(title: "Sign Up", style: UIAlertActionStyle.Default, handler: nil)

let forgotPasswordAction = UIAlertAction(title: "Forgot Password", style: UIAlertActionStyle.Destructive, handler: nil)

var cancelAction = UIAlertAction(title: "Cancel", style: UIAlertActionStyle.Cancel, handler: nil)

// 4
loginController.addTextFieldWithConfigurationHandler { (textField:UITextField!) -> Void in

textField.placeholder = "Username or Email"

textField.keyboardType = UIKeyboardType.EmailAddress

NSNotificationCenter.defaultCenter().addObserverForName(UITextFieldTextDidChangeNotification, object: textField, queue: NSOperationQueue.mainQueue(), usingBlock: { (notification:NSNotification!) -> Void in

let textField = notification.object as! UITextField

loginAction.enabled = !textField.text.isEmpty

})

}

// 5
loginController.addTextFieldWithConfigurationHandler { (textField:UITextField!) -> Void in

textField.placeholder = "Password"

textField.secureTextEntry = true

}
// 6
loginController.addAction(loginAction)
loginController.addAction(signupAction)
loginController.addAction(forgotPasswordAction)
loginController.addAction(cancelAction)
// 7
presentViewController(loginController, animated: true, completion: nil)

}

Here login control is created with alert view style.

Login action is created with two text fields. One for username & another for password. Then input text is printed with printText method. But login action is disabled here at the end.

Here sign up action, forgot password action & cancel action is created.

First text fields placeholder & keyboard type is set. Login action is enabled only if first text field is not empty.

Second text Fields place holder is set. And input is hidden like password.

All actions are added to login control

Login control is presented with animation.

7. Now build and run the app on iPhone 5s And click on Log In button.


Discover more from CODE t!ps

Subscribe to get the latest posts sent to your email.

Scroll to Top

Discover more from CODE t!ps

Subscribe now to keep reading and get access to the full archive.

Continue reading