寫這篇文章的原因
最近在做項(xiàng)目的時(shí)候遇到一個(gè)讓人很蛋疼的問題,用可視化的方式創(chuàng)建輪播圖總是出錯(cuò),達(dá)不到預(yù)期的效果,下面簡(jiǎn)單總結(jié)一下如何用可視化的方式創(chuàng)建輪播圖框架
1.在 main.storyboard中拖一個(gè) UIScrollView 控件,并設(shè)置約束條件,如下圖:
屏幕快照 2016-01-08 14.37.32.png
2.按住 control 鍵將 UIScrollView 拖到它的父視圖view 上,在這里我們先選中 EqualHeights (使 UIScrollView 的 height 與當(dāng)前屏幕等高)
屏幕快照 2016-01-08 14.38.52.png
3.在下圖中的約束設(shè)置中設(shè)置 UIScrollView 的高度為當(dāng)前屏幕的0.4倍(根據(jù)個(gè)人喜好自己調(diào)節(jié))
屏幕快照 2016-01-08 14.41.01.png
4.此時(shí)按住 option 加上 command 加上 = 鍵 來更新視圖
5.接下來將一個(gè) UIView 拖到 UIScrollView 上,并設(shè)置約束條件 constraints,如下圖:
屏幕快照 2016-01-08 14.48.58.png
6.按住 control 鍵將 UIView 拖到 UIScrollView 上,設(shè)置等高,等寬,
屏幕快照 2016-01-08 14.49.47.png
7.選中 Vertically in Container ,使UIView 與 UIScrollView 垂直對(duì)齊.
屏幕快照 2016-01-08 14.52.47.png
8設(shè)置 UIView 的寬度為父視圖的3倍
屏幕快照 2016-01-08 14.55.11.png
9.正常情況下這樣就可以把輪播圖的基本框架搭建出來了,但實(shí)際上往往我們?cè)谠噲D控制器上添加 UINavigationController 或 UITabBarController,這時(shí)如果我們?cè)诎匆陨系牟襟E就會(huì)發(fā)現(xiàn)怎么都不是我們想要的效果,這時(shí)因?yàn)閁INavigationController 和 UITabBarController 都默認(rèn)設(shè)置了 translucent半透明 這個(gè)屬性為真,而UINavigationController 或 UITabBarController本身都有一定的高度.
10.如果我們想要使 輪播圖能正常顯示,我們需要手動(dòng)將UINavigationController 或 UITabBarController的translucent半透明 這個(gè)屬性 設(shè)為 假,通過代碼的方式我就不演示了,相信大家都們問題,通過可視化的方式如下圖所示:
對(duì)于UINavigationController:
屏幕快照 2016-01-08 15.06.08.png
對(duì)于UITabBarController
屏幕快照 2016-01-08 15.05.44.png
這時(shí)大功告成,簡(jiǎn)單的輪播圖框架已搭建好!
屏幕快照 2016-01-08 15.13.33.png
