UIButton控件

UIButton繼承關係以下:框架

  UIButton-->UIControl-->UIView-->UIResponder-->NSObjectide

因爲繼承層次過多,下面只重點介紹UIButton中的經常使用方法和一些事件方法測試

 


 

一、建立一個UIButton對象atom

UIButton提供了以下類方法來建立一個指定類型的UIButton對象spa

1 + (void)buttonWithType:(UIButtonType)buttonType

UIButtonType是一個枚舉類型3d

1 typedef enum{
2     UIButtonTypeCustom = 0; //此屬性代表,該按鈕的外觀行爲主要依靠開發者的設置
3     UIButtonTypeSystem, //IOS系統默認的按鈕風格
4     UIButtonTypeDetailDisclosure, //用於顯示當前列表項的詳情
5     UIButtonTypeInfoLight, //該按鈕用於顯示簡短的說明
6     UIButtonTypeInfoDark, //該按鈕用戶顯示簡短的說明
7     UIButtonTypeContactAdd, //該按鈕一般用於添加聯繫人
8     UIButtonTypeRoundedRect, //圓角矩形的按鈕
9 } UIButtonType;

 下面用代碼來實現各類按鈕 看一看效果吧code

 1     UIButton *button1 = [UIButton buttonWithType:UIButtonTypeSystem];
 2     [button1 setFrame:CGRectMake(130, 50, 60, 30)];
 3     [button1 setTitle:@"按鈕一" forState:UIControlStateNormal];
 4     
 5     UIButton *button2 = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
 6     [button2 setFrame:CGRectMake(149, 100, 22, 22)];
 7     
 8     UIButton *button3 = [UIButton buttonWithType:UIButtonTypeInfoLight];
 9     [button3 setFrame:CGRectMake(149, 150, 22, 22)];
10     
11     UIButton *button4 = [UIButton buttonWithType:UIButtonTypeInfoDark];
12     [button4 setFrame:CGRectMake(149, 200, 22, 22)];
13     
14     UIButton *button5 = [UIButton buttonWithType:UIButtonTypeContactAdd];
15     [button5 setFrame:CGRectMake(149, 250, 22, 22)];
16     
17     UIButton *button6 = [UIButton buttonWithType:UIButtonTypeRoundedRect];
18     [button6 setFrame:CGRectMake(130, 300, 60, 30)];
19     [button6 setTitle:@"按鈕六" forState:UIControlStateNormal];

下面是各個按鈕在IOS6和IOS7下的表現orm

在IOS6下各個按鈕的效果各個按鈕在IOS7中的顯示效果


 

 

二、配置UIButton的樣式對象

2.1首先是一個只讀屬性blog

1 @property(nonatomic, readonly, retain) UILabel *titleLabel 

儘管這個屬性是隻讀的,可是它自己是一個UILable,UILabel的屬性是可寫、可讀的。下面用這個屬性演示修改按鈕的文字效果。代碼以下:

1     UIButton *button1 = [UIButton buttonWithType:UIButtonTypeSystem];
2     [button1 setFrame:CGRectMake(130, 50, 60, 30)];
3     [button1 setTitle:@"按鈕一" forState:UIControlStateNormal];
4     button1.titleLabel.font = [UIFont systemFontOfSize:12];
5     button1.titleLabel.text = @"按鈕3";
6     button1.titleLabel.textColor = [UIColor blueColor];

儘管上面代碼用titleLable屬性修改了按鈕的文本和顏色,但根據官方文檔中的說明,建議不要使用這個lable對象修改文本的顏色和陰影顏色,應該使用setTitleColor:forState:和setTitleShadowColor:forState:方法來代替作這些修改。

另外根據我本身的測試若是將上面的第三行註釋掉,在給按鈕設置文本會無效,不知道爲何。(但願哪位朋友能夠告知緣由,在下感激不盡) 

titleLabel在IOS6上的表現

titleLabel在IOS7上的表現

 

一樣一段代碼在IOS6和IOS7中的表現還不太同樣,在IOS6中按鈕文本已經修改過來啦可是IOS7中卻不起做用,一樣的設置大小都起做用啦,下面的按鈕是默認的按鈕用來對比修改效果的。看來這個tableLabel屬性挺很差駕馭啊。

 

2.2 爲不一樣狀態的按鈕設置文本標題

1 - (void)setTitle:(NSString *)title forState:(UIControlState)state

其中的UIControlState是一個NSUInteger類型的整數值,該參數能夠接受以下定義的一個枚舉值

1 enum {
2    UIControlStateNormal               = 0, //表明按鈕的默認狀態
3    UIControlStateHighlighted          = 1 << 0, //表明按鈕的高亮狀態
4    UIControlStateDisabled             = 1 << 1, //表明按鈕的選中時的狀態
5    UIControlStateSelected             = 1 << 2, //表明按鈕禁用後的狀態
6    UIControlStateApplication          = 0x00FF0000, (這是個啥,我母雞啊)
7    UIControlStateReserved             = 0xFF000000 //表明爲內部框架使用而預留(不明覺厲啊)
8 };

 下面用代碼來實現各類狀態下的按鈕看看是個什麼模樣的,Let‘s go!

 1     UIButton *button1 = [UIButton buttonWithType:UIButtonTypeSystem];
 2     [button1 setFrame:CGRectMake(50, 50, 70, 30)];
 3     [button1 setTitle:@"默認狀態" forState:UIControlStateNormal];
 4 
 5     UIButton *button2 = [UIButton buttonWithType:UIButtonTypeSystem];
 6     [button2 setFrame:CGRectMake(50, 100, 70, 30)];
 7     [button2 setTitle:@"高亮狀態" forState:UIControlStateHighlighted];
 8     [button2 setHighlighted:YES];
 9     
10     UIButton *button3 = [UIButton buttonWithType:UIButtonTypeSystem];
11     [button3 setFrame:CGRectMake(50, 150, 70, 30)];
12     [button3 setTitle:@"選中狀態" forState:UIControlStateSelected];
13     [button3 setSelected:YES];
14     
15     UIButton *button4 = [UIButton buttonWithType:UIButtonTypeSystem];
16     [button4 setFrame:CGRectMake(50, 200, 70, 30)];
17     [button4 setTitle:@"禁用狀態" forState:UIControlStateDisabled];
18     [button4 setEnabled:NO];
19     
20     UIButton *button5 = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
21     [button5 setFrame:CGRectMake(130, 50, 70, 30)];
22     [button5 setTitle:@"默認狀態" forState:UIControlStateNormal];
23     
24     UIButton *button6 = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
25     [button6 setFrame:CGRectMake(130, 100, 70, 30)];
26     [button6 setTitle:@"高亮狀態" forState:UIControlStateHighlighted];
27     [button6 setHighlighted:YES];
28     
29     UIButton *button7 = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
30     [button7 setFrame:CGRectMake(130, 150, 70, 30)];
31     [button7 setTitle:@"選中狀態" forState:UIControlStateSelected];
32     [button7 setSelected:YES];
33     
34     UIButton *button8 = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
35     [button8 setFrame:CGRectMake(130, 200, 70, 30)];
36     [button8 setTitle:@"禁用狀態" forState:UIControlStateDisabled];

以上代碼只實現了系統默認按鈕和Detail按鈕的各類狀態 若是想查看其餘按鈕的狀態能夠修改buttonWithType:方法對應的參數來實現,請你們也親自動手作一下加深印象,上面代碼對應的效果以下:

 IOS6下按鈕的各類狀態對應的文本效果IOS7下按鈕的各類狀態對應的文本效果

IOS7下的Detail按鈕旁邊能夠顯示文字,可是通常都不設置,圖上的狀態是按鈕的寬度不夠文字顯示不下的效果。

2.3爲不一樣狀態的按鈕設置文本標題的顏色以及陰影的顏色

1 - (void)setTitleColor:(UIColor *)color forState:(UIControlState)state
2 - (void)setTitleShadowColor:(UIColor *)color forState:(UIControlState)state

這兩個方法都是與顏色有關的,就放在一塊兒了。其中UIColor是一個類當中預約義了不少顏色的類方法將經常使用顏色都包括了,好比

1 + (UIColor *)blackColor
2 + (UIColor *)blueColor
3 + (UIColor *)redColor

 

等等,假如以上顏色不能知足你的須要還可使用UIColor中的

 1 + (UIColor *)colorWithRed:(CGFloat)red green:(CGFloat)green blue:(CGFloat)blue alpha:(CGFloat)alpha 

使用RGB值和alpha值自定義各類顏色,其中的參數是CGFloat類型的,取值範圍從0.0到1.0。好了關於顏色就到這裏,下面給按鈕文本設置顏色:

 1     UIButton *button1 = [UIButton buttonWithType:UIButtonTypeSystem];
 2     [button1 setFrame:CGRectMake(125, 50, 70, 30)];
 3     [button1 setTitle:@"默認狀態" forState:UIControlStateNormal];
 4     [button1 setTitleColor:[UIColor redColor] forState:UIControlStateNormal]; //爲默認狀態的按鈕設置文本顏色爲紅色
 5     [button1 setTitleShadowColor:[UIColor blackColor] forState:UIControlStateNormal]; //爲默認狀態的按鈕設置文本陰影顏色爲黑色
 6     [button1.titleLabel setShadowOffset: CGSizeMake(2, 2)]; //爲按鈕文本的陰影設置偏移量 右下
 7 
 8     UIButton *button2 = [UIButton buttonWithType:UIButtonTypeSystem];
 9     [button2 setFrame:CGRectMake(125, 100, 70, 30)];
10     [button2 setTitle:@"高亮狀態" forState:UIControlStateHighlighted];
11     [button2 setTitleColor:[UIColor greenColor] forState:UIControlStateHighlighted]; //爲高亮狀態的按鈕設置文本顏色爲綠色
12     [button2 setTitleShadowColor:[UIColor yellowColor] forState:UIControlStateHighlighted]; //爲高亮狀態的按鈕設置文本陰影顏色爲黃色
13     [button2.titleLabel setShadowOffset:CGSizeMake(2, -2)]; //爲按鈕文本的陰影設置偏移量 右上
14     [button2 setHighlighted:YES];
15 
16     UIButton *button3 = [UIButton buttonWithType:UIButtonTypeSystem];
17     [button3 setFrame:CGRectMake(125, 150, 70, 30)];
18     [button3 setTitle:@"選中狀態" forState:UIControlStateSelected];
19     [button3 setTitleColor:[UIColor blueColor] forState:UIControlStateSelected]; //爲選中狀態的按鈕設置文本顏色爲藍色
20     [button3 setTitleShadowColor:[UIColor grayColor] forState:UIControlStateSelected]; //爲選中狀態的按鈕設置文本陰影顏色爲灰色
21     [button3.titleLabel setShadowOffset:CGSizeMake(-2, 2)]; //爲按鈕文本的陰影設置偏移量 左下
22     [button3 setSelected:YES];
23 
24     UIButton *button4 = [UIButton buttonWithType:UIButtonTypeSystem];
25     [button4 setFrame:CGRectMake(125, 200, 70, 30)];
26     [button4 setTitle:@"禁用狀態" forState:UIControlStateDisabled];
27     [button4 setTitleColor:[UIColor purpleColor] forState:UIControlStateDisabled]; //爲禁用狀態的按鈕設置文本顏色爲紫色
28     [button4 setTitleShadowColor:[UIColor darkGrayColor] forState:UIControlStateDisabled]; //爲禁用狀態的按鈕設置文本陰影顏色爲深灰色
29     [button4.titleLabel setShadowOffset:CGSizeMake(-2, -2)]; //爲按鈕文本的陰影設置偏移量 左上
30     [button4 setEnabled:NO];

 

以上代碼對應的效果圖以下:

IOS6下按鈕文本顏色以及按鈕陰影顏色IOS7下按鈕文本顏色以及按鈕陰影顏色

在IOS7中的按鈕樣式發生了很大改變,爲高亮狀態的按鈕設置的陰影是黃色,有些看不清了。

2.4爲不一樣狀態的按鈕設置背景圖片和圖片按鈕

1 - (void)setBackgroundImage:(UIImage *)image forState:(UIControlState)state //用於但願既有圖片背景又有按鈕文本的狀況
2 - (void)setImage:(UIImage *)image forState:(UIControlState)state //該方法會讓按鈕呈現爲一個圖片按鈕,使前面爲按鈕設置的Title屬性不起做用

咱們首先準備兩張圖片用一個矩形的圖片做爲按鈕背景,再來一個不是矩形的圖片做爲圖片按鈕:

     

就用上面的兩個圖片來實現一下看看效果,代碼以下:

 1     UIButton *button1 = [UIButton buttonWithType:UIButtonTypeSystem];
 2     [button1 setFrame:CGRectMake(125, 50, 70, 30)];
 3     [button1 setTitle:@"按鈕一" forState:UIControlStateNormal];
 4     [button1 setTitleColor:[UIColor redColor] forState:UIControlStateNormal]; //爲默認狀態的按鈕設置文本顏色爲紅色
 5     [button1 setBackgroundImage:[UIImage imageNamed:@"buttonBg.png"] forState:UIControlStateNormal]; //給圖片設置一個背景圖
 6 
 7     UIButton *button2 = [UIButton buttonWithType:UIButtonTypeCustom]; //建立一個自定義的按鈕類型
 8     [button2 setFrame:CGRectMake(135, 100, 50, 50)];
 9     [button2 setTitle:@"按鈕二" forState:UIControlStateHighlighted]; //此語句不起做用
10     [button2 setImage:[UIImage imageNamed:@"camaraBtn.png"] forState:UIControlStateNormal]; //由於咱們使用了圖片做爲按鈕,因此上面爲按鈕設置的文本就不起做用了。
11     //另外還要將按鈕的類型改成自定義纔會顯示出圖片
12     //還能夠爲不一樣狀態的按鈕設置不一樣的圖片創造出本身的按鈕

以上代碼在IOS6和IOS7中是同樣的因此就來一張IOS7中的圖片好了。

 IOS7中按鈕圖片背景和圖片按鈕效果

3.按鈕的事件處理

按鈕最主要的做用不就是響應用戶的的操做嘛,上面說了那麼多設置按鈕樣式的方法,沒有事件處理的方法叫什麼按鈕是否是。

UIButton繼承了UIControl因此可使用UIControl提供的事件處理方法,經常使用的有以下:

1 - (void)addTarget:(id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents //給目標添加事件
2 - (void)removeTarget:(id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents //移除目標上的事件

 

咱們就用上面的照相機按鈕例子給按鈕添加一個事件,彈出一個警告對話框(UIAlertView),在警告對話框中的按鈕再移除照相機按鈕的事件,廢話很少說開整:

按鈕初始化及綁定事件部分

1     self.camaraBtn = [UIButton buttonWithType:UIButtonTypeCustom]; //建立一個自定義的按鈕類型
2     [self.camaraBtn setFrame:CGRectMake(135, 100, 50, 50)];
3     [self.camaraBtn setTitle:@"按鈕二" forState:UIControlStateHighlighted]; //此語句不起做用
4     [self.camaraBtn setImage:[UIImage imageNamed:@"camaraBtn.png"] forState:UIControlStateNormal]; //由於咱們使用了圖片做爲按鈕,因此上面爲按鈕設置的文本就不起做用了。
5     //另外還要將按鈕的類型改成自定義纔會顯示出圖片
6     //還能夠爲不一樣狀態的按鈕設置不一樣的圖片創造出本身的按鈕
7     
8     [self.camaraBtn addTarget:self action:@selector(clicked:) forControlEvents:UIControlEventTouchUpInside]; //給按鈕添加事件,目標位爲self就是當前這個試圖控制器,事件處理方法爲clicked:,後面是事件名稱,是當在按鈕範圍之中按下並擡起時觸發,這個名字那麼長其實就跟click差很少
9     [self.view addSubview:self.camaraBtn]; //將按鈕添加到當前視圖中

 

這裏我將camaraBtn做爲了實例變量,以便事件處理方法能夠引用到這個按鈕,須要在頭文件中寫入:

1 @property (nonatomic,strong) UIButton *camaraBtn;

 

下面是事件處理方法了

 1 //這個是照相機按鈕的事件處理方法
 2 - (void)clicked:(id)sender
 3 {
 4     UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"事件響應" message:@"我是個照相機!" delegate:self cancelButtonTitle:@"肯定" otherButtonTitles:nil];
 5     [alert show];//這裏建立了一個警告框並顯示了出來
 6 }
 7 //這個是警告框上按鈕的事件處理方法,因爲警告框(UIAlertView)沒有繼承UIControl因此必須實現UIAlertViewDelegate來重寫這個方法實現事件處理
 8 - (void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex
 9 {
10     if (!buttonIndex){
11         //警告框中的肯定按鈕的index是0因此會執行這個移除事件方法
12         [self.camaraBtn removeTarget:self action:@selector(clicked:) forControlEvents:UIControlEventTouchUpInside];
13         //將照相機按鈕上的事件移除
14     }
15 }

 

因此上面的照相機按鈕彈出一個警告框後點擊肯定照相機按鈕就無效了。來看看效果吧:

IOS6下按鈕彈出UIAlertView的效果IOS7下按鈕彈出UIAlertView的效果

 

先寫這麼多經常使用的之後再更新..

相關文章
相關標籤/搜索