UI Controls

Label

a label is a visual element that displays text. It is an instance of the UILabel class, which is a subclass of UIView. Labels are commonly used to display static text, such as labels for form fields or titles for sections of content.
A label has a number of properties that you can use to customise its appearance, such as its font, text colour, and alignment and more.

let label=UILabel()
        label.text="Welcome to zoho!"
        label.textAlignment = .center
        label.textColor = .blue
        label.frame=CGRect(x: 5, y: 60, width: 150, height: 20)
        view.addSubview(label)

Button

It is a control that enables the user to interact with the application. It is used to trigger the events performed by the user. It executes the custom code in response to user interactions.

The buttons are one of the most important parts of iOS applications. Buttons are associated with the actions that are performed when the user interacts with the button. We can add the button to the iOS application programmatically or by using interface builder.

private let Button:UIButton={
            let btn=UIButton()
            btn.setTitle("Login", for: .normal)
            btn.setTitleColor(UIColor.black, for: .normal)
            btn.frame = CGRect(x: 5, y: 200, width: 50, height: 25)
            btn.backgroundColor = .systemMint
            btn.addTarget(target, action: #selector(call),for: .touchUpInside)
            return btn
        }()

 @objc func call(){
            print("button clicked")
            Button.backgroundColor = .red
        }

TextField

It can be defined as an object which is used to display an editable text area in the interface. Textfields are used to get the text-based input from the user.

private let userNameText:UITextField={
        let text=UITextField()
        text.placeholder="Username"
        text.borderStyle = .roundedRect
        text.textColor = .black
        text.frame = CGRect(x: 5, y:100 , width: 200, height: 40)
        return text
    }()

DatePicker

DatePicker is a control used in IOS applications to get the date and time values from the user. We can allow the user to either enter the time in point or time interval.

private let DatePicker:UIDatePicker={
            let picker=UIDatePicker()
            picker.frame=CGRect(x: 5, y: 300, width: 300, height: 30)
            picker.backgroundColor = .lightGray
            return picker
        }()

Slider

A slider can be defined as a UIControl, which provides the contiguous range of values on a single scale to the user, out of which the user is prompted to select a single value.
The slider is connected with the action method, which is notified every time the user moves the thumb onto a slider. The value of the slider can be retrieved each time the action method is called.

private let Slider:UISlider={
        let slider=UISlider()
        slider.frame=CGRect(x: 5, y: 400, width: 200, height: 50)
        slider.minimumValue=0
        slider.maximumValue=100
        slider.thumbTintColor = .green
        return slider
    }()

Stepper

It is a type of UIControl which is used to increase and decrease value. The stepper consists of two buttons. It is associated with a value which gets repeatedly increased or decreased on holding down two of the buttons once at a time. The rate of the change depends on the duration the user presses the control.

private let Stepper={
        var steper=UIStepper()
        steper.frame=CGRect(x: 5, y: 480, width: 30, height: 60)
        steper.backgroundColor = .white
        steper.value=0
        steper.minimumValue = -10
        steper.maximumValue = 10

        steper.addTarget(self, action: #selector(stepperValueChanged(_:)), for: .valueChanged)
        return steper
    }()

Switch

The switch can be defined as the UIControl, which provides binary choices to the user either on or off. The state of a switch is managed by properties and methods defined in the UISwitch class, which is the subclass of UIControl.

private let Switch:UISwitch={
        let Switch=UISwitch()
        Switch.frame=CGRect(x: 5, y: 250, width: 50, height: 30)
        Switch.isOn=true
        Switch.setOn(true, animated: false)
        return Switch
    }()

Segment

Segment control can be defined as the horizontal control, which controls multiple segments where a discrete button controls each segment. A segment control can be used to display multiple views within a single view controller, where each view can be displayed by using a discrete button.

private let segmant:UISegmentedControl={
        let segmentItems = ["First", "Second"]
        let seg=UISegmentedControl(items: segmentItems)
        seg.frame=CGRect(x: 5, y: 550, width: 150, height: 50)
        seg.backgroundColor = .white
        seg.addTarget(self, action: #selector(segmentControl(_:)), for: .valueChanged)
        seg.selectedSegmentIndex=0
        seg.selectedSegmentTintColor = .lightGray
        seg.tintColor = .blue
        return seg
    }()

Sample App

Blog

AJITHKUMAR K