AutoLayout經常用到的一些布局(含StackView)


前言:個人比較喜歡在xib和sb上去用Autolayout,也有不少人會去用VFL,和Masonry來做適配,當然也有一些新手使用屏幕尺寸的比例去做。

當然對比起來,個人還是喜歡在界面上去用Autolayout,去拉約束來做。感覺效率比較高,但團隊開發的話可能自己加的約束對於別人來說看起來就沒那么容易了,但會自動布局的看別人加的約束也比較容易能看懂。

一、兼容模式

這里首先要說一下,做適配的前提。xcode6之后需要去開啟LanchScreen.xb或LanchSreen.storebord,如果不開啟的話默認的就是兼容模式,兼容模式下最顯眼的一點就是導航會顯的模糊切比高清模式下的要高,你們可以自己在兼容模式下去打印看看屏幕的尺寸和分辨率。所以說我們要做的是高分辨率下的適配,而非兼容模式下的適配。

二、Autolayout的個人理解

個人覺得Autolayout是靈活多變的區設置約束,當然每個人可能都有自己的一套設置約束的風格,但是都是要直接或間接地去設置x,y,w,h的。

二學習Autolayout也非一日之功,需要不斷地去嘗試,,靈活運用直到總結出自己的一套布局風格。

三、Autolayout下的幾個簡單的例子

1.圖片與間距

效果:(圖1-1)

圖1-1有兩個效果:1.圖片保持寬高不變,圖片之間的間距自適應。

          2.圖片寬度變化,圖片之間的間距保持不變。

這里有一個技巧:要在圖片之間去加上透明的View來控制間距。如圖1-2

(圖1-2)

步驟:

  1.設置第一個透明View距top的距離,然后讓所有視圖和第一個空白View頂部對其

  2.設置每一個視圖距左距右都為0

  3.給第一個透明view一個寬高,設置其他透明view與它等高等寬。

  4.給第一個imageView寬高,設置其他imageView與它等高等寬。

  5.如果要保持圖片固定寬高:設置第一個透明view的寬度>=設定的固定寬

  6.如果要保持圖片之間的間距固定寬高:設置第一個imageView的寬度>=設定的固定寬

  7.本例中也用到了stackView去設置固定圖片寬高和固定間距寬高。

2.TableViewCell使用AutoLayout

效果: (圖2-1)

(圖2-1)

步驟:1.設置imageView 上、下、左的邊距和imageView的寬度固定值

   2.設置標題label 上、左、右邊距(如果要做label高度自適應就不必設置label的高度了,只需要將label的numberoflines設為0即可)

   3.設置下邊label 上、左、右邊距(如果要做label高度自適應就不必設置label的高度了,只需要將label的numberoflines設為0即可)

3.UItableViewCell高度動態自適應

  iOS8 - Self-Sizing Cells:ios8及之后可以通過Autolayout做到cell動態高度的效果

//高度自適應兩個屬性設置

    _contentTableView.estimatedRowHeight = 50;

    _contentTableView.rowHeight = UITableViewAutomaticDimension;

效果:(圖3-1)

 

(圖3-2)

步驟:1.設置label上下左右邊距,label的numberoflines設為0

4. ScrollView用AutoLayout

效果:(圖4-1)

步驟:

 (圖4-2)

(圖4-3)

  1.用到了一個第三方的類文件來設置更改scrollView的高度約束(即contentsize)

  2.這個約束的屬性及為(圖4-2)中拉出來高度約束的屬性

  3.通過這個方法去更改這個高度的約束

5.等比例縮放布局

效果:(圖5-1 5-2)

步驟:

 

項目鏈接:https://github.com/kkk359641513/kkkAuto.git

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM