iOS UI基礎(chǔ)補充篇

1.控件

屏幕上的所有UI元素都叫做控件(也有叫做視圖、組件)
比如按鈕(UIButton)捐晶、文本(UILabel)都是控件

1.1控件的共同屬性

尺寸
位置
背景色
......
蘋果將控件的共同屬性都抽取到父類UIView中
所有的控件最終都繼承自UIView
UIButton菲语、UILabel都繼承自UIView(查看頭文件驗證)

2.UIView

image
@property(nonatomic,readonly) UIView *superview;
 獲得自己的父控件對象

@property(nonatomic,readonly,copy) NSArray *subviews;
 獲得自己的所有子控件對象

@property(nonatomic) NSInteger tag;
 控件的ID(標(biāo)識),父控件可以通過tag來找到對應(yīng)的子控件

@property(nonatomic) CGAffineTransform transform; // 仿射變換
 控件的形變屬性(可以設(shè)置旋轉(zhuǎn)角度惑灵、比例縮放、平移等屬性)

- (void)addSubview:(UIView *)view;
 添加一個子控件view

- (void)removeFromSuperview;
 從父控件中移除

- (UIView *)viewWithTag:(NSInteger)tag;
 根據(jù)一個tag標(biāo)識找出對應(yīng)的控件(一般都是子控件)

@property(nonatomic) CGRect frame;
 控件矩形框在父控件中的位置和尺寸(以父控件的左上角為坐標(biāo)原點)

@property(nonatomic) CGRect bounds;
 控件矩形框的位置和尺寸(以自己左上角為坐標(biāo)原點眼耀,所以bounds的x英支、y為0)

@property(nonatomic) CGPoint center;
 控件中點的位置(以父控件的左上角為坐標(biāo)原點)

3.父控件 子控件

每個控件都是個容器,能容納其他控件
內(nèi)部小控件是大控件的子控件
大控件是內(nèi)部小控件的父控件
每一個控制器(UIViewController)內(nèi)部都有個默認的UIView屬性

@property(nonatomic,retain) UIView *view;

控制器中管理的其他所有控件都是這個view的子控件(直接或者間接)

4.UIKit坐標(biāo)系

在UIKit中哮伟,坐標(biāo)系的原點(0,0)在左上角楞黄,x值向右正向延伸池凄,y值向下正向延伸

image

5.UIImageView

UIKit框架提供了非常多的UI控件,但并不是每一個都很常用鬼廓,有些控件可能1年內(nèi)都用不上肿仑,有些控件天天用,比如UIButton碎税、UILabel尤慰、UIImageView、UITableView等等
UIImageView極其常用雷蹂,功能比較專一:顯示圖片

6.UILabel

UILabel極其常用伟端,功能比較專一:顯示文字

7.UIButton

一般情況下,點擊某個控件后匪煌,會做出相應(yīng)反應(yīng)的都是按鈕
按鈕的功能比較多责蝠,既能顯示文字党巾,又能顯示圖片,還能隨時調(diào)整內(nèi)部圖片和文字的位置

7.1按鈕的狀態(tài)

normal(普通狀態(tài))
默認情況(Default)
對應(yīng)的枚舉常量:UIControlStateNormal

highlighted(高亮狀態(tài))
按鈕被按下去的時候(手指還未松開)
對應(yīng)的枚舉常量:UIControlStateHighlighted

disabled(失效狀態(tài)霜医,不可用狀態(tài))
如果enabled屬性為NO齿拂,就是處于disable狀態(tài),代表按鈕不可以被點擊
對應(yīng)的枚舉常量:UIControlStateDisabled

7.2設(shè)置按鈕的背景圖片

設(shè)置按鈕在不同狀態(tài)下的背景圖片
為了保證高亮狀態(tài)下的圖片正常顯示支子,必須設(shè)置按鈕的type為custom

image

7.3按鈕的樣式

UIButton自帶了很多種不同的樣式

image

在用代碼創(chuàng)建按鈕的同時指定按鈕樣式

UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom]; 
UIButtonTypeCustom:無類型创肥,按鈕的內(nèi)容需要自定義
UIButtonTypeDetailDisclosure: 
UIButtonTypeInfoLight: 
UIButtonTypeInfoDark: 
UIButtonTypeContactAdd: 

7.4UIButton的常見設(shè)置

- (void)setTitle:(NSString *)title forState:(UIControlState)state;
設(shè)置按鈕的文字

- (void)setTitleColor:(UIColor *)color forState:(UIControlState)state;
設(shè)置按鈕的文字顏色

- (void)setImage:(UIImage *)image forState:(UIControlState)state; 
設(shè)置按鈕內(nèi)部的小圖片

- (void)setBackgroundImage:(UIImage *)image forState:(UIControlState)state;
設(shè)置按鈕的背景圖片

btn.titleLabel.font = [UIFont systemFontOfSize:13];
設(shè)置按鈕的文字字體(需要拿到按鈕內(nèi)部的label來設(shè)置)

- (NSString *)titleForState:(UIControlState)state; 
獲得按鈕的文字

- (UIColor *)titleColorForState:(UIControlState)state;
獲得按鈕的文字顏色

- (UIImage *)imageForState:(UIControlState)state;
獲得按鈕內(nèi)部的小圖片

- (UIImage *)backgroundImageForState:(UIControlState)state;
獲得按鈕的背景圖片

8.View的封裝

如果一個view內(nèi)部的子控件比較多,一般會考慮自定義一個view值朋,把它內(nèi)部子控件的創(chuàng)建屏蔽起來叹侄,不讓外界關(guān)心

外界可以傳入對應(yīng)的模型數(shù)據(jù)給view,view拿到模型數(shù)據(jù)后給內(nèi)部的子控件設(shè)置對應(yīng)的數(shù)據(jù)

封裝控件的基本步驟

1>在initWithFrame:方法中添加子控件昨登,提供便利構(gòu)造方法
2>在layoutSubviews方法中設(shè)置子控件的frame(一定要調(diào)用super的layoutSubviews)
3>增加模型屬性趾代,在模型屬性set方法中設(shè)置數(shù)據(jù)到子控件上

9.Xib & Storyboard

共同點
1.都用來描述軟件界面
2.都用Interface Builder工具來編輯
3.本質(zhì)都是轉(zhuǎn)換成代碼去創(chuàng)建控件

不同點
1.Xib是輕量級的,用來描述局部的UI界面
2.Storyboard是重量級的丰辣,用來描述整個軟件的多個界面撒强,并且能展示多個界面之間的跳轉(zhuǎn)關(guān)系

9.1Xib的加載

方法1

NSArray *views = [[NSBundle mainBundle] loadNibNamed:@"xib文件名" 
                                               owner:nil 
                                             options:nil];

方法2

UINib *nib = [UINib nibWithNibName:@"xib文件名" bundle:nil];
NSArray *views = [nib instantiateWithOwner:nil options:nil];

作者:solozyx
鏈接:http://www.reibang.com/p/bf1383097913
來源:簡書
簡書著作權(quán)歸作者所有,任何形式的轉(zhuǎn)載都請聯(lián)系作者獲得授權(quán)并注明出處笙什。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末飘哨,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子琐凭,更是在濱河造成了極大的恐慌芽隆,老刑警劉巖,帶你破解...
    沈念sama閱讀 210,978評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件统屈,死亡現(xiàn)場離奇詭異胚吁,居然都是意外死亡,警方通過查閱死者的電腦和手機愁憔,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,954評論 2 384
  • 文/潘曉璐 我一進店門腕扶,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人吨掌,你說我怎么就攤上這事半抱。” “怎么了思犁?”我有些...
    開封第一講書人閱讀 156,623評論 0 345
  • 文/不壞的土叔 我叫張陵代虾,是天一觀的道長。 經(jīng)常有香客問我激蹲,道長棉磨,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,324評論 1 282
  • 正文 為了忘掉前任学辱,我火速辦了婚禮乘瓤,結(jié)果婚禮上环形,老公的妹妹穿的比我還像新娘。我一直安慰自己衙傀,他們只是感情好抬吟,可當(dāng)我...
    茶點故事閱讀 65,390評論 5 384
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著统抬,像睡著了一般火本。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上聪建,一...
    開封第一講書人閱讀 49,741評論 1 289
  • 那天钙畔,我揣著相機與錄音,去河邊找鬼金麸。 笑死擎析,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的挥下。 我是一名探鬼主播揍魂,決...
    沈念sama閱讀 38,892評論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼棚瘟!你這毒婦竟也來了现斋?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,655評論 0 266
  • 序言:老撾萬榮一對情侶失蹤偎蘸,失蹤者是張志新(化名)和其女友劉穎步责,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體禀苦,經(jīng)...
    沈念sama閱讀 44,104評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,451評論 2 325
  • 正文 我和宋清朗相戀三年遂鹊,在試婚紗的時候發(fā)現(xiàn)自己被綠了振乏。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,569評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡秉扑,死狀恐怖慧邮,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情舟陆,我是刑警寧澤误澳,帶...
    沈念sama閱讀 34,254評論 4 328
  • 正文 年R本政府宣布,位于F島的核電站秦躯,受9級特大地震影響忆谓,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜踱承,卻給世界環(huán)境...
    茶點故事閱讀 39,834評論 3 312
  • 文/蒙蒙 一倡缠、第九天 我趴在偏房一處隱蔽的房頂上張望哨免。 院中可真熱鬧,春花似錦昙沦、人聲如沸琢唾。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,725評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽采桃。三九已至,卻和暖如春丘损,著一層夾襖步出監(jiān)牢的瞬間普办,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,950評論 1 264
  • 我被黑心中介騙來泰國打工号俐, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留泌豆,地道東北人。 一個月前我還...
    沈念sama閱讀 46,260評論 2 360
  • 正文 我出身青樓吏饿,卻偏偏與公主長得像踪危,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子猪落,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,446評論 2 348

推薦閱讀更多精彩內(nèi)容