iOS SwiftUI 從菜鳥到高手之深入理解View

在SwiftUI時(shí)間里面竖伯,萬物皆視圖。如果您不能深入理解View母蛛,那就只能永遠(yuǎn)盲人摸象翩剪,不得要領(lǐng)。本文將帶您深入View彩郊,全面了解View的使用前弯,從您體驗(yàn)一下什么是高手的世界。

進(jìn)入SwiftUI和Flutter紀(jì)元后秫逝,我們編寫界面的方式發(fā)送了本質(zhì)區(qū)別恕出。傳統(tǒng)的模式,我們先創(chuàng)建視圖然后進(jìn)行視圖配置违帆。而在SwiftUI時(shí)間浙巫,我們實(shí)際上根本不會(huì)創(chuàng)建任何視圖,而是簡(jiǎn)單地描述我們系統(tǒng)的UI外觀,剩下的工作就全部都由蘋果負(fù)責(zé)渲染了的畴。

三個(gè)實(shí)用的小伙伴Initializers渊抄、modifiers和 inheritance

總體來說,有三種方式可以配置SwiftUI視圖:

  • 通過傳遞參數(shù)給初始化程序Initializers
  • 使用modifiers進(jìn)行配置
  • 通過配置視圖的容器

直接配置方式丧裁,鏈?zhǔn)椒椒?/h2>

例如下面,我們要配置Text文本視圖护桦,這個(gè)文本視圖在TitleView的body中,同時(shí)使用其初initializer和modifier來更改其字體和文本顏色:

struct TitleView: View {
    var title: String

    var body: some View {
        Text(title)
            .font(.headline)
            .italic()
            .foregroundColor(.blue)
    }
}

上述將修飾符鏈接在一起的編程方式煎娇,避免直接修改變量數(shù)值二庵,這種編程方式就是SwiftUI的聲明式編程樣式。

上面是直接配置的示例缓呛,因?yàn)槲覀兺ㄟ^直接在其上調(diào)用方法來顯式設(shè)置和修改Text視圖眨猎。但是,SwiftUI還支持間接配置强经,因?yàn)樵S多不同的修飾符和屬性會(huì)自動(dòng)向下傳播到每個(gè)給定的視圖層次結(jié)構(gòu)中。

間接配置方式寺渗,俺就聽父親的

當(dāng)我們希望多個(gè)同級(jí)視圖采用相同的配置或樣式時(shí)匿情,這種間接繼承的配置將非常有用,例如在以下情況下信殊,我們同時(shí)配置了Text和List來顯示所有的視圖或樣式使用等寬字體的文本炬称,只需將字體分配給其父VStack:

struct ListView: View {
    var title: String
    var items: [Item]
    @Binding var selectedItem: Item?

    var body: some View {
        VStack {
            Text(title).bold()
            List(items, selection: $selectedItem) { item in
                Text(item.title)
            }
        }.font(.system(.body, design: .monospaced))
    }
}

整個(gè)SwiftUI視圖層次結(jié)構(gòu)都可以通過其父級(jí)進(jìn)行配置的事實(shí)非常強(qiáng)大,因?yàn)樗刮覀兡軌驊?yīng)用共享的樣式和配置涡拘,而不必分別修改每個(gè)視圖玲躯。這不僅會(huì)導(dǎo)致代碼減少,而且還為我們的共享配置(如字體鳄乏,顏色等)建立了一個(gè)真實(shí)的來源跷车,而無需我們引入任何抽象來實(shí)現(xiàn)這一目標(biāo)。

還有 84% 的精彩內(nèi)容
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
支付 ¥3.99 繼續(xù)閱讀
  • 序言:七十年代末橱野,一起剝皮案震驚了整個(gè)濱河市朽缴,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌水援,老刑警劉巖密强,帶你破解...
    沈念sama閱讀 216,470評(píng)論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異蜗元,居然都是意外死亡或渤,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,393評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門奕扣,熙熙樓的掌柜王于貴愁眉苦臉地迎上來薪鹦,“玉大人,你說我怎么就攤上這事惯豆【喾遥” “怎么了涝开?”我有些...
    開封第一講書人閱讀 162,577評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)框仔。 經(jīng)常有香客問我舀武,道長(zhǎng),這世上最難降的妖魔是什么离斩? 我笑而不...
    開封第一講書人閱讀 58,176評(píng)論 1 292
  • 正文 為了忘掉前任银舱,我火速辦了婚禮,結(jié)果婚禮上跛梗,老公的妹妹穿的比我還像新娘寻馏。我一直安慰自己,他們只是感情好核偿,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,189評(píng)論 6 388
  • 文/花漫 我一把揭開白布诚欠。 她就那樣靜靜地躺著,像睡著了一般漾岳。 火紅的嫁衣襯著肌膚如雪轰绵。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,155評(píng)論 1 299
  • 那天尼荆,我揣著相機(jī)與錄音左腔,去河邊找鬼。 笑死捅儒,一個(gè)胖子當(dāng)著我的面吹牛液样,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播巧还,決...
    沈念sama閱讀 40,041評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼鞭莽,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了麸祷?” 一聲冷哼從身側(cè)響起撮抓,我...
    開封第一講書人閱讀 38,903評(píng)論 0 274
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎摇锋,沒想到半個(gè)月后丹拯,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,319評(píng)論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡荸恕,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,539評(píng)論 2 332
  • 正文 我和宋清朗相戀三年乖酬,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片融求。...
    茶點(diǎn)故事閱讀 39,703評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡咬像,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情县昂,我是刑警寧澤肮柜,帶...
    沈念sama閱讀 35,417評(píng)論 5 343
  • 正文 年R本政府宣布,位于F島的核電站倒彰,受9級(jí)特大地震影響审洞,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜待讳,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,013評(píng)論 3 325
  • 文/蒙蒙 一芒澜、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧创淡,春花似錦痴晦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,664評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至露乏,卻和暖如春碧浊,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背施无。 一陣腳步聲響...
    開封第一講書人閱讀 32,818評(píng)論 1 269
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留必孤,地道東北人猾骡。 一個(gè)月前我還...
    沈念sama閱讀 47,711評(píng)論 2 368
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像敷搪,于是被迫代替她去往敵國(guó)和親兴想。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,601評(píng)論 2 353

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