三十而立，從零開始學ios開發（六）：IOS控制項（3），Segmented Control、Switch

這次的學習還是基於上一個項目繼續進行（你也可以建立一個項目）學習Segmented Control和Switch。

Segmented Control

Switch

Segmented Control和Switch的主要區別在於Segmented Control可以有多個值進行選擇，而Switch只有2個值。

1）添加Segmented Control
從object library中拖一個Segmented Control到iphone介面上
然後調整Segmented Control位置以及它的寬度，如

在Segmented Control的attributes inspector中有一個屬性叫做Segments，這個值是用來設定有多少個分段，預設是2個，你可以將它的值設成100，看看其效果如何。

像改變Label控制項文字內容一樣，滑鼠雙擊Segmented Control上的文字，可以改變其內容，將“First”改成“Switches”，將“Second”改成“Button”，如下

1）添加2個Switch
從object library中拖兩個Switch到iphone介面上，如下

Switch的attribute不需要做改動，下面接著建立Outlet和Action

3）添加Outlet和Action
為2個Switch添加分別添加Outlet，然後2個Switch共用一個Action，Segmented Control使用一個Action
為左邊的Switch添加一個Outlet，命名為leftSwitch，為右邊的Switch添加一個Outlet，命名為rightSwitch
 
為左邊的Switch添加一個Action，命名為switchChanged，添加完成後，將右邊的Switch也關聯到switchChanged

為Segmented Control添加一個Action，命名為toggleControls

添加完的BIDViewController.h如下

#import <UIKit/UIKit.h>@interface BIDViewController : UIViewController@property (weak, nonatomic) IBOutlet UITextField *nameField;@property (weak, nonatomic) IBOutlet UITextField *numberField;@property (weak, nonatomic) IBOutlet UILabel *sliderLabel;@property (weak, nonatomic) IBOutlet UISwitch *leftSwitch;@property (weak, nonatomic) IBOutlet UISwitch *rightSwitch;- (IBAction)textFieldDoneEditing:(id)sender;- (IBAction)backgroundTap:(id)sender;- (IBAction)sliderChanged:(id)sender;- (IBAction)switchChanged:(id)sender;- (IBAction)toggleControls:(id)sender;@end

（上面有很多其他的Outlet和Action，這個是使用了之前項目的原因）

BIDViewController.m如下

#import "BIDViewController.h"@implementation BIDViewController@synthesize nameField;@synthesize numberField;@synthesize sliderLabel;@synthesize leftSwitch;@synthesize rightSwitch;...- (IBAction)switchChanged:(id)sender {}- (IBAction)toggleControls:(id)sender {}

4）實現Switch Action
在BIDViewController.m中的switchChanged方法中添加如下代碼：

- (IBAction)switchChanged:(id)sender {    UISwitch *whichSwitch = (UISwitch *)sender;    BOOL setting = whichSwitch.isOn;    [leftSwitch setOn:setting animated:YES];    [rightSwitch setOn:setting animated:YES];}

因為leftSwitch和rightSwitch都關聯到了switchChanged，因此，無論對哪個switch進行操作，都會調用到該方法，在該方法中，首先將sender強制轉換成UISwitch類型，這樣就可以使用UISwitch定義的屬性了，isOn用來判斷Switch的狀態是開啟還是關閉（Switch僅有的2種狀態），最好根據觸發事件的Switch狀態，將另一個switch也設定成相同的狀態，程式中為了方便，並沒有判斷到底是哪個switch觸發了該Action，只是簡單的將2個switch設成相同的狀態而已。

[rightSwitch setOn:setting animated:YES];

setOn方法是根據後面的BOOL型參數的值來設定Switch的狀態是開啟還是關閉（ON，OFF）。
animated是指當Switch從一種狀態切換到另一種狀態後，其滑塊是否有活動效果，如果是YES，則滑塊滑動的慢點，給人的感覺滑塊是慢慢移動過去的，如果設成NO，滑塊會很快地改變位置，滑動的速度很快。

編譯運行程式，用滑鼠在模擬器中點擊Switch控制項，看看效果，2個switch的值應該始終是一樣的，並且無論點擊哪個switch，另一個switch的值也會隨之改變。
Switch is ON

Switch is OFF

5）添加Button
Segmented Control在這個應用中的作用是切換Switch和Button，且Switch和Button同時只能有一個顯示，另一個必須隱藏，因此我們在switch相同的位置添加Button，並設定Button按鈕的屬性為hidden，程式初始情況下不顯示，然後需要顯示Button時，只需切換segmented的值，Button就會顯示，2個switch會被隱藏。

在2個switch相同的位置上添加一個button

展開button，使其完全遮住2個switch，並雙擊button，輸入"Do Something"

6）為button添加Outlet和Action
添加Outlet是因為我們需要在改變segmented中來控制釋放顯示或隱藏button，當點擊button後，Action會被觸發。
添加Outlet：doSomethingButton

添加Action：buttonPressed

7）隱藏button
之所以到現在才設定button的隱藏屬性（Hidden），是因為這樣子會更加方便添加button的Outlet和Action，容易選擇。
選中button，在attributes inspector的View欄中找到“Hidden”的checkbox，並選中

選中Hidden後，button變成不可見，但是在iphone的布局介面裡，button僅僅是變成了透明而已，其外觀還是可見的，在真實的運行環境裡，button是看不見的。

8）實現segmented的Action
segmented的Action toogleControls我們之前已經添加完畢了，在其中添加如下code

- (IBAction)toggleControls:(id)sender {    if ([sender selectedSegmentIndex] == 0) {        leftSwitch.hidden = NO;        rightSwitch.hidden = NO;        doSomethingButton.hidden = YES;    }    else {        leftSwitch.hidden = YES;        rightSwitch.hidden = YES;        doSomethingButton.hidden = NO;    }}

第一個if語句，使用Segmented Control的selectedSegmentIndex方法來返回segment的哪個值（那一段）被選中（Segmented Control中的塊的index從左至右從0開始編號），如果是第0個，說明Switch段被選中的，因此左右2個switch需要顯示，button需要隱藏，因此設2個switch的hidden屬性值為NO（false，不隱藏），button需呀隱藏，設其hidden值為YES（true，隱藏）。如果不是，則說明第1個被選中（這個程式中的segmented只有2段，不是第0段被選中就是第1段被選中），2個switch需要隱藏，button需要顯示。

編譯運行，程式初始情況下，segmented的第0段被選中，2個switch顯示

滑鼠選中segmented的Button，2個switch隱藏，button顯示

9）下一篇將實現button的Action
到目前為止，所有新添加的控制項，除了button的Action之外，都已經實現了其應有的功能。button的Action將在下一篇中完成，這裡的button Action涉及到2個新的控制項Action Sheet和Alert，這2個控制項有點特殊，他們不是從object library拖到iphone介面上，而是會使用到delegate（其實delegate到目前為止我也不是理解的很清楚，還是有點迷茫，望高人能夠指點），對我來說還有些複雜，因此放到下一篇中講，望大家諒解。

 

Control Fun 3