Simplified iOS

  • Home
  • About
  • Contact
  • Advertise
  • Write for Us

Xcode Text Field Tutorial for iOS Application using Swift

July 28, 2016 by Belal Khan 5 Comments

Hello friends, welcome to this Xcode Text Field Tutorial. In the last post we learnt about handling button in Xcode. In this Xcode Text Field Tutorial we will learn about handling Text Field.

For getting user input Xcode gives as a View called Text Field. So lets begin. I will be working on the same project. You can start a new project if you want.

Adding Text Field to Your Storyboard

  • Open Xcode, Create a new Project and select a Single View App. I will be working on the same project we created in last tutorial.
  • So you have your Storyboard and Code Editor in the same window. I covered this part in the last tutorial about making Storyboard and Code Editor in the same window. You can easily do this just go to View -> Assistant Editor -> Show Assistant Editor.
  • Now on the right side you will see Text Field. So find Text Field and drag it to your Storyboard. See the below image for help.

xcode text field tutorial

  • Now you will see the Text Field in your story board.

xcode textfield tutorial

  • To customize your Text Field you can use the right section of Text Field. Make sure your Text Field is selected.

xcode text field

  • As you can see the above image I have entered a text in Placeholder. The placeholder text will be shown in your Text Field as a hint text. So it can help the user what he/she supposed to enter on the text field.

Connecting Text Field to Code

  • We have created our Text Field now to connect it to your code just press control and drag the Text Field to your code window. See the below image for help.

xcode textfield tutorial

  • After leaving the pointer you will see the following popup box.

xcode text field tutorial

  • Enter a name for your Text Field and click on Connect. (Make sure the other settings are same as the above image).
  • Now you will see the following code in your code window.
//
//  ViewController.swift
//  FirstIphoneApp
//
//  Created by Belal Khan on 26/07/16.
//  Copyright © 2016 Belal Khan. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    
    var clickCount = 0
    
    @IBOutlet weak var labelName: UILabel!
    
    //this is the text field we created
    @IBOutlet weak var textFieldName: UITextField!
    
    @IBAction func buttonClick(sender: UIButton) {
        
        clickCount += 1
        
        labelName.text = "You clicked \(clickCount) times"
    }
}

  • Remember I am working on the project we created in the last tutorial. So we already have a label and a button function.

Getting Input from Text Field

  • So inside function buttonClick we will get input from the Text Field. To do this modify the code of your ViewController.swift file as follows.
//
//  ViewController.swift
//  FirstIphoneApp
//
//  Created by Belal Khan on 26/07/16.
//  Copyright © 2016 Belal Khan. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    //created a string variable
    var name: String = ""
    
    //our label to display input
    @IBOutlet weak var labelName: UILabel!
    
    //this is the text field we created
    @IBOutlet weak var textFieldName: UITextField!
    
    @IBAction func buttonClick(sender: UIButton) {
        //getting input from Text Field
        name = textFieldName.text!
        
        //Displaying input text into label
        labelName.text = "Hello \(name)"
    }
}

What we did?

In the above code we first remove the clickCount variable. Then we created a String variable name with “” as default value (i.e. the variable has a blank value).

Then inside the function buttonClick we are taking the input value from Text Field to the String variable name we created. And then we are displaying the name with a “Hello” prefix in the label we created.

Checking the Application

  • Now everything is alright just click on the play icon to test the app we created.

xcode text field tutorial

  • Bingo! its working absolutely fine.

Xcode Text Field Tutorial – Summary

So I am wrapping up this post here. In this Xcode Text Field Tutorial we learnt how we can get user input by creating a simple Text Field in Xcode. The code is very simple. In upcoming tutorials we will try to make our application to do some problem solving things.

And yes if you have any doubts and confusions related to this Xcode Text Field Tutorial, feel free to leave your comments. Thank You 🙂

Share this:

  • Tweet
  • Share on Tumblr
  • WhatsApp

Related

Filed Under: iOS Development Tutorial Tagged With: xcode text field, xcode text field tutorial, xcode tutorials

About Belal Khan

I am Belal Khan, I am currently pursuing my MCA. In this blog I write tutorials and articles related to coding, app development, iphone etc.

Comments

  1. Alex says

    July 30, 2016 at 10:39 am

    Nice tutorial Belal interesting to read because of the images .

    Reply
  2. riccardo says

    March 17, 2017 at 8:41 am

    hi
    I tried to follow this tutorial ,but Xcode give me error like Thread 1 : breakpoint 1.4

    Reply
    • Belal Khan says

      March 19, 2017 at 2:49 pm

      You may have accidentally set a breakpoint.. remove that

      Reply
    • Deogratius Otaru says

      June 26, 2018 at 5:39 pm

      Try to delete all connection that where set and renamed or removed in the outlet section

      Reply
  3. rohmatmret says

    December 27, 2017 at 6:49 am

    thanks man , this is very helpful for beginners

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *




About Me

belal khan simplified ios

Hello I am Belal Khan, founder and owner of Simplified iOS. I am currently pursuing MCA from St. Xavier's College, Ranchi. Apart from my academic I am a blogger, I run various websites and majority of them are about coding and development.

Connect with Me

Follow Simplified iOS

Simplified iOS

Popular Posts

  • Swift PHP MySQL Tutorial – Connecting iOS App… (94,532)
  • Swift SQLite Tutorial for Beginners – Using… (94,175)
  • UIWebView Example to Load URL in iOS using Swift in Xcode (78,244)
  • Xcode Login Screen Example using Swift 3, PHP and MySQL (65,225)
  • Download Full High Sierra Installer to Create Bootable USB (61,246)
  • How to Format USB on Mac? Formatting External Hard… (60,779)
  • Swift JSON Tutorial – Fetching and Parsing… (58,674)
  • Firebase Realtime Database Tutorial for Swift using Xcode (52,001)
  • iOS Registration Form Example using PHP and MySQL (46,976)
  • Xcode Text Field Tutorial for iOS Application using Swift (39,039)




About

Simplified iOS is a blog where you can find latest tutorials related to coding and app development for iphone and MAC OS. Here you can get Simplified iPhone, iPad and Mac OS development tutorial to know the things about Apple Development from basics to advanced level.

Quick Links

  • Advertise
  • Contact
  • Disclaimer
  • Privacy Policy
  • Write for Us

Copyright © 2017 · Simplified iOS· All rights Reserved. And Our Sitemap.All Logos & Trademark Belongs To Their Respective Owners·