IOS開發基礎篇--手寫控件，frame，center和bounds屬性
iOS開發UI基礎—手寫控件，frame，center和bounds屬性
1、手寫控件
1.手寫控件的步驟
（1）使用相應的控件類建立控件對象
（2）設置該控件的各類屬性
（3）添加控件到視圖中
（4）若是是button等控件，還需考慮控件的單擊事件等
（5）注意：View Contollor和view的關係
2.注意點
在OC開發中，Storyboard中的全部操做均可以經過代碼實現，程序員必定要熟練掌握代碼佈局界面的能力！
設置控件監聽方法的示例代碼以下：
[btn addTarget:self action:@selector(click:) forControlEvents:UIControlEventTouchUpInside];
提示：
1> addTarget方法定義在UIControl類中，這意味着能夠給全部繼承自UIControl類的對象添加監聽方法
2> 監聽方法的第一個參數就是對象自己
3> 監聽方法的第二個參數是監聽控件的事件
3.代碼示例
1 //1.使用類建立一個按鈕對象
2 // UIButton *headbtn=[[UIButton alloc] initWithFrame:CGRectMake(100 ,100, 100, 100)];
3 //設置按鈕對象爲自定義型
4 UIButton *headbtn=[UIButton buttonWithType:UIButtonTypeCustom];
5
6 //2.設置對象的各項屬性
7 //(1)位置等通用屬性設置
8 headbtn.frame=CGRectMake(100, 100, 100, 100);
9
10 //(2)設置普通狀態下按鈕的屬性
11 [headbtn setBackgroundImage:[UIImage imageNamed:@"i"] forState:UIControlStateNormal];
12 [headbtn setTitle:@"點我！" forState:UIControlStateNormal];
13 [headbtn setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
14
15 //(3)設置高亮狀態下按鈕的屬性
16 [headbtn setBackgroundImage:[UIImage imageNamed:@"a"] forState:UIControlStateHighlighted];
17 [headbtn setTitle:@"還行吧~" forState:UIControlStateHighlighted];
18 [headbtn setTitleColor:[UIColor blueColor] forState:UIControlStateHighlighted];
19
20 //3.把對象添加到視圖中展示出來
21 [self.view addSubview:headbtn];
22 //注意點！
23 self.headImageView=headbtn;
2、frame，center和bounds屬性
1.frame、center和bounds屬性
frame:控制位置和大小
center:控制位置（中心點）
bounds：控制大小（以本身的左上角爲原點）
2.注意點
（1）經過如下屬性能夠修改控件的位置
frame.origin
center
（2）經過如下屬性能夠修改控件的尺寸
frame.size
bounds.size
3.代碼示例
一個控制圖片上下左右平移，縮放的程序（frame、center和bounds屬性）
1 //
2 // YYViewController.m
3 // 01-練習使用按鈕的frame和center屬性
4 //
5 // Created by apple on 14-5-21.
6 // Copyright (c) 2014年 itcase. All rights reserved.
7 //
8
9 #import "YYViewController.h"
10
11 //私有擴展
12 @interface YYViewController ()
13
14 @property(nonatomic,weak)IBOutlet UIButton *headImageView;
15 @end
16
17 @implementation YYViewController
18
19 //枚舉類型，從1開始
20 typedef enum
21 {
22 ktopbtntag=1,
23 kdownbtntag,
24 krightbtntag,
25 kleftbtntag
26 }btntag;
27
28 //viewDidLoad是視圖加載完成後調用的方法，一般在此方法中執行視圖控制器的初始化工做
29 - (void)viewDidLoad
30 {
31
32 //在viewDidLoad方法中，不要忘記調用父類的方法實現
33 [super viewDidLoad];
34
35
36 //手寫控件代碼
37 //1、寫一個按鈕控件，上面有一張圖片
38
39 //1.使用類建立一個按鈕對象
40 // UIButton *headbtn=[[UIButton alloc] initWithFrame:CGRectMake(100 ,100, 100, 100)];
41 //設置按鈕對象爲自定義型
42 UIButton *headbtn=[UIButton buttonWithType:UIButtonTypeCustom];
43
44 //2.設置對象的各項屬性
45 //(1)位置等通用屬性設置
46 headbtn.frame=CGRectMake(100, 100, 100, 100);
47
48 //(2)設置普通狀態下按鈕的屬性
49 [headbtn setBackgroundImage:[UIImage imageNamed:@"i"] forState:UIControlStateNormal];
50 [headbtn setTitle:@"點我！" forState:UIControlStateNormal];
51 [headbtn setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
52
53 //(3)設置高亮狀態下按鈕的屬性
54 [headbtn setBackgroundImage:[UIImage imageNamed:@"a"] forState:UIControlStateHighlighted];
55 [headbtn setTitle:@"還行吧~" forState:UIControlStateHighlighted];
56 [headbtn setTitleColor:[UIColor blueColor] forState:UIControlStateHighlighted];
57
58 //3.把對象添加到視圖中展示出來
59 [self.view addSubview:headbtn];
60 //注意點！
61 self.headImageView=headbtn;
62
63
64 //2、寫四個控制圖片左右上下移動方向的按鈕控件
65
66 /**================向上的按鈕=====================*/
67 //1.建立按鈕對象
68 UIButton *topbtn=[UIButton buttonWithType:UIButtonTypeCustom];
69
70 //2.設置對象的屬性
71 topbtn.frame=CGRectMake(100, 250, 40, 40);
72 [topbtn setBackgroundImage:[UIImage imageNamed:@"top_normal"] forState:UIControlStateNormal];
73 [topbtn setBackgroundImage:[UIImage imageNamed:@"top_highlighted"] forState:UIControlStateHighlighted];
74 [topbtn setTag:1];
75 //3.把控件添加到視圖中
76 [self.view addSubview:topbtn];
77
78 //4.按鈕的單擊控制事件
79 [topbtn addTarget:self action:@selector(Click:) forControlEvents:UIControlEventTouchUpInside];
80
81
82 /**================向下的按鈕=====================*/
83 //1.建立按鈕對象
84 UIButton *downbtn=[UIButton buttonWithType:UIButtonTypeCustom];
85 //2.設置對象的屬性
86 downbtn.frame=CGRectMake(100, 350, 40, 40);
87 [downbtn setBackgroundImage:[UIImage imageNamed:@"bottom_normal"] forState:UIControlStateNormal];
88 [downbtn setBackgroundImage:[UIImage imageNamed:@"bottom_highlighted"] forState:UIControlStateHighlighted];
89 [downbtn setTag:2];
90 //3.把控件添加到視圖中
91 [self.view addSubview:downbtn];
92
93 //4.按鈕的單擊控制事件
94 [downbtn addTarget:self action:@selector(Click:) forControlEvents:UIControlEventTouchUpInside];
95
96
97 /**================向左的按鈕=====================*/
98 //1.建立按鈕對象
99 UIButton *leftbtn=[UIButton buttonWithType:UIButtonTypeCustom];
100 //2.設置對象的屬性
101 leftbtn.frame=CGRectMake(50, 300, 40, 40);
102 [leftbtn setBackgroundImage:[UIImage imageNamed:@"left_normal"] forState:UIControlStateNormal];
103 [leftbtn setBackgroundImage:[UIImage imageNamed:@"left_highlighted"] forState:UIControlStateHighlighted];
104 [leftbtn setTag:4];
105 //3.把控件添加到視圖中
106 [self.view addSubview:leftbtn];
107
108 //4.按鈕的單擊控制事件
109 [leftbtn addTarget:self action:@selector(Click:) forControlEvents:UIControlEventTouchUpInside];
110
111
112
113 /**================向右的按鈕=====================*/
114 //1.建立按鈕對象
115 UIButton *rightbtn=[UIButton buttonWithType:UIButtonTypeCustom];
116 //2.設置對象的屬性
117 rightbtn.frame=CGRectMake(150, 300, 40, 40);
118 [rightbtn setBackgroundImage:[UIImage imageNamed:@"right_normal"] forState:UIControlStateNormal];
119 [rightbtn setBackgroundImage:[UIImage imageNamed:@"right_highlighted"] forState:UIControlStateHighlighted];
120 [rightbtn setTag:3];
121 //3.把控件添加到視圖中
122 [self.view addSubview:rightbtn];
123
124 //4.按鈕的單擊控制事件
125 [rightbtn addTarget:self action:@selector(Click:) forControlEvents:UIControlEventTouchUpInside];
126
127 //3、寫兩個縮放按鈕
128 /**================放大的按鈕=====================*/
129 //1.建立對象
130 UIButton *plusbtn=[UIButton buttonWithType:UIButtonTypeCustom];
131 //2.設置屬性
132 plusbtn.frame=CGRectMake(75, 400, 40, 40);
133 [plusbtn setBackgroundImage:[UIImage imageNamed:@"plus_normal"] forState:UIControlStateNormal];
134 [plusbtn setBackgroundImage:[UIImage imageNamed:@"plus_highlighted"] forState:UIControlStateHighlighted];
135 [plusbtn setTag:1];
136 //3.添加到視圖
137 [self.view addSubview:plusbtn];
138 //4.單擊事件
139 [plusbtn addTarget:self action:@selector(Zoom:) forControlEvents:UIControlEventTouchUpInside];
140
141
142 /**================縮小的按鈕=====================*/
143 UIButton *minusbtn=[UIButton buttonWithType:UIButtonTypeCustom];
144 minusbtn.frame=CGRectMake(125, 400, 40, 40);
145 [minusbtn setBackgroundImage:[UIImage imageNamed:@"minus_normal"] forState:UIControlStateNormal];
146 [minusbtn setBackgroundImage:[UIImage imageNamed:@"minus_highlighted"] forState:UIControlStateHighlighted];
147 [minusbtn setTag:0];
148 [self.view addSubview:minusbtn];
149 [minusbtn addTarget:self action:@selector(Zoom:) forControlEvents:UIControlEventTouchUpInside];
150 }
151
152 //控制方向的多個按鈕調用同一個方法
153 -(void)Click:(UIButton *)button
154 {
155
156 //練習使用frame屬性
157 //CGRect frame=self.headImageView.frame;
158
159 /**注意，這裏若是控制位置的兩個屬性frame和center同時使用的話，會出現很好玩的效果，注意分析*/
160 //練習使用center屬性
161 CGPoint center=self.headImageView.center;
162 switch (button.tag) {
163 case ktopbtntag:
164 center.y-=30;
165 break;
166 case kdownbtntag:
167 center.y+=30;
168 break;
169 case kleftbtntag:
170 //發現一個bug,以前的問題是由於少寫了break,形成了它們的順序執行，sorry
171 //center.x=center.x-30;
172 center.x-=50;
173 break;
174 case krightbtntag:
175 center.x+=50;
176 break;
177 }
178
179 // self.headImageView.frame=frame;
180
181 //首尾式設置動畫效果
182 [UIView beginAnimations:nil context:nil];
183 self.headImageView.center=center;
184 //設置時間
185 [UIView setAnimationDuration:2.0];
186 [UIView commitAnimations];
187 NSLog(@"移動!");
188
189 }
190 -(void)Zoom:(UIButton *)btn
191 {
192 //使用frame，以本身的左上角（本身的原點）爲原點
193 // CGRect frame=self.headImageView.frame;
194 // if (btn.tag) {
195 // frame.size.height+=30;
196 // frame.size.width+=30;
197 // }
198 // else
199 // {
200 // frame.size.width-=50;
201 // frame.size.height-=50;
202 // }
203 // self.headImageView.frame=frame;
204
205
206 //使用bounds，以中心點位原點進行縮放
207 CGRect bounds = self.headImageView.bounds;
208 if (btn.tag) {
209 bounds.size.height+=30;
210 bounds.size.width+=30;
211 }
212 else
213 {
214 bounds.size.height-=50;
215 bounds.size.width-=50;
216 }
217
218 //設置首尾動畫
219 [UIView beginAnimations:nil context:nil];
220 self.headImageView.bounds=bounds;
221 [UIView setAnimationDuration:2.0];
222 [UIView commitAnimations];
223 }
224 @end
實現效果：
3、簡單的動畫效果
簡單介紹首尾式動畫效果
（1）開始動畫
（2）設置動畫相關的時間等
（3）參與動畫的行動
（4）提交動畫
注：實現代碼參考上面的代碼 程序員
- 1. iOS開發UI基礎—手寫控件，frame，center和bounds屬性
- 2. IOS開發UI篇—手寫控件，frame，center和bounds屬性
- 3. iOS開發UI篇—手寫控件，frame，center和bounds屬性
- 4. IOS-UI 屬性frame和bounds
- 5. iOS開發基礎篇-手寫控件
- 6. ios開發之UIView的frame、bounds跟center屬性的區別(附圖)
- 7. frame、bounds、center、anchorPoint、position
- 8. iOS 中的frame，bounds，center，transform關聯
- 9. iOS開發中的frame和bounds
- 10. iOS開發-View中frame和bounds區別
- 更多相關文章...
- • Spring使用AspectJ開發AOP：基於XML和基於Annotation - Spring教程
- • Kotlin 基礎語法 - Kotlin 教程
- • PHP開發工具
- • JDK13 GA發佈：5大特性解讀
-
每一个你不满意的现在，都有一个你没有努力的曾经。
- 1. iOS開發UI基礎—手寫控件，frame，center和bounds屬性
- 2. IOS開發UI篇—手寫控件，frame，center和bounds屬性
- 3. iOS開發UI篇—手寫控件，frame，center和bounds屬性
- 4. IOS-UI 屬性frame和bounds
- 5. iOS開發基礎篇-手寫控件
- 6. ios開發之UIView的frame、bounds跟center屬性的區別(附圖)
- 7. frame、bounds、center、anchorPoint、position
- 8. iOS 中的frame，bounds，center，transform關聯
- 9. iOS開發中的frame和bounds
- 10. iOS開發-View中frame和bounds區別