Swift 3.0 使用SnapKit添加約束

首先我們先來了解一下什么是SnapKit。在2016年的WWDC上蘋果官方除了把整個(gè)生態(tài)系統(tǒng)做了一次全面升級(jí)之外,伴隨而來還有同期發(fā)布的Swift 3.0等孵。以前對(duì)Swift2.3心理還存在著疑慮窘疮。而現(xiàn)在用了一年Swift3.0之后覺得已經(jīng)非常的嚴(yán)謹(jǐn)相信以后也不會(huì)有大太的版本改動(dòng)。

為了適應(yīng)各種屏幕尺寸逐抑,iOS 6后引入了自動(dòng)布局(Auto Layout)的概念,通過使用各種 Constraint(約束)來實(shí)現(xiàn)頁(yè)面自適應(yīng)彈性布局屹蚊。在oc時(shí)期一直用的是Masonry框架厕氨,本身就很優(yōu)雅的框架積累了大量的粉絲來用這個(gè)東西,隨著Swift3.0的橫空出世和眾多開發(fā)者的使用汹粤,單單的oc混編已經(jīng)顯得過于復(fù)雜命斧。應(yīng)廣大開發(fā)者要求Masonry的作者推出了支持Swift版本的框架,SnapKit框架V黾妗9帷!SnaoKit是一個(gè)輕量級(jí)的布局框架,是采用鏈?zhǔn)秸Z法封裝的方式來寫Constraints

安裝

安裝的時(shí)候要注意SnapKit的安裝環(huán)境

   iOS 8.0+ / Mac OS X 10.11+ / tvOS 9.0+

   Xcode 8.0+

   Swift 3.0+

下面我要介紹三種安裝SnapKit框架的方法:

一芹壕、CocoaPods導(dǎo)入SnapKit

 在Podfile文件中添加:

 platform :ios, ‘8.0’

 use_frameworks!

 target 'MyText1' do

 pod 'SnapKit', '~> 3.2.0'

 end

在這里一定要注意"use_frameworks汇四!"一定要填上,不填上不行L哂俊M酢(我也不知道為什么,知道的告訴我U霰凇)背苦。然后pod install就可以了!潘明!
pod install

二行剂,使用Carthage安裝SnapKit

 github "SnapKit/SnapKit" ~> 3.2.0

然后在項(xiàng)目的根目錄下生成

 Carthage -> Build -> iOS -> SnapKit.framework

最后在把文件集成

 Project -> General -> Embedded Binaries

三,手動(dòng)導(dǎo)入SnaKit:

首先先將下載下來的SnapKit的SnapKit.xcodeproj放在項(xiàng)目中钳降。

在 工程 -> General -> Embedded Binaries 中點(diǎn)擊加號(hào)厚宰,添加SnapKit。framework庫(kù)到項(xiàng)目中來

這樣就可以了

四牲阁,如何使用

我們?cè)诠ぷ髦幸话銜?huì)遇見兩種情況使用到SnapKit固阁,第一種是頁(yè)面的布局,例如注冊(cè)城菊,登錄了备燃,頁(yè)面羅列了,會(huì)用到凌唬。還有一種就是自定制tableViewCell的時(shí)候會(huì)用到SnapKit并齐。首先我們先來看一下在頁(yè)面中如何使用SnapKit。

這里我創(chuàng)建了一個(gè)名為Myview的uiview使用Snapkit對(duì)他添加了距上(top)、距左(left)寬高為100的view况褪。
看一下效果:

view

在使用的地方import SnapKit

import UIKit

import SnapKit

class ViewController: UIViewController {

          override func viewDidLoad() {

               super.viewDidLoad()

               let MyView = UIView()

               MyView.backgroundColor = UIColor.red

               self.view.addSubview(MyView)

               MyView.snp.makeConstraints { (make) in

                        make.top.equalTo(self.view).offset(100)

                        make.left.equalTo(self.view).offset(100)

                        make.width.equalTo(100);

                        make.height.equalTo(100);

               }

           }

    }

讓我們?cè)诳匆幌略趖ableviewcell里面如何使用SnapKit自適應(yīng):
先看效果:

cell
  import UIKit
import SnapKit

class OneCell: UITableViewCell {
    
    
    override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        selectionStyle = .none
        awakeFromNib()
    }

    override func awakeFromNib() {
        super.awakeFromNib()
        
        let icon = UIImageView()
        icon.image = #imageLiteral(resourceName: "icon.png")
        self.addSubview(icon)
        icon.snp.makeConstraints { (make) in
            make.top.equalTo(self).offset(10)
            make.left.equalTo(self).offset(10)
            make.width.equalTo(50)
            make.height.equalTo(50)
        }
        
        let oneLabel = UILabel()
        oneLabel.numberOfLines = 0
        oneLabel.textColor = UIColor.black
        oneLabel.text = "這里一般都是標(biāo)題"
        self.addSubview(oneLabel)
        oneLabel.snp.makeConstraints { (make) in
            make.top.equalTo(self).offset(20)
            make.left.equalTo(icon.snp.right).offset(15)
            make.width.equalTo(200)
            make.height.equalTo(20)
        }
        
        let rightIcon = UIImageView()
        rightIcon.image = #imageLiteral(resourceName: "icon.png")
        self.addSubview(rightIcon)
        rightIcon.snp.makeConstraints { (make) in
            make.bottom.equalTo(self).offset(-10)
            make.right.equalTo(self).offset(-5)
            make.width.equalTo(20)
            make.height.equalTo(20)
        }
        
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    }

}

左側(cè)的圖片是對(duì)cell的上撕贞、左添加的約束,標(biāo)題是對(duì)左側(cè)圖片添加的約束测垛,右側(cè)的小圖片是對(duì)cell的底捏膨,右添加的約束.

cell的高度隨著label的高度自適應(yīng)

屏幕快照 2017-08-08 16.39.01.png

我們先聲明一個(gè)數(shù)組來存儲(chǔ)tableview要填充的數(shù)據(jù),聲明表格tableview集成協(xié)議方法把數(shù)組里的數(shù)據(jù)放到cell上

import UIKit
import SnapKit

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
    
    var strarr:[String] = ["某年某月某日在宇宙的某個(gè)角落食侮,張根生近一個(gè)月第一次走出房間号涯。他的頭發(fā)蓬松散","張根生一只腳伸到街道的陽光下,而后又縮了回來锯七。一個(gè)大媽提著一籃子菜從他身邊走過側(cè)臉看了他一下链快,張根生躲閃著目光企圖讓自己躲避起來,不要讓人注意到他眉尸∮蛭希可是這樣做卻起到了反效果,每個(gè)路過的人","張根生猶豫了再三噪猾,鼓起勇氣走上街道霉祸。他縮著頭,大衣把他整個(gè)人都掩著嚴(yán)嚴(yán)實(shí)實(shí)畏妖。他的步伐快速脉执。大衣把兩邊的視野擋住了疼阔,他又不敢抬頭戒劫,只看到行人的腿腳無法十分準(zhǔn)確判斷他們位置,所以他不可避免地與好幾個(gè)人相撞了婆廊。他恐懼在人群中迅细,仿佛自己就是落入狼群的羊,覺得自己無法呼吸也沒法思考淘邻,腦子里一直有個(gè)聲音在吶喊:逃快點(diǎn)茵典,再快點(diǎn)。他的步伐越來越來宾舅。撞到人了统阿,他也沒有停下來跟人家說"]

    override func viewDidLoad() {
        super.viewDidLoad()
        let tableview = UITableView()
        tableview.frame = CGRect(x: 0, y: 20, width: UIScreen.main.bounds.size.width, height: UIScreen.main.bounds.size.height)
        tableview.delegate = self
        tableview.dataSource = self
        tableview.estimatedRowHeight = 44.0//添加這句話就不用實(shí)現(xiàn)tableview高度協(xié)議方法
        self.view.addSubview(tableview)
    }
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return strarr.count;
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = OneCell(style: .default, reuseIdentifier: "OneCell")
        cell.oneLabel.text = strarr[indexPath.row]
        return cell
    }
}

重點(diǎn)是cell里面的label的約束,這個(gè)自適應(yīng)的方法說白了就是根據(jù)cell里面的內(nèi)容來填充cell的高度

import UIKit
import SnapKit

class OneCell: UITableViewCell {
    
    var oneLabel = UILabel()
    
    override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        selectionStyle = .none
        awakeFromNib()
    }

    override func awakeFromNib() {
        super.awakeFromNib()
        
        oneLabel.numberOfLines = 0
        oneLabel.textColor = UIColor.black
        self.addSubview(oneLabel)
        oneLabel.snp.makeConstraints { (make) in
            make.top.equalTo(self).offset(10)
            make.left.equalTo(self).offset(10)
            make.right.equalTo(self).offset(-10)
            make.bottom.equalTo(self).offset(-10)
        }
        
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    }

}

不要設(shè)置label的高度筹我,只設(shè)置label距下的距離扶平,使label的內(nèi)容來填充cell的高度。
最后注意蔬蕊,ViewController里面不用實(shí)現(xiàn)tableview height for row 的協(xié)議方法结澄。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子麻献,更是在濱河造成了極大的恐慌们妥,老刑警劉巖,帶你破解...
    沈念sama閱讀 221,198評(píng)論 6 514
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件勉吻,死亡現(xiàn)場(chǎng)離奇詭異监婶,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)齿桃,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,334評(píng)論 3 398
  • 文/潘曉璐 我一進(jìn)店門压储,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人源譬,你說我怎么就攤上這事集惋。” “怎么了踩娘?”我有些...
    開封第一講書人閱讀 167,643評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵刮刑,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我养渴,道長(zhǎng)雷绢,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,495評(píng)論 1 296
  • 正文 為了忘掉前任理卑,我火速辦了婚禮翘紊,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘藐唠。我一直安慰自己帆疟,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,502評(píng)論 6 397
  • 文/花漫 我一把揭開白布宇立。 她就那樣靜靜地躺著踪宠,像睡著了一般。 火紅的嫁衣襯著肌膚如雪妈嘹。 梳的紋絲不亂的頭發(fā)上柳琢,一...
    開封第一講書人閱讀 52,156評(píng)論 1 308
  • 那天,我揣著相機(jī)與錄音润脸,去河邊找鬼柬脸。 笑死,一個(gè)胖子當(dāng)著我的面吹牛毙驯,可吹牛的內(nèi)容都是我干的倒堕。 我是一名探鬼主播,決...
    沈念sama閱讀 40,743評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼尔苦,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼涩馆!你這毒婦竟也來了行施?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,659評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤魂那,失蹤者是張志新(化名)和其女友劉穎蛾号,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體涯雅,經(jīng)...
    沈念sama閱讀 46,200評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡鲜结,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,282評(píng)論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了活逆。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片精刷。...
    茶點(diǎn)故事閱讀 40,424評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖蔗候,靈堂內(nèi)的尸體忽然破棺而出怒允,到底是詐尸還是另有隱情,我是刑警寧澤锈遥,帶...
    沈念sama閱讀 36,107評(píng)論 5 349
  • 正文 年R本政府宣布纫事,位于F島的核電站,受9級(jí)特大地震影響所灸,放射性物質(zhì)發(fā)生泄漏丽惶。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,789評(píng)論 3 333
  • 文/蒙蒙 一爬立、第九天 我趴在偏房一處隱蔽的房頂上張望钾唬。 院中可真熱鬧,春花似錦侠驯、人聲如沸抡秆。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,264評(píng)論 0 23
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽琅轧。三九已至伍绳,卻和暖如春踊挠,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背冲杀。 一陣腳步聲響...
    開封第一講書人閱讀 33,390評(píng)論 1 271
  • 我被黑心中介騙來泰國(guó)打工效床, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人权谁。 一個(gè)月前我還...
    沈念sama閱讀 48,798評(píng)論 3 376
  • 正文 我出身青樓剩檀,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親旺芽。 傳聞我的和親對(duì)象是個(gè)殘疾皇子沪猴,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,435評(píng)論 2 359

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

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫(kù)辐啄、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 12,117評(píng)論 4 61
  • 1. The sky is painted in Lunacia Florets slashed pen the ...
    小舟清江里閱讀 292評(píng)論 0 1
  • 男人為什么抽煙 哈哈 有些人 一輩子都不會(huì)懂 就因?yàn)槟悴皇悄腥?不要跟我說男女平等 如果平等 我們?yōu)槭裁床徽f 女人男人
    內(nèi)蒙小朋友閱讀 157評(píng)論 0 1
  • 【易經(jīng)原文·履卦四爻爻辭及象傳】 [爻辭]九四运嗜,履虎尾壶辜,愬愬[注釋],終吉担租。[象傳]《象》曰:“愬愬終吉砸民。”志行也...
    大珊老師閱讀 922評(píng)論 0 4