AutoLayout 和 AutoresizingMask的使用

Swift 中 AutoLayout 和 AutoresizingMask 用于自動調整視圖的布局喷户,以適應不同大小的設備和屏幕方向唾那。兩種方法都可以用來處理視圖的自動適應問題,但是它們的實現有所不同褪尝。

  1. AutoLayout
    AutoLayout是一個基于約束的視圖布局系統(tǒng)闹获,它可以使視圖根據約束條件自動適應不同的設備尺寸和方向。通過添加約束條件河哑,AutoLayout會計算出每個視圖的正確位置和大小避诽,以確保它們始終處于正確的位置并且是正確的尺寸。

以下是一些常見的AutoLayout 約束條件:

  • 寬度約束或高度約束:限制視圖的寬度或高度璃谨;
  • 水平或垂直間距約束:限制視圖之間的間距沙庐;
  • 頂部、底部佳吞、左邊拱雏、右邊約束:限制視圖在父視圖中的位置。

以下是一個簡單的示例代碼底扳,演示如何使用 AutoLayout 設置一個視圖在父視圖中水平居中并且垂直居中:

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
       
        let myView = UIView()
        myView.backgroundColor = .red
        myView.translatesAutoresizingMaskIntoConstraints = false // 關閉 AutoresizingMask铸抑,打開 AutoLayout

        view.addSubview(myView) // 將myView添加到父視圖上

        NSLayoutConstraint.activate([
            myView.centerXAnchor.constraint(equalTo: view.centerXAnchor), // X軸方向居中
            myView.centerYAnchor.constraint(equalTo: view.centerYAnchor), // Y軸方向居中
            myView.heightAnchor.constraint(equalToConstant: 200), // 設置高度為200
            myView.widthAnchor.constraint(equalTo: myView.heightAnchor, multiplier: 0.8) // 寬度是高度的0.8倍
        ])
    }
}

以上代碼創(chuàng)建了一個紅色的 UIView 對象,并將其添加到當前ViewController的主視圖上衷模。使用 NSLayoutConstraint.activate() 方法添加了一組約束來確定視圖的位置和大小鹊汛,其中 myView 的中心點與父視圖的中心點重合,并且設置了視圖的高度和寬度阱冶。

  1. AutoresizingMask
    AutoresizingMask是一個基于 autoresizingMask 屬性 的視圖布局系統(tǒng)刁憋,它可以使視圖根據屏幕方向自動調整大小和位置。當視圖調整寬度或高度時木蹬,AutoresizingMask 屬性可根據視圖的布局信息調整子視圖的布局至耻。

以下是一些常見的AutoresizingMask 屬性:

  • UIViewAutoresizingFlexibleWidth : 自動調整寬度
  • UIViewAutoresizingFlexibleHeight : 自動調整高度
  • UIViewAutoresizingFlexibleLeftMargin : 自動調整左邊距
  • UIViewAutoresizingFlexibleRightMargin : 自動調整右邊距
  • UIViewAutoresizingFlexibleTopMargin : 自動調整頂部距離
  • UIViewAutoresizingFlexibleBottomMargin : 自動調整底部距離

接下來,讓我們看一下如何使用 AutoresizingMask 添加布局約束來實現自適應布局镊叁。以下是一個示例代碼有梆,演示如何使用 autoresizingMask 屬性將一個視圖居中并根據屏幕方向進行調整大小:

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        let myView = UIView()
        myView.backgroundColor = .red
        myView.frame = CGRect(x: 0, y: 0, width: 200, height: 200)
        myView.center = view.center // 設置視圖居中
        myView.autoresizingMask = [.flexibleWidth, .flexibleHeight, .flexibleTopMargin, .flexibleBottomMargin] // 自適應寬度意系、高度和頂部泥耀、底部邊距

        view.addSubview(myView)
    }
}

以上代碼創(chuàng)建了一個紅色的 UIView 對象,并將其添加到當前 ViewController 的主視圖上蛔添。使用 autoresizingMask 屬性設置了視圖的位置和大小自適應調整痰催,其中寬度和高度都是自適應的兜辞,而頂部和底部邊距可以隨著屏幕方向變化而調整。

值得注意的是夸溶,AutoresizingMask 不支持精細的約束設置逸吵,只能簡單地指定自適應方式,不適用于需要更高級布局的情況缝裁。

總的來說扫皱,AutoLayout的實現更加精細、靈活捷绑,可以使用約束條件創(chuàng)造出更多不同的布局效果韩脑,但AutoresizingMask屬性控制簡單,適合快速實現簡單布局粹污。需要根據具體需求段多、設計選擇使用哪種自適應布局方式。
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末壮吩,一起剝皮案震驚了整個濱河市进苍,隨后出現的幾起案子,更是在濱河造成了極大的恐慌鸭叙,老刑警劉巖觉啊,帶你破解...
    沈念sama閱讀 206,126評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現場離奇詭異沈贝,居然都是意外死亡柄延,警方通過查閱死者的電腦和手機,發(fā)現死者居然都...
    沈念sama閱讀 88,254評論 2 382
  • 文/潘曉璐 我一進店門缀程,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人市俊,你說我怎么就攤上這事杨凑。” “怎么了摆昧?”我有些...
    開封第一講書人閱讀 152,445評論 0 341
  • 文/不壞的土叔 我叫張陵撩满,是天一觀的道長。 經常有香客問我绅你,道長伺帘,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,185評論 1 278
  • 正文 為了忘掉前任忌锯,我火速辦了婚禮伪嫁,結果婚禮上,老公的妹妹穿的比我還像新娘偶垮。我一直安慰自己张咳,他們只是感情好帝洪,可當我...
    茶點故事閱讀 64,178評論 5 371
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著脚猾,像睡著了一般葱峡。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上龙助,一...
    開封第一講書人閱讀 48,970評論 1 284
  • 那天砰奕,我揣著相機與錄音,去河邊找鬼提鸟。 笑死军援,一個胖子當著我的面吹牛,可吹牛的內容都是我干的沽一。 我是一名探鬼主播盖溺,決...
    沈念sama閱讀 38,276評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼铣缠!你這毒婦竟也來了烘嘱?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 36,927評論 0 259
  • 序言:老撾萬榮一對情侶失蹤蝗蛙,失蹤者是張志新(化名)和其女友劉穎蝇庭,沒想到半個月后,有當地人在樹林里發(fā)現了一具尸體捡硅,經...
    沈念sama閱讀 43,400評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡哮内,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 35,883評論 2 323
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現自己被綠了壮韭。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 37,997評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡琳拨,死狀恐怖狱庇,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情浪讳,我是刑警寧澤驻债,帶...
    沈念sama閱讀 33,646評論 4 322
  • 正文 年R本政府宣布暮的,位于F島的核電站冻辩,受9級特大地震影響恨闪,放射性物質發(fā)生泄漏咙咽。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,213評論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望愚战。 院中可真熱鬧,春花似錦拓哟、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,204評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽挚币。三九已至慎玖,卻和暖如春趁怔,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背铺浇。 一陣腳步聲響...
    開封第一講書人閱讀 31,423評論 1 260
  • 我被黑心中介騙來泰國打工繁涂, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留秉沼,地道東北人唬复。 一個月前我還...
    沈念sama閱讀 45,423評論 2 352
  • 正文 我出身青樓敞咧,卻偏偏與公主長得像,于是被迫代替她去往敵國和親辜腺。 傳聞我的和親對象是個殘疾皇子休建,可洞房花燭夜當晚...
    茶點故事閱讀 42,722評論 2 345

推薦閱讀更多精彩內容