blog posts

Learn UI labels (iOS) in iOS in simple language

Here we will learn how to use ui labels in iOS with an example, as well as how to use ui control labels in iOS applications to display content in the form of plain text or text with a design look in the programming language.

Let’s learn Swift with an example using xcode.

IOS UI labels

The label in iOS is a basic UI control that is used to display plain static text or text with appearance. Content in iOS label control is read-only text, we can not change or edit the text, but the content of the label can be copied.

We can apply custom styles to content on the iOS label, for example we can change the font style and font size; We can also add background colors and other items according to our needs. For this purpose, we must do the following.

iOS UI Control Labels Sample Format

Now let’s look at an example of how to use labels in the iOS app.

Create iOS labels app with Xcode

To create a new iOS project in Xcode, open Xcode from the Applications folder. After opening Xcode, a welcome window will open as shown below. In the Welcome window, click on the second option: Create a new Xcode Project or select the File New Project path.

C: \ Users \ mohammad \ Desktop \ open-xcode-to-create-new-ios-app-using-xcode (1) .png

After selecting “Create a new Xcode project”, a new window will open in which we must select our template.

The new Xcode window includes several built-in application templates to implement the usual type of iOS apps, such as page-based apps, tab-based apps, games, spreadsheet apps, and more. These templates have a preset interface and source code files.

For this example, we will use the Labels app in iOS, the most basic app template, which is a “show-only app”. To select this item, go to the iOS section on the left to select the application using the select application, and in the main part of the window, select the “Single View Application” window and click the Next button, as shown below.

After clicking Next, we will see a window like the one below, in this case we have to mention the project name and other details for our program.

Product name: “Button in iOS” (Buttons in iOS)

The name we enter in the Product Name section is used for the project and application.

Organization name: “Tutlane”

You can enter the name of the organization or your name in this field; Of course you can leave that section blank.

Organization Identifier): “com.developersocoiety)”

If you do not have an enterprise ID, enter com.example.

Bundle Identifier

This section is automatically generated based on the phrases we entered in the product name and organization ID.

Language: “Swift”

Select the language type “Swift” because we want to develop applications using swift.

Universal (devices): “Universal”

Select the Devices option as Universal This means that the app runs on all Apple devices; If you need to run the app for iPad only, you can select the iPad option to restrict your app to running only on iPad devices.

Use core Data: Not selected

This option is used for database operations. Select this option if you are doing any database-related operations in your application, otherwise do not select this option.

Include Unit Test: Not selected

If you need unit tests for your application, select this option otherwise leave it unselected.

Includes UI tests: not selected

Select this option if you need UI tests for your application, otherwise do not select it.

After completing the options, click the Next button as shown below.

C: \ Users \ mohammad \ Desktop \ ios-buttons-create-new-swift-project-in-xcode.png

When we click Next; A new window will open in which we have to select the location where we want to save our project. Once we have selected the project storage location; We have to click on the Create button as shown below.

C: \ Users \ mohammad \ Desktop \ save-xcode-new-project-in-application-folder-in-ios-swift (1) .png

After clicking the Create button, Xcode opens and creates a new project. In our project, Main.storyboard and ViewController.swift are the main files used to design the user interface and maintain the source code.

Main.storyboard – which is the visual interface editor and this file is used to design the application user interface.

ViewController.swift – which contains the source code of our application and we use this file to write any code related to our application.

Now select the Main.storyboard file in the project, so that Xcode opens the visual interface editor as shown below.

iOS Labels Application StoryBoard File in Xcode

Now select the ViewController.swift file in your project, which looks like this:

iOS Labels Application ViewController File Format Example

Add iOS ui controls to display

We are now adding controls to our application for that library of available objects. The object library appears at the bottom right of Xcode. If you did not find the object library, as shown below; Click the button that is the third button in the library selection bar on the left. (On the other hand, you can select the View Utilities Show Object Library path).

As mentioned, our interface is in the Main.storyboard file; So open the Main.storyboard file. Now search the object library for labels. To do this in the section titled Filter; Type the phrase label and then as shown below; Drag and drop it into the Main.storyboard view controller, and then edit the label control as needed.

Add ios ui label controls to storyboard view file

In the same way, select a few labels from the object library and make changes based on your needs, as you can see below.

Now run the app and see the output of the iOS labels app. To start the program, first select the required emulator (in this section we have selected iPhone Six S Plus) and then click on the play button, which is similar to the figure below in the upper right corner of the Xcode toolbar has it.

Example output of iOS labels app

The results of iOS labels will be similar to the following.