Swift: 你好, AutoLayout!

Xcode8已經(jīng)發(fā)布摆碉,帶了Swift3的預(yù)覽版本塘匣,以后都是默認(rèn)采用Swift3的語法。

這個(gè)例子主要是演示iOS中如何用純代碼實(shí)現(xiàn)自動(dòng)布局巷帝,先看看效果馆铁。

ios-auto-layout.png

還是先創(chuàng)建程序入口文件main.swift:

import UIKit

let argc = Process.argc
let argv = UnsafeMutablePointer<UnsafeMutablePointer<CChar>>(Process.unsafeArgv)

UIApplicationMain(argc, argv, NSStringFromClass(MainApp), NSStringFromClass(MainAppDelegate))

創(chuàng)建UI程序入口App.swift,增加了一個(gè)導(dǎo)航欄:

import UIKit

class MainApp: UIApplication {
    override func sendEvent(_ event: UIEvent) {
        super.sendEvent(event)
    }
}

class MainAppDelegate: UIResponder, UIApplicationDelegate {
    
    var window: UIWindow?
    
    func application(_ app: UIApplication, didFinishLaunchingWithOptions opt: [NSObject: AnyObject]?) -> Bool {
        
        self.window = UIWindow(frame: UIScreen.main().bounds)

        self.window!.rootViewController = UINavigationController(rootViewController:MainViewController())
        self.window!.backgroundColor = UIColor.white()
        self.window!.makeKeyAndVisible()
        
        return true
    }
}

然后創(chuàng)建視圖控制器ViewController.swift, 在這里實(shí)現(xiàn)自動(dòng)布局:

import UIKit

class MainViewController: UIViewController {

    var label0_: UILabel!
    var label1_: UILabel!
    var label2_: UILabel!

    override func viewDidLoad() {
        super.viewDidLoad()
        
        self.title = "主視圖"

        self.label0_ = {
            let label = UILabel()
            label.textAlignment = .center
            label.text = "Hello, AutoLayout!"
            return label
        }()

        self.label1_ = {
            let label = UILabel()
            label.textColor = UIColor.red()
            label.textAlignment = .center
            label.text = "=== 你好, AutoLayout! ==="
            return label
        }()
        
        self.label2_ = {
            let label = UILabel()
            label.textColor = UIColor.blue()
            label.textAlignment = .center
            label.text = "=== 底部 ==="
            return label
        }()

        self.view.addSubview(self.label0_)
        self.view.addSubview(self.label1_)
        self.view.addSubview(self.label2_)

        self.view.setupAutoLayout {
            return (
                layouts: [
                    ("H:|-(20)-[label0]-20-|",[]),
                    ("H:|-(20)-[label1]-20-|",[]),
                    ("H:|-(20)-[label2]-20-|",[]),

                    ("V:|[topGuide]-(0)-[label0(20)]-20-[label1(20)]-(>=0)-[label2]-[bottomGuide]|",[])
                ],
                viewsMap: [
                    "topGuide": self.topLayoutGuide,
                    "bottomGuide": self.bottomLayoutGuide,
                    
                    "label0": self.label0_,
                    "label1": self.label1_,
                    "label2": self.label2_
                ]
            )
        }
    }
}

其中self.view.setupAutoLayout是針對(duì)UIView類型作的擴(kuò)展:

extension UIView {
    func setupAutoLayout(closure: () -> (layouts: [(String,NSLayoutFormatOptions)], viewsMap: [String:AnyObject]) ) {
        let (viewsLayouts, viewsMap) = closure()
        
        // 采用自動(dòng)布局
        for view in viewsMap.values {
            if let v = view as? UIView {
                v.translatesAutoresizingMaskIntoConstraints = false
            }
        }
        
        // 添加自動(dòng)布局規(guī)則
        for layout in viewsLayouts {
            self.addConstraints(
                NSLayoutConstraint.constraints(
                    withVisualFormat: layout.0,
                    options: layout.1, metrics: nil,
                    views: viewsMap
                )
            )
        }
    }
}

完成锅睛。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末埠巨,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子现拒,更是在濱河造成了極大的恐慌辣垒,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,755評(píng)論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件印蔬,死亡現(xiàn)場離奇詭異勋桶,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)侥猬,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,305評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門例驹,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人退唠,你說我怎么就攤上這事鹃锈。” “怎么了瞧预?”我有些...
    開封第一講書人閱讀 165,138評(píng)論 0 355
  • 文/不壞的土叔 我叫張陵屎债,是天一觀的道長。 經(jīng)常有香客問我垢油,道長盆驹,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,791評(píng)論 1 295
  • 正文 為了忘掉前任滩愁,我火速辦了婚禮躯喇,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘硝枉。我一直安慰自己廉丽,他們只是感情好秸讹,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,794評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著雅倒,像睡著了一般璃诀。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上蔑匣,一...
    開封第一講書人閱讀 51,631評(píng)論 1 305
  • 那天劣欢,我揣著相機(jī)與錄音,去河邊找鬼裁良。 笑死凿将,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的价脾。 我是一名探鬼主播牧抵,決...
    沈念sama閱讀 40,362評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼侨把!你這毒婦竟也來了犀变?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,264評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤秋柄,失蹤者是張志新(化名)和其女友劉穎获枝,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體骇笔,經(jīng)...
    沈念sama閱讀 45,724評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡省店,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,900評(píng)論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了笨触。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片懦傍。...
    茶點(diǎn)故事閱讀 40,040評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖芦劣,靈堂內(nèi)的尸體忽然破棺而出粗俱,到底是詐尸還是另有隱情,我是刑警寧澤持寄,帶...
    沈念sama閱讀 35,742評(píng)論 5 346
  • 正文 年R本政府宣布源梭,位于F島的核電站娱俺,受9級(jí)特大地震影響稍味,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜荠卷,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,364評(píng)論 3 330
  • 文/蒙蒙 一模庐、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧油宜,春花似錦掂碱、人聲如沸怜姿。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,944評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽沧卢。三九已至,卻和暖如春醉者,著一層夾襖步出監(jiān)牢的瞬間但狭,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,060評(píng)論 1 270
  • 我被黑心中介騙來泰國打工撬即, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留立磁,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,247評(píng)論 3 371
  • 正文 我出身青樓剥槐,卻偏偏與公主長得像唱歧,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子粒竖,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,979評(píng)論 2 355

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

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫颅崩、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 12,105評(píng)論 4 62
  • 魚香茄子:三個(gè)茄子切成條狀蕊苗,用淀粉和醬油攪拌挨摸,然后用油炸茄子上色,撈出來進(jìn)行炒岁歉,放蔥得运,姜,蒜锅移,鹽熔掺,雞精,味精非剃,十彡...
    滿漢之全席閱讀 99評(píng)論 0 1
  • 接到二勇的電話置逻,有志手已經(jīng)忍不住抖了! 他在家轉(zhuǎn)了幾圈备绽,坐上了回老家的班車券坞。 爸爸腦出血,已經(jīng)送到縣醫(yī)院了肺素! 想想...
    粒粒藍(lán)雪閱讀 311評(píng)論 0 0
  • 轉(zhuǎn)載請標(biāo)注: http://www.reibang.com/p/5e802482caa4始終覺得要理解一個(gè)龐大的東...
    wbo4958閱讀 2,176評(píng)論 0 2
  • 2017.09.23號(hào)恨锚,今晚和女兒去公婆家吃的飯,回家后我倆收拾一下床倍靡,女兒把她的玩具放了滿滿一床猴伶,我拿出歸納...
    愛孩子閱讀 208評(píng)論 0 2