一载碌、UIImageView出場(chǎng)
說(shuō)完了文字組件UILabel猜嘱，接下來(lái)我們有請(qǐng)圖片組件 -- UIImageView出場(chǎng)了。翠花嫁艇，上代碼朗伶！
UIImageView *myImageView = [[UIImageView alloc] initWithFrame:CGRectMake(20, 160, 200, 200)];
myImageView.image = [UIImage imageNamed:@"test_image"];
myImageView.contentMode = UIViewContentModeScaleAspectFill;
myImageView.layer.cornerRadius = 10;
myImageView.layer.masksToBounds = YES;
[self.view addSubview:myImageView];
二、代碼詳解
1步咪、賦值论皆、坐標(biāo)、尺寸（必選）
UIImageView *myImageView = [[UIImageView alloc] initWithFrame:CGRectMake(20, 160, 200, 200)];
看過(guò)上一篇的同學(xué)應(yīng)該能看懂這句話的意思了，就是說(shuō)点晴，在x坐標(biāo)20感凤，y坐標(biāo)160的地方，放一個(gè)寬200粒督，高200的圖片陪竿。
2、圖片地址（可選）
myImageView.image = [UIImage imageNamed:@"test_image"];
2.1 圖片怎么放到項(xiàng)目里屠橄？
你做好的圖片要放在項(xiàng)目的什么地方了呢族跛？
在很久很久以前，圖片還是散落在項(xiàng)目的各個(gè)地方的锐墙，找起來(lái)很麻煩礁哄。后來(lái)蘋果大人說(shuō)了，都給我待一塊兒去贮匕！于是姐仅，所有的圖片都放在Assets.xcassets文件里了。
上圖的第二列刻盐，下方有個(gè)加號(hào)掏膏，點(diǎn)擊后可以添加圖片組（New Image Set），或者文件夾（New Folder）敦锌，名字都可以自己改的馒疹。
每個(gè)圖片組包含三個(gè)圖片：
- 1x的圖片，是給iPhone 4出道之前那些老前輩用的乙墙。這年頭颖变，連iPhone 4s都算老古董了，咱們直接忽略吧听想。
- 2x的圖片腥刹，是給iPhone 4到iPhone 6這些retina屏幕用的。這些是主力汉买，咱們得伺候好這些主兒衔峰。
- 3x的圖片，是給iPhone 6 plus用的蛙粘。由于iPhone 6 plus用的人不是太多垫卤，就算用2x來(lái)顯示效果也還可以接受，所以咱們就省點(diǎn)功夫出牧，不做3x的圖片了穴肘。
直白的說(shuō)，我們只用到2x的圖片舔痕，1x和3x都不用管了评抚。
圖片的名稱要不要加上 @2x 呢豹缀？比如「abc@2x.png」。都可以慨代，建議是要加上耿眉。
如果不加，你要手動(dòng)添加圖片組（New Image Set）鱼响，再把圖片拖到2x對(duì)應(yīng)的虛線框里邊。
如果加上的話组底，把圖片拖到目錄里丈积，系統(tǒng)就會(huì)自動(dòng)添加圖片組（New Image Set），圖片組的名字就是圖片名稱债鸡，而且2x的圖片會(huì)待在2x的虛線框里江滨，省事很多。
2.2 圖片名還是圖片組名厌均？
考你個(gè)問(wèn)題：圖片的文件名叫做abc.png唬滑，圖片組（Image Set）的名稱叫做def，那在代碼里用哪個(gè)名字呢棺弊？
答案是用圖片組的名稱 myImageView.image = [UIImage imageNamed:@"def"];
從個(gè)人習(xí)慣的角度晶密，我會(huì)把圖片的文件名和圖片組的名稱保持一致，誰(shuí)讓我是表里如一的人呢模她？
圖片組起名字的時(shí)候要注意：
- 不要用拼音稻艰，太low了；
- 不要用大寫(xiě)字母侈净，全都小寫(xiě)尊勿；
- 不要用空格，中劃線畜侦，要用下劃線元扔；
有些朋友喜歡用大小寫(xiě)，駝峰式命名旋膳，例如 myGirl澎语。最好別這樣，不是 Xcode 不支持溺忧，是 Android 不支持咏连，為了保持兩邊文件名統(tǒng)一，就都用小寫(xiě) + 下劃線吧鲁森。
2.3 坑爹的文件夾
再考你祟滴，請(qǐng)聽(tīng)題：
- 同一個(gè)文件夾里，可以圖片組的名稱可以重名嗎歌溉？
- 不同的文件夾里垄懂，圖片組可以重名嗎骑晶？
- 在文件夾里的圖片組，程序調(diào)用的時(shí)候需要加上文件夾（目錄）嗎草慧？
答案：
- 同一個(gè)文件夾里桶蛔，當(dāng)然不能重名啦。
- 可以漫谷。
- 不用仔雷。
這就引出一個(gè)有意思的問(wèn)題了：要是不同的文件夾里有重名的圖片組，程序上會(huì)選擇哪個(gè)呢舔示？坑爹的是碟婆，我也不知道，沒(méi)找到規(guī)律（……攤手）惕稻。
所以竖共，不管什么文件夾，整個(gè)項(xiàng)目里俺祠，圖片都不要重名公给，不管是iOS還是Android，都是如此蜘渣。
3淌铐、圖片的顯示模式（可選）
myImageView.contentMode = UIViewContentModeScaleAspectFill;
contentMode是個(gè)很容易被工程師忽略，但是對(duì)設(shè)計(jì)師很重要的屬性蔫缸。
你做的圖片有個(gè)尺寸匣沼，在代碼里放圖片的容器也有一個(gè)尺寸，這兩個(gè)尺寸并不總是相等的捂龄。這好比你把一張圖片拖到Photoshop的畫(huà)布了释涛，圖片和畫(huà)布的寬高比例不一致。那你要怎么辦呢倦沧？有些奇葩的方式就不說(shuō)了唇撬，常規(guī)的，無(wú)非是「拉展融、補(bǔ)窖认、裁」三種：
- 拉
UIViewContentModeScaleToFill：不管圖片的比例，把圖片拉伸來(lái)適應(yīng)容器告希； - 補(bǔ)
UIViewContentModeScaleAspectFit：就像你在4：3的電視機(jī)上看16：9的電影扑浸，畫(huà)面沒(méi)有被拉伸，但是上下都會(huì)加上一個(gè)黑邊燕偶； - 裁
UIViewContentModeScaleAspectFill：先等比例拉伸喝噪，再把多出來(lái)的部分裁掉；
想想自己做的圖片被暴力拉伸指么，實(shí)在太恐怖了酝惧，設(shè)計(jì)師肯定不能忍受榴鼎。但是很可惜，contentMode的默認(rèn)值就是這樣的晚唇。你也不愿意在上下/左右補(bǔ)兩條黑邊吧巫财？所以最合理的方式就是「裁」了。
以后哩陕，你要是看到圖片被拉伸了平项，不用問(wèn)阿貴，肯定是忘了設(shè)置contentMode悍及。你只要加上一句myImageView.contentMode = UIViewContentModeScaleAspectFill; 就OK啦葵礼！
4、圓角（可選）
myImageView.layer.cornerRadius = 10;
myImageView.layer.masksToBounds = YES;
這兩句是配套的并鸵，第一句是設(shè)置了圓角的半徑，第二句是說(shuō)：「我確定一定以及肯定要多余的部分裁掉」扔涧。
5园担、顯示出來(lái)（必選）
[self.view addSubview:myImageView];
這行代碼是老相識(shí)了，就是把圖片添加到視圖里枯夜。只有加了這句話弯汰，你的凡胎俗眼才能看得見(jiàn)它。
喜歡這篇文章嗎湖雹？點(diǎn)擊這里 查看本系列的更多文章咏闪。
