iOS Series Basics 09 switches, sliders, and segmented controls

iOS Series Basics 09 switches, sliders, and segmented controls

Directory:

1. Case description
2. Switching control switch
3. Slider Control Slider
4. Segmented controls segmented control

1. Case description

Switch controls (switch), slider controls (sliders), and segmented controls (segmented control) are subclasses of Uicontrol, and we will work with you to learn about the use of these three controls in one case.

As shown, this case includes two switch control switches, a segmented control (segmented control), two labels (label), and a Slider control (slider):

The values of the two switch controls remain in the opposite state, click one of them so that the value is on, and the other changes as well.

A two segment control, the left and right side of the paragraph is named the next one, and then click on the top of the two switch control disappears, click on the top two switch control to restore the display.

The bottom slider control can change the text content of the label tag above, and the branch that changes the slider is displayed on the label.

2. Switching control switch

Use the single View application template to create a project and open the Main.storyboard file.

Drag two switch controls (switches) from the object library to the interface and set their state property to the opposite.

Because you want to control two switch controls to keep the opposite value in your code, you need to pin the output to the two switch controls, named Leftswitch and Rightswitch, respectively.

(PS: Forget how to add export to see the previous article, "iOS series basic article action and export")

Hold down the Control key, drag the left switch to the code on the right, and add the outlet output:

Set the name to Leftswitch:

Add the outlet of the right switch control in the same way and name it Rightswitch, and the final effect is:

Declare a Switchvaluechange: method in Viewcontroller to set the values of the two switches at the same time so that their values remain the opposite.

(PS: Forget how to add action action, please refer to the previous article "iOS Series Basics" action and export)

Hold down the control key and drag the switch control to the right side of the code:

In the popup dialog box, select Add action and set the following information:

After adding the action action method, the specific implementation code is as follows:

1 @IBAction func switchvaluechanged (sender:anyobject) {2Let Senderswitch = Sender as! Uiswitch//get the currently clicked control and force transition to switch3         4Let value = Senderswitch.on//gets the status value after the current click Switch5         6         //if the current click is Leftswitch7         if(Senderswitch = =Self . Leftswitch) {8Self. Rightswitch.seton (!value, animated:true)//set the status value of the right switch9}Else{//if the current click is RightswitchTenSelf. Leftswitch.seton (!value, animated:true)//set the status value of the left switch One         } A}

Then hold control and drag the switch on the right to the above method, so that the two switch action is bound to a method:

The results are as follows:

3. Slider Control Slider

As shown in the previous case, drag a Slider control slider from the object library to the designer and place it in the center of the screen.

Open its property inspector and set its minimum, maximum, and initial values to 0.0, 1.0, and 0.5 in turn.

In iOS, the value of the slider is a floating-point number between 0.0 and 1.0.

Above the slider, place the two label label controls, change the label text on the left to the slider current value:, and set the text on the right to 50.

(Because the slider default is in the middle of 0.5, I want to display the 0~100 on the label, so the default is 50)

Add the outlet output to the label on the right to display the value, and name it slidervalue:

In the popup window, set the name to Slidervalue, as follows:

After setting the outlet output of the slider, the code is as follows:

@IBOutletweakvarUILabel!   

The label on the right is used to display the current value of the slider, where we need to implement an action action for the slider:

Name it slidervaluechanged:

The action code for the slider is as follows:

1 @IBAction func slidervaluechanged (sender:anyobject) {2Let slider = Sender as! UISlider//the currently dragged slider3Let value = Int (slider.value* -)//gets the int value after the current value (0.x) multiplied by 1004Let Showtext = nsstring (format:"%d", value)//Format the data5Self. Slidervalue.text = Showtext asString//displayed on the label6}

The results are as follows:

4. Segmented controls segmented control

The segmented control (segmented control) is also a selection control that functions like a radio button in Windows.

It consists of two or more segments, each of which corresponds to a separate button.

It has three styles: Plain, bordered and bar styles, and after iOS 7, there's no big difference between the three styles, so you can try it.

As shown in the previous case, drag a segmented control (segmented control) into the designer, set the left paragraph text to leave, and the right paragraph text to true.

Then add the action method touchdown:

1 @IBAction func TouchDown (sender:anyobject) {2         if(self.) Leftswitch.hidden) {//if the current switch control is displayed3             //Hide all two switches4Self. Leftswitch.hidden =false5Self. Rightswitch.hidden =false6}Else{//if the current switch control is hidden7             //display of two switches8Self. Leftswitch.hidden =true9Self. Rightswitch.hidden =trueTen         } One}

The effect is as follows:

iOS Series Basics 09 switches, sliders, and segmented controls