UIButton的用處特別多，這里只記錄下把按鈕應用在圖文顯示的場景，和需要把圖片作為按鈕的背景圖片顯示場景；

另外記錄下在父控件的子控件優先顯示方法（控件置于最前面和置于最后面）。

先上效果圖：

?

1、當在某個地方既需要顯示圖片，還需要顯示文字，另外還要有點擊功能的時候，這時按鈕是個很好的選擇。

　　按鈕中的圖片和文字的距離可以自由調整，圖片的也可以上下左右翻轉。日常項目中像這些場景都是很容易碰到的。

　　按鈕圖文設置、圖文位置移動、按鈕中圖片翻轉示例代碼：

/** 測試圖文并茂的按鈕，圖文移動 */ - (void)addMoveImgAndTextButton{//1、創建一個按鈕：30x50UIButton *iconBtn = [[UIButton alloc] initWithFrame:CGRectMake(10, 100, 150, 80)];[iconBtn setTitle:@"我的好友" forState:UIControlStateNormal];[iconBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];[iconBtn setImage:[UIImage imageNamed:@"pointer"] forState:UIControlStateNormal];iconBtn.layer.borderColor = [UIColor redColor].CGColor; //邊框顏色iconBtn.layer.borderWidth = 1; //邊框寬度iconBtn.titleLabel.backgroundColor = [UIColor greenColor]; //文字顏色iconBtn.imageView.backgroundColor = [UIColor blackColor]; //圖片顏色 [iconBtn addTarget:self action:@selector(clickButton:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:iconBtn];self.iconBtn = iconBtn;//2、移動iconBtn按鈕圖片和文字UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(170, 100, 120, 45)];[btn setTitle:@"圖右移字左移" forState:UIControlStateNormal];btn.titleLabel.numberOfLines = 0;[btn setBackgroundColor:[UIColor blackColor]];[btn addTarget:self action:@selector(changeBtnFrame:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:btn];//3、移動iconBtn按鈕圖片和文字UIButton *btn2 = [[UIButton alloc] initWithFrame:CGRectMake(170, 150, 120, 45)];[btn2 setTitle:@"字右移圖左移" forState:UIControlStateNormal];btn2.titleLabel.numberOfLines = 0;[btn2 setBackgroundColor:[UIColor blackColor]];[btn2 addTarget:self action:@selector(changeBtnFrame2:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:btn2];//分割線UIView *lineView = [[UIView alloc] initWithFrame:CGRectMake(0, 210, 500, 1)];lineView.backgroundColor = [UIColor grayColor];[self.view addSubview:lineView]; }/** 點擊按鈕使圖片位置翻轉 */ - (void)clickButton:(UIButton *)sender{sender.imageView.transform = CGAffineTransformRotate(sender.imageView.transform, M_PI); }/** 移動圖片和文字位置 */ - (void)changeBtnFrame:(UIButton *)sender{UIEdgeInsets edge = self.iconBtn.imageEdgeInsets;CGFloat changeNum = 10;self.iconBtn.imageEdgeInsets = UIEdgeInsetsMake(0, edge.left + changeNum, 0, -(edge.left + changeNum));self.iconBtn.titleEdgeInsets = UIEdgeInsetsMake(0, -(edge.left + changeNum), 0, edge.left + changeNum);NSLog(@"edge.left: %f, edge.right: %f", edge.left, edge.right); }/** 反方向移動圖片和文字位置 */ - (void)changeBtnFrame2:(UIButton *)sender{UIEdgeInsets edge = self.iconBtn.imageEdgeInsets;CGFloat changeNum = 10;self.iconBtn.imageEdgeInsets = UIEdgeInsetsMake(0, edge.left - changeNum, 0, -(edge.left - changeNum));self.iconBtn.titleEdgeInsets = UIEdgeInsetsMake(0, -(edge.left - changeNum), 0, edge.left - changeNum);NSLog(@"...edge.left: %f, edge.right: %f", edge.left, edge.right); } View Code

?

2、有時候需要給按鈕設置背景圖片，一般UI給個圖片，然后我們自己對圖片進行處理，讓背景圖片自適應按鈕展示，矩形圓角。

　　但是有時候，產品要求顯示的按鈕左右必須是圓形的，這時候雖然可以讓ui切個適配的圖片做背景，其實針對如果是背景圖片是純色的話，我們可以利用

控件的layer.masksToBounds， 和layer.cornerRadius屬性來讓按鈕或者其他控件左右兩邊都是圓形的。

下面寫了五個橙色背景的按鈕作比較：背景圖片和按鈕尺寸匹配的、背景圖片和按鈕尺寸或偏大或偏小的、處理背景圖片讓背景圖片自適應按鈕的、不用背景圖片使用圖層來設置按鈕左右圓形的：

/** 測試給按鈕設置背景圖片 */ - (void)addBackgroundImgButton{//4、96x25 按鈕設置背景圖片，顏色rgb(255,145,0)UIImage *img = [UIImage imageNamed:@"btn_bg"];UIButton *clickBtn = [[UIButton alloc] initWithFrame:CGRectMake(10, 240, 96, 25)];[clickBtn setBackgroundImage:img forState:UIControlStateNormal];[clickBtn setTitle:@"click Me" forState:UIControlStateNormal];[self.view addSubview:clickBtn];//4.2 給按鈕設置背景圖片, 按鈕圖片不適配UIButton *clickBtn2 = [[UIButton alloc] initWithFrame:CGRectMake(120, 220, 120, 50)];[clickBtn2 setBackgroundImage:img forState:UIControlStateNormal];[clickBtn2 setTitle:@"click Me" forState:UIControlStateNormal];[self.view addSubview:clickBtn2];//4.3 給按鈕設置背景圖片，按鈕和圖片不適配UIButton *clickBtn3 = [[UIButton alloc] initWithFrame:CGRectMake(260, 240, 80, 15)];[clickBtn3 setBackgroundImage:img forState:UIControlStateNormal];[clickBtn3 setTitle:@"click Me" forState:UIControlStateNormal];[self.view addSubview:clickBtn3];//4.4 處理背景圖片，讓背景圖片自適應按鈕NSLog(@"img.size: %@", NSStringFromCGSize(img.size));UIImage *newImg = [img stretchableImageWithLeftCapWidth:img.size.width/2 topCapHeight:img.size.height/2];NSLog(@"newImg.size: %@", NSStringFromCGSize(newImg.size));UIButton *clickBtn4 = [[UIButton alloc] initWithFrame:CGRectMake(10, 300, 150, 60)];[clickBtn4 setBackgroundImage:newImg forState:UIControlStateNormal];[clickBtn4 setTitle:@"click Me" forState:UIControlStateNormal];[self.view addSubview:clickBtn4];//4.5 按鈕不使用背景圖片，設置背景顏色當做有背景圖片UIButton *clickBtn5 = [[UIButton alloc] initWithFrame:CGRectMake(180, 300, 150, 60)];[clickBtn5 setTitle:@"click Me" forState:UIControlStateNormal];clickBtn5.layer.masksToBounds = YES;clickBtn5.layer.cornerRadius = 30;clickBtn5.backgroundColor = [UIColor colorWithRed:255/255.f green:145/255.f blue:0 alpha:1];[self.view addSubview:clickBtn5];//分割線UIView *lineView = [[UIView alloc] initWithFrame:CGRectMake(0, 380, 500, 1)];lineView.backgroundColor = [UIColor grayColor];[self.view addSubview:lineView]; } View Code

?

3、在有些場景下，需要控制控件的優先顯示或者置后顯示，需要用到方法

- (void)bringSubviewToFront:(UIView *)view; ?// 將子控件view顯示在父控件的所有子控件的最前面

- (void)sendSubviewToBack:(UIView *)view; ?//將子控件view顯示在父控件的所有子控件的最后面

示例代碼：

/** 測試子控件的優先顯示（置前和置后） */ - (void)testSubControlShowFront{//1、紅色viewUIView *redView = [[UIView alloc] initWithFrame:CGRectMake(10, 420, 200, 200)];redView.backgroundColor = [UIColor redColor];redView.tag = 11;[self.view addSubview:redView];//2、黑色viewUIView *blackView = [[UIView alloc] initWithFrame:CGRectMake(30, 400, 200, 200)];blackView.backgroundColor = [UIColor blackColor];blackView.tag = 12;[self.view addSubview:blackView];//3、紫色viewUIView *purpleView = [[UIView alloc] initWithFrame:CGRectMake(50, 440, 200, 200)];purpleView.backgroundColor = [UIColor purpleColor];purpleView.tag = 13;[self.view addSubview:purpleView];//添加操作按鈕UIButton *operatorBtn = [[UIButton alloc] initWithFrame:CGRectMake(280, 400, 100, 30)];[operatorBtn setTitle:@"紅色置前" forState:UIControlStateNormal];operatorBtn.tag = 1;operatorBtn.backgroundColor = [UIColor blackColor];[operatorBtn addTarget:self action:@selector(changeViewToFrontShow:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:operatorBtn];UIButton *operatorBtn2 = [[UIButton alloc] initWithFrame:CGRectMake(280, 450, 100, 30)];[operatorBtn2 setTitle:@"黑色置前" forState:UIControlStateNormal];operatorBtn2.tag = 2;operatorBtn2.backgroundColor = [UIColor blackColor];[operatorBtn2 addTarget:self action:@selector(changeViewToFrontShow:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:operatorBtn2];UIButton *operatorBtn3 = [[UIButton alloc] initWithFrame:CGRectMake(280, 500, 100, 30)];[operatorBtn3 setTitle:@"紫色置前" forState:UIControlStateNormal];operatorBtn3.tag = 3;operatorBtn3.backgroundColor = [UIColor blackColor];[operatorBtn3 addTarget:self action:@selector(changeViewToFrontShow:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:operatorBtn3];UIButton *operatorBtn4 = [[UIButton alloc] initWithFrame:CGRectMake(280, 550, 100, 30)];[operatorBtn4 setTitle:@"紫色置后" forState:UIControlStateNormal];operatorBtn4.tag = 4;operatorBtn4.backgroundColor = [UIColor redColor];[operatorBtn4 addTarget:self action:@selector(changeViewToFrontShow:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:operatorBtn4]; } /** 操作按鈕，切換view置前顯示 */ - (void)changeViewToFrontShow:(UIButton *)sender{if (sender.tag == 1){//紅色置前UIView *redView = [self.view viewWithTag:11];//將子控件redView在父控件view的所有子控件的最前面顯示 [self.view bringSubviewToFront:redView];}else if (sender.tag == 2){//黑色置前UIView *blackView = [self.view viewWithTag:12]; //獲取黑色子控件//將子控件blackView在父控件view的所有子控件的最前面顯示 [self.view bringSubviewToFront:blackView];}else if (sender.tag == 3){//紫色置前UIView *purpleView = [self.view viewWithTag:13]; //獲取紫色子控件//將子控件purpleView在父控件view的所有子控件的最前面顯示 [self.view bringSubviewToFront:purpleView];}else if (sender.tag == 4){//紫色置后UIView *purpleView = [self.view viewWithTag:13]; //獲取紫色子控件//將子控件purpleView在父控件view的所有子控件的最后面顯示 [self.view sendSubviewToBack:purpleView];} } View Code

?

------------------------------------------------------------------------------

----- ?完整代碼 ?------

// // TestButtonVC.m // tan_iosTwo // // Created by PX_Mac on 16/10/16. // // #import "TestButtonVC.h"@interface TestButtonVC ()@property (nonatomic, weak) UIButton *iconBtn; //帶文字和圖片的按鈕@end@implementation TestButtonVC- (void)viewDidLoad {[super viewDidLoad];// Do any additional setup after loading the view. [self addMoveImgAndTextButton]; //添加圖文并茂的按鈕，測試按鈕上的圖文移動 [self addBackgroundImgButton]; //添加設置背景圖片的按鈕 [self testSubControlShowFront]; //測試子控件的優先或置后顯示 }/** 測試圖文并茂的按鈕，圖文移動 */ - (void)addMoveImgAndTextButton{//1、創建一個按鈕：30x50UIButton *iconBtn = [[UIButton alloc] initWithFrame:CGRectMake(10, 100, 150, 80)];[iconBtn setTitle:@"我的好友" forState:UIControlStateNormal];[iconBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];[iconBtn setImage:[UIImage imageNamed:@"pointer"] forState:UIControlStateNormal];iconBtn.layer.borderColor = [UIColor redColor].CGColor; //邊框顏色iconBtn.layer.borderWidth = 1; //邊框寬度iconBtn.titleLabel.backgroundColor = [UIColor greenColor]; //文字顏色iconBtn.imageView.backgroundColor = [UIColor blackColor]; //圖片顏色 [iconBtn addTarget:self action:@selector(clickButton:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:iconBtn];self.iconBtn = iconBtn;//2、移動iconBtn按鈕圖片和文字UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(170, 100, 120, 45)];[btn setTitle:@"圖右移字左移" forState:UIControlStateNormal];btn.titleLabel.numberOfLines = 0;[btn setBackgroundColor:[UIColor blackColor]];[btn addTarget:self action:@selector(changeBtnFrame:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:btn];//3、移動iconBtn按鈕圖片和文字UIButton *btn2 = [[UIButton alloc] initWithFrame:CGRectMake(170, 150, 120, 45)];[btn2 setTitle:@"字右移圖左移" forState:UIControlStateNormal];btn2.titleLabel.numberOfLines = 0;[btn2 setBackgroundColor:[UIColor blackColor]];[btn2 addTarget:self action:@selector(changeBtnFrame2:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:btn2];//分割線UIView *lineView = [[UIView alloc] initWithFrame:CGRectMake(0, 210, 500, 1)];lineView.backgroundColor = [UIColor grayColor];[self.view addSubview:lineView]; }/** 點擊按鈕使圖片位置翻轉 */ - (void)clickButton:(UIButton *)sender{sender.imageView.transform = CGAffineTransformRotate(sender.imageView.transform, M_PI); }/** 移動圖片和文字位置 */ - (void)changeBtnFrame:(UIButton *)sender{UIEdgeInsets edge = self.iconBtn.imageEdgeInsets;CGFloat changeNum = 10;self.iconBtn.imageEdgeInsets = UIEdgeInsetsMake(0, edge.left + changeNum, 0, -(edge.left + changeNum));self.iconBtn.titleEdgeInsets = UIEdgeInsetsMake(0, -(edge.left + changeNum), 0, edge.left + changeNum);NSLog(@"edge.left: %f, edge.right: %f", edge.left, edge.right); }/** 反方向移動圖片和文字位置 */ - (void)changeBtnFrame2:(UIButton *)sender{UIEdgeInsets edge = self.iconBtn.imageEdgeInsets;CGFloat changeNum = 10;self.iconBtn.imageEdgeInsets = UIEdgeInsetsMake(0, edge.left - changeNum, 0, -(edge.left - changeNum));self.iconBtn.titleEdgeInsets = UIEdgeInsetsMake(0, -(edge.left - changeNum), 0, edge.left - changeNum);NSLog(@"...edge.left: %f, edge.right: %f", edge.left, edge.right); }/** 測試給按鈕設置背景圖片 */ - (void)addBackgroundImgButton{//4、96x25 按鈕設置背景圖片，顏色rgb(255,145,0)UIImage *img = [UIImage imageNamed:@"btn_bg"];UIButton *clickBtn = [[UIButton alloc] initWithFrame:CGRectMake(10, 240, 96, 25)];[clickBtn setBackgroundImage:img forState:UIControlStateNormal];[clickBtn setTitle:@"click Me" forState:UIControlStateNormal];[self.view addSubview:clickBtn];//4.2 給按鈕設置背景圖片, 按鈕圖片不適配UIButton *clickBtn2 = [[UIButton alloc] initWithFrame:CGRectMake(120, 220, 120, 50)];[clickBtn2 setBackgroundImage:img forState:UIControlStateNormal];[clickBtn2 setTitle:@"click Me" forState:UIControlStateNormal];[self.view addSubview:clickBtn2];//4.3 給按鈕設置背景圖片，按鈕和圖片不適配UIButton *clickBtn3 = [[UIButton alloc] initWithFrame:CGRectMake(260, 240, 80, 15)];[clickBtn3 setBackgroundImage:img forState:UIControlStateNormal];[clickBtn3 setTitle:@"click Me" forState:UIControlStateNormal];[self.view addSubview:clickBtn3];//4.4 處理背景圖片，讓背景圖片自適應按鈕NSLog(@"img.size: %@", NSStringFromCGSize(img.size));UIImage *newImg = [img stretchableImageWithLeftCapWidth:img.size.width/2 topCapHeight:img.size.height/2];NSLog(@"newImg.size: %@", NSStringFromCGSize(newImg.size));UIButton *clickBtn4 = [[UIButton alloc] initWithFrame:CGRectMake(10, 300, 150, 60)];[clickBtn4 setBackgroundImage:newImg forState:UIControlStateNormal];[clickBtn4 setTitle:@"click Me" forState:UIControlStateNormal];[self.view addSubview:clickBtn4];//4.5 按鈕不使用背景圖片，設置背景顏色當做有背景圖片UIButton *clickBtn5 = [[UIButton alloc] initWithFrame:CGRectMake(180, 300, 150, 60)];[clickBtn5 setTitle:@"click Me" forState:UIControlStateNormal];clickBtn5.layer.masksToBounds = YES;clickBtn5.layer.cornerRadius = 30;clickBtn5.backgroundColor = [UIColor colorWithRed:255/255.f green:145/255.f blue:0 alpha:1];[self.view addSubview:clickBtn5];//分割線UIView *lineView = [[UIView alloc] initWithFrame:CGRectMake(0, 380, 500, 1)];lineView.backgroundColor = [UIColor grayColor];[self.view addSubview:lineView]; }/** 測試子控件的優先顯示（置前和置后） */ - (void)testSubControlShowFront{//1、紅色viewUIView *redView = [[UIView alloc] initWithFrame:CGRectMake(10, 420, 200, 200)];redView.backgroundColor = [UIColor redColor];redView.tag = 11;[self.view addSubview:redView];//2、黑色viewUIView *blackView = [[UIView alloc] initWithFrame:CGRectMake(30, 400, 200, 200)];blackView.backgroundColor = [UIColor blackColor];blackView.tag = 12;[self.view addSubview:blackView];//3、紫色viewUIView *purpleView = [[UIView alloc] initWithFrame:CGRectMake(50, 440, 200, 200)];purpleView.backgroundColor = [UIColor purpleColor];purpleView.tag = 13;[self.view addSubview:purpleView];//添加操作按鈕UIButton *operatorBtn = [[UIButton alloc] initWithFrame:CGRectMake(280, 400, 100, 30)];[operatorBtn setTitle:@"紅色置前" forState:UIControlStateNormal];operatorBtn.tag = 1;operatorBtn.backgroundColor = [UIColor blackColor];[operatorBtn addTarget:self action:@selector(changeViewToFrontShow:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:operatorBtn];UIButton *operatorBtn2 = [[UIButton alloc] initWithFrame:CGRectMake(280, 450, 100, 30)];[operatorBtn2 setTitle:@"黑色置前" forState:UIControlStateNormal];operatorBtn2.tag = 2;operatorBtn2.backgroundColor = [UIColor blackColor];[operatorBtn2 addTarget:self action:@selector(changeViewToFrontShow:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:operatorBtn2];UIButton *operatorBtn3 = [[UIButton alloc] initWithFrame:CGRectMake(280, 500, 100, 30)];[operatorBtn3 setTitle:@"紫色置前" forState:UIControlStateNormal];operatorBtn3.tag = 3;operatorBtn3.backgroundColor = [UIColor blackColor];[operatorBtn3 addTarget:self action:@selector(changeViewToFrontShow:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:operatorBtn3];UIButton *operatorBtn4 = [[UIButton alloc] initWithFrame:CGRectMake(280, 550, 100, 30)];[operatorBtn4 setTitle:@"紫色置后" forState:UIControlStateNormal];operatorBtn4.tag = 4;operatorBtn4.backgroundColor = [UIColor redColor];[operatorBtn4 addTarget:self action:@selector(changeViewToFrontShow:) forControlEvents:UIControlEventTouchUpInside];[self.view addSubview:operatorBtn4]; } /** 操作按鈕，切換view置前顯示 */ - (void)changeViewToFrontShow:(UIButton *)sender{if (sender.tag == 1){//紅色置前UIView *redView = [self.view viewWithTag:11];//將子控件redView在父控件view的所有子控件的最前面顯示 [self.view bringSubviewToFront:redView];}else if (sender.tag == 2){//黑色置前UIView *blackView = [self.view viewWithTag:12]; //獲取黑色子控件//將子控件blackView在父控件view的所有子控件的最前面顯示 [self.view bringSubviewToFront:blackView];}else if (sender.tag == 3){//紫色置前UIView *purpleView = [self.view viewWithTag:13]; //獲取紫色子控件//將子控件purpleView在父控件view的所有子控件的最前面顯示 [self.view bringSubviewToFront:purpleView];}else if (sender.tag == 4){//紫色置后UIView *purpleView = [self.view viewWithTag:13]; //獲取紫色子控件//將子控件purpleView在父控件view的所有子控件的最后面顯示 [self.view sendSubviewToBack:purpleView];} }- (void)didReceiveMemoryWarning {[super didReceiveMemoryWarning];// Dispose of any resources that can be recreated. }/* #pragma mark - Navigation// In a storyboard-based application, you will often want to do a little preparation before navigation - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {// Get the new view controller using [segue destinationViewController].// Pass the selected object to the new view controller. } */@end View Code

?

作者：xmTan
出處：http://www.cnblogs.com/tandaxia/
歡迎轉載，但要在文章頁面明顯位置給出原文鏈接，否則保留追究法律責任的權利。
歡迎指出博客中的錯誤。以免更多的人被誤導。

轉載于:https://www.cnblogs.com/tandaxia/p/5975729.html

總結

以上是生活随笔為你收集整理的记录下UIButton的图文妙用和子控件的优先显示的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。