004:基礎(chǔ)控件

UILabel

  • 什么是UILabel:如果只顯示文字那么就選擇它,它可以純潔的顯示文字,并對(duì)文字進(jìn)行各種各樣的設(shè)置和排列

  • UILabel繼承關(guān)系

  • UILabel繼承自UIView,擁有其所有的屬性方法

  • UILabel常見(jiàn)的設(shè)置


property(nonatomic,copy) NSString *text;
? 顯示的文字
@property(nonatomic,retain) UIFont *font;
? 字體
@property(nonatomic,retain) UIColor *textColor;
? 文字顏色
@property(nonatomic) NSTextAlignment textAlignment;
對(duì)齊模式(比如左對(duì)齊、居中對(duì)齊、右對(duì)齊)

UIFont代表字體,常見(jiàn)創(chuàng)建方法有以下幾個(gè):
? + (UIFont *)systemFontOfSize:(CGFloat)fontSize; 系統(tǒng)默認(rèn)字體
? + (UIFont *)boldSystemFontOfSize:(CGFloat)fontSize; 粗體
? + (UIFont *)italicSystemFontOfSize:(CGFloat)fontSize; 斜體

@property(nonatomic) NSLineBreakMode lineBreakMode;// 換行模式

NSLineBreakByWordWrapping = 0, // 單詞包裹,換行的時(shí)候會(huì)以一個(gè)單詞換行
NSLineBreakByCharWrapping,  // 字符包裹換行,換行的時(shí)候會(huì)以一個(gè)字符換行
NSLineBreakByClipping,  // 裁剪超出的內(nèi)容
NSLineBreakByTruncatingHead,    // 一行中頭部省略(注意:numberOfLines要為1): "...wxyz"
NSLineBreakByTruncatingTail,    // 一行中尾部省略: "abcd..."
NSLineBreakByTruncatingMiddle   // 一行中中間部省略: "ab...yz"

UIFont

  • UIFont:UIFont代表字體
  • 常見(jiàn)的設(shè)置

+ (UIFont *)systemFontOfSize:(CGFloat)fontSize; //系統(tǒng)默認(rèn)字體

+ (UIFont *)boldSystemFontOfSize:(CGFloat)fontSize; //粗體
+ (UIFont *)italicSystemFontOfSize:(CGFloat)fontSize; //斜體

UIImage

  • 什么是UIImage
  • UIImage:一個(gè)UIImage對(duì)象就是一張圖片
  • UIImage的繼承關(guān)系
  • UIImage繼承自NSObject屬于基礎(chǔ)類(lèi),作用是放圖片,也就是圖片對(duì)象并且對(duì)圖片進(jìn)行處理
  • UIImage常用的設(shè)置

加載圖片的方式:
1. imageNamed:
2. imageWithContentsOfFile:

1. 加載Assets.xcassets這里面的圖片:
1> 打包后變成Assets.car
2> 拿不到路徑
3> 只能通過(guò)imageNamed:來(lái)加載圖片
4> 不能通過(guò)imageWithContentsOfFile:來(lái)加載圖片

2. 放到項(xiàng)目中的圖片:
1> 可以拿到路徑
2> 能通過(guò)imageNamed:來(lái)加載圖片
3> 也能通過(guò)imageWithContentsOfFile:來(lái)加載圖片

圖片的兩種加載方式內(nèi)存資源的消耗:
1> imageNamed:
a. 就算指向它的指針被銷(xiāo)毀,該資源也不會(huì)被從內(nèi)存中干掉
b. 放到Assets.xcassets的圖片,默認(rèn)就有緩存
c. 圖片經(jīng)常被使用

2> imageWithContentsOfFile:
a. 指向它的指針被銷(xiāo)毀,該資源會(huì)被從內(nèi)存中干掉
b. 放到項(xiàng)目中的圖片就不由緩存
c. 不經(jīng)常用,大批量的圖片

UIImageView

  • UIImageView的作用是提供一個(gè)裝圖片的容器拉顯示圖片
  • UIImageView的繼承關(guān)系
  • UIImageView繼承自UIView,擁有其所有的屬性和方法
  • UIImageView常見(jiàn)的設(shè)置

// 這個(gè)初始化方法其實(shí)把圖片的frame設(shè)置給了UIImageView的frame,所以不用單獨(dú)的給UIImageView設(shè)置frame
- (instancetype)initWithImage:(nullable UIImage *)image;
- (instancetype)initWithImage:(nullable UIImage *)image highlightedImage:(nullable UIImage *)highlightedImage
// 默認(rèn)是nil
@property (nullable, nonatomic, strong) UIImage *image;
@property (nullable, nonatomic, strong) UIImage *highlightedImage
@property (nonatomic, getter=isUserInteractionEnabled) BOOL userInteractionEnabled;
@property (nonatomic, getter=isHighlighted) BOOL highlighted NS_AVAILABLE_IOS(3_0);

//下面兩個(gè)屬性是存放動(dòng)畫(huà)圖片的數(shù)組
@property (nullable, nonatomic, copy) NSArray<UIImage *> *animationImages;
@property (nullable, nonatomic, copy) NSArray<UIImage *> *highlightedAnimationImages NS_AVAILABLE_IOS(3_0); // The array must contain UIImages. Setting hides the single image. default is nil
// 播放時(shí)間
@property (nonatomic) NSTimeInterval animationDuration;
// 播放次數(shù) 0是一直播放
@property (nonatomic) NSInteger animationRepeatCount;

@property (null_resettable, nonatomic, strong) UIColor *tintColor NS_AVAILABLE_IOS(7_0);
// 開(kāi)始播放
- (void)startAnimating;
// 停止播放
- (void)stopAnimating;
// 是否正在執(zhí)行動(dòng)畫(huà)
- (BOOL)isAnimating;
// 動(dòng)畫(huà)狀態(tài)
@property(nonatomic, readonly, getter=isAnimating) BOOL animating;

// 內(nèi)容設(shè)置模式(繼承自UIView)
UIViewContentModeRedraw, // 重新繪制 (核心繪圖) drawRact

//帶有Scale,標(biāo)明圖片有可能被拉伸或壓縮
UIViewContentModeScaleToFill, // 完全的壓縮或拉伸

// Aspect 比例,縮放是帶有比例的
UIViewContentModeScaleAspectFit, // 寬高比不變 Fit 適應(yīng)
UIViewContentModeScaleAspectFill, // 寬高比不變 Fill 填充

//不帶有Scale,標(biāo)明圖片不可能被拉伸或壓縮
UIViewContentModeCenter,
UIViewContentModeTop,
UIViewContentModeBottom,
UIViewContentModeLeft,
UIViewContentModeRight,
UIViewContentModeTopLeft,
UIViewContentModeTopRight,
UIViewContentModeBottomLeft,
UIViewContentModeBottomRight,

什么是UIButton?

  • UIButton:稱(chēng)為“按鈕”,界面上表現(xiàn)為可點(diǎn)擊和用戶進(jìn)行交互,點(diǎn)擊以后能夠觸發(fā)某個(gè)事件,按鈕可以顯示圖片和文字。
  • 繼承關(guān)系
  • UIButton繼承自UIControl,擁有其所有方法和屬性,最直接的體現(xiàn)為繼承過(guò)來(lái)的兩個(gè)方法:
// 給按鈕添加事件
- (void)addTarget:(nullable id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents;
// 刪除添加的事件
- (void)removeTarget:(nullable id)target action:(nullable SEL)action forControlEvents:(UIControlEvents)controlEvents;

按鈕的常見(jiàn)的設(shè)置

  • 按鈕的不同樣式
typedef NS_ENUM(NSInteger, UIButtonType) {
UIButtonTypeCustom = 0, // 沒(méi)有狀態(tài),自定義
UIButtonTypeSystem NS_ENUM_AVAILABLE_IOS(7_0), // standard system button

UIButtonTypeDetailDisclosure,
UIButtonTypeInfoLight,
UIButtonTypeInfoDark,
UIButtonTypeContactAdd,

UIButtonTypeRoundedRect = UIButtonTypeSystem, // Deprecated, use UIButtonTypeSystem instead
};

  • 按鈕的不同狀態(tài)(繼承自UIControl的狀態(tài))
typedef NS_OPTIONS(NSUInteger, UIControlState) {
// 普通狀態(tài)
UIControlStateNormal = 0,
// 高亮狀態(tài),按下按鈕沒(méi)有松開(kāi)的時(shí)候
UIControlStateHighlighted = 1 << 0, // used when UIControl isHighlighted is set
// 失效狀態(tài),按鈕不可用的狀態(tài),enable屬性設(shè)置為NO就是此狀態(tài)
UIControlStateDisabled = 1 << 1,
UIControlStateSelected = 1 << 2, // flag usable by app (see below)
UIControlStateFocused NS_ENUM_AVAILABLE_IOS(9_0) = 1 << 3, // Applicable only when the screen supports focus
UIControlStateApplication = 0x00FF0000, // additional flags available for application use
UIControlStateReserved = 0xFF000000 // flags reserved for internal framework use
};

  • 常用方法

- (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è)置按鈕的背景圖片

? 設(shè)置按鈕的文字字體(需要拿到按鈕內(nèi)部的label來(lái)設(shè)置)
? btn.titleLabel.font = [UIFont systemFontOfSize:13];
? - (NSString *)titleForState:(UIControlState)state;
? 獲得按鈕的文字
? - (UIColor *)titleColorForState:(UIControlState)state;
? 獲得按鈕的文字顏色
? - (UIImage *)imageForState:(UIControlState)state;
? 獲得按鈕內(nèi)部的小圖片
? - (UIImage *)backgroundImageForState:(UIControlState)state;
獲得按鈕的背景圖片

  • UIButton,UIlabel,UIimage的選擇
  • 特點(diǎn):
  • UIButton:
  • 既能顯示文字又能顯示圖片(內(nèi)容圖片和背景圖片兩種)
  • 普通和高亮狀態(tài)下顯示不同的文字
  • 直接通過(guò)addTarget添加監(jiān)聽(tīng)點(diǎn)擊
  • UIImageView
  • 只能顯示圖片,不能直接監(jiān)聽(tīng)點(diǎn)擊
  • UILabel
  • 只能顯示文字,不能直接監(jiān)聽(tīng)點(diǎn)擊
  • 選擇:
  • 顯示數(shù)據(jù),不需要點(diǎn)擊建議選擇UIImageView和UILabel
  • 不顯示數(shù)據(jù),需要監(jiān)聽(tīng)點(diǎn)擊,用UIButton,UIImageView和UILabel也可以通過(guò)手勢(shì)識(shí)別器來(lái)監(jiān)聽(tīng)點(diǎn)擊,但是操作教為繁瑣
  • 長(zhǎng)安控件變換不同內(nèi)容,選擇UIButton(按鈕兩種狀態(tài))
  • 同時(shí)顯示兩張圖片,用UIButton

常用顏色

  • 每一種顏色都是由N個(gè)顏色通道組成
  • 常見(jiàn)的顏色通道(ARGB)
  • A: alpha 透明度
  • R: red 紅色
  • G: green 綠色
  • B: blue 藍(lán)色
  • 常見(jiàn)顏色
  • 白色:全部通道滿值
  • 黑色:全部通道都是0(透明度除外)
  • 灰色:RGB通道的值一樣

32位顏色

  • 顏色的組成

  • 由ARGB四個(gè)顏色通道組成

  • 每一個(gè)顏色通道都占據(jù)8bit

  • 每一個(gè)顏色通道的取值范圍是
    二進(jìn)制: [0b00000000, 0b11111111] 注意:0b代表2進(jìn)制
    十進(jìn)制: [0, 255] 注意:(0-28-1)
    十六進(jìn)制:[0x00, 0xff] 注意:0x代表16進(jìn)制

  • 注意

  • 十六進(jìn)制取值: 0-9 A-F

  • 十進(jìn)制取值: 0-9

  • 二進(jìn)制取值: 0-1

  • 顏色的表示形式

  • HEX格式 (ARGB)

  • 綠色 #ff00ff00

  • 黃色 #ffffff00

  • 黑色 #ff000000

  • 白色 #ffffffff

  • ARGB格式

  • 綠色 255,0,255,0

  • 黃色 255,255,255,0

  • 黑色 255,0,0,0

  • 白色 255,255,255,255

24位顏色

  • 顏色的組成

  • 由RGB四個(gè)顏色通道組成

  • 每一個(gè)顏色通道都占據(jù)8bit

  • 每一個(gè)顏色通道的取值范圍是

  • 二進(jìn)制: [0b00000000, 0b11111111] 注意:0b代表2進(jìn)制

  • 十進(jìn)制: [0, 255] 注意:(0-(28-1))

  • 十六進(jìn)制:[0x00, 0xff] 注意:0x代表16進(jìn)制

  • 顏色的表示形式

  • HEX格式 (RGB)

  • 綠色 #00ff00

  • 黃色 #ffff00

  • 黑色 #000000

  • 白色 #ffffff

  • RGB格式

  • 綠色 0,255,0

  • 黃色 255,255,0

  • 黑色 0,0,0

  • 白色 255,255,255

12位顏色

  • 顏色的組成

  • 由RGB四個(gè)顏色通道組成

  • 每一個(gè)顏色通道都占據(jù)4bit

  • 每一個(gè)顏色通道的取值范圍是

  • 二進(jìn)制: [0b0000, 0b1111] 注意:0b代表2進(jìn)制

  • 十進(jìn)制: [0, 15] 注意:(0-(24-1))

  • 十六進(jìn)制:[0x00, 0xff] 注意:0x代表16進(jìn)制

  • 顏色的表示形式

  • HEX格式 (RGB)

  • 綠色 #0f0

  • 黃色 #ff0

  • 黑色 #000

  • 白色 #fff

  • RGB格式

  • 綠色 0,15,0

  • 黃色 15,15,0

  • 黑色 0,0,0

  • 白色 15,15,15

總結(jié)

  • 顏色的通道越多,質(zhì)量就越高,占用尺寸就越大,圖像就越清晰
  • PNG格式和JPG格式區(qū)別:一個(gè)有損,一個(gè)無(wú)損 (壓縮了某些通道)
  • 開(kāi)發(fā)技巧:適用于OC和HTML5
  • 純色的可以使用12bit
  • 需要設(shè)置透明的可以使用24bit或者32bit
  • (圖片的壓縮技術(shù)->文件的壓縮技術(shù))
  • 注意:HEX格式和RGB格式互轉(zhuǎn)
  • 1.自己計(jì)算
  • 2.借助軟件
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫(kù)、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 15,446評(píng)論 4 61
  • 1、禁止手機(jī)睡眠[UIApplication sharedApplication].idleTimerDisabl...
    DingGa閱讀 1,211評(píng)論 1 6
  • 浩圻媽閱讀 270評(píng)論 0 1
  • 三個(gè)月前,劉卓佳這個(gè)三個(gè)字還是一個(gè)陌生的名字。三個(gè)月后,又是誰(shuí)刻在我的心上。 “大家好,你們可以叫我妮妮,我是...
    霧音閱讀 270評(píng)論 1 0
  • 文|秋馨 而立之年,趴下了鋒芒,站起的是思想。 “三十而立”語(yǔ)出《論語(yǔ)·為政》,孔子所說(shuō)的“立”不是指成家立業(yè),而...
    言恰如心閱讀 473評(píng)論 0 0

友情鏈接更多精彩內(nèi)容