SwiftUI 入門指北

編寫更少的代碼伟葫,打造更出色的 APP。

SwiftUI 是什么

SwiftUI 是蘋果2019年 WWDC 推出的新 UI 開發(fā)框架,主要特點是聲明式語法方仿,數(shù)據(jù)綁定,響應(yīng)式編程等统翩。和谷歌的跨平臺框架 Flutter 思想大同小異仙蚜。

為什么選擇 SwiftUI

SwiftUI 開發(fā)效率很高有預(yù)覽功能,代碼即寫即所見厂汗。支持 Apple 生態(tài)平臺委粉,一套代碼運(yùn)行 Mac、iPad娶桦。

現(xiàn)有項目使用 SwiftUI

由于 SwiftUI 最低支持 iOS13 系統(tǒng)版本贾节,如果你的項目符合匣掸,完全可以使用 SwiftUI 開發(fā),目前 SwiftUI 一些 API 還不完善氮双,缺少一些功能碰酝,還離不開 UIKit ,所以蘋果提供了接口戴差,可以在 SwiftUI 中使用 UIKit 來彌補(bǔ)目前 SwiftUI 的不足送爸,所以我們完全不用擔(dān)心。

目前有哪些坑

畢竟是新框架還在慢慢完善暖释,API 不穩(wěn)定袭厂,功能不完善,還有可能會出現(xiàn)一些莫名其妙難以定位的 Bug球匕,需要慢慢填坑纹磺。

SwiftUI 學(xué)習(xí)成本

學(xué)習(xí)成本不算高,上手很快亮曹,如果你沒有接觸過 React橄杨、Flutter等跨平臺開發(fā)框架,還是需要多學(xué)習(xí)些照卦,主要是命令式到聲明響應(yīng)式編程思想的轉(zhuǎn)變式矫。

推薦的學(xué)習(xí)資料

由于最低版本限制,目前使用 SwiftUI 開發(fā)的很少役耕,除了一些新項目采转,大部分主流 App 還沒有接入 SwiftUI,普及還需要時間瞬痘,這就導(dǎo)致了目前 SwiftUI 資料很少故慈,網(wǎng)上能搜到的都是零零散散的,并不能很好系統(tǒng)的學(xué)習(xí)框全,需要自己花時間看官方文檔和教程察绷,官方 SwiftUI 的教程很完善,一定要跟著敲一下代碼竣况。另外我最推薦的就是看 19年 WWDC20年 WWDC 關(guān)于 SwiftUI 的視頻克婶,有中文字幕,包含 UI丹泉,布局情萤,動畫,數(shù)據(jù)流摹恨,Combine 響應(yīng)式框架等講解筋岛,強(qiáng)烈推薦。我用一個星期把 WWDC 視頻看完晒哄,已經(jīng)可以上手開發(fā)了睁宰,目前我們有一個新項目正在使用 SwiftUI 開發(fā)肪获。

另外推薦兩個方便上手開發(fā)的框架,可以少走不少彎路

  1. SwiftUIX
    使用 SwiftUI 開發(fā)最頭疼的就是之前使用的一些 UIKit 控件目前在 SwiftUI 中還沒有柒傻,比如搜索框 UISearchBar孝赫,如果要使用就需要做一下橋接,這個框架幫我們把 SwiftUI 缺失的控件都橋接好了红符,可以在 SwiftUI 中直接使用 UIKit 的控件青柄,非常方便。
struct ContentView: View {
    @State var isEditing: Bool = false
    @State var searchText: String = ""
    
    var body: some View {
        SearchBar("Search...", text: $searchText, isEditing: $isEditing)
            .showsCancelButton(isEditing)
            .onCancel { print("Canceled!") }
    }
}
  1. SwiftUI-Introspect
    目前 SwiftUI 底層實現(xiàn)大部分是基于 UIKit 框架的预侯,由于 SwiftUI 部分 API 不完善致开,我們很可能要用到 UIKit 的 API,這個框架允許你獲取 SwiftUI 視圖的底層 UIKit 或 AppKit 元素萎馅。

例如修改設(shè)置 List 的分割線双戳,我們就可以拿到底層的 tableview 對象直接修改:

List {
    Text("Item 1")
    Text("Item 2")
}
.introspectTableView { tableView in
    tableView.separatorStyle = .none
}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市糜芳,隨后出現(xiàn)的幾起案子飒货,更是在濱河造成了極大的恐慌,老刑警劉巖耍目,帶你破解...
    沈念sama閱讀 217,406評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件膏斤,死亡現(xiàn)場離奇詭異徐绑,居然都是意外死亡邪驮,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,732評論 3 393
  • 文/潘曉璐 我一進(jìn)店門傲茄,熙熙樓的掌柜王于貴愁眉苦臉地迎上來毅访,“玉大人,你說我怎么就攤上這事盘榨∮鞔猓” “怎么了?”我有些...
    開封第一講書人閱讀 163,711評論 0 353
  • 文/不壞的土叔 我叫張陵草巡,是天一觀的道長守呜。 經(jīng)常有香客問我,道長山憨,這世上最難降的妖魔是什么查乒? 我笑而不...
    開封第一講書人閱讀 58,380評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮郁竟,結(jié)果婚禮上玛迄,老公的妹妹穿的比我還像新娘。我一直安慰自己棚亩,他們只是感情好蓖议,可當(dāng)我...
    茶點故事閱讀 67,432評論 6 392
  • 文/花漫 我一把揭開白布虏杰。 她就那樣靜靜地躺著,像睡著了一般勒虾。 火紅的嫁衣襯著肌膚如雪纺阔。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,301評論 1 301
  • 那天修然,我揣著相機(jī)與錄音州弟,去河邊找鬼。 笑死低零,一個胖子當(dāng)著我的面吹牛婆翔,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播掏婶,決...
    沈念sama閱讀 40,145評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼啃奴,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了雄妥?” 一聲冷哼從身側(cè)響起院仿,我...
    開封第一講書人閱讀 39,008評論 0 276
  • 序言:老撾萬榮一對情侶失蹤贿堰,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體佳头,經(jīng)...
    沈念sama閱讀 45,443評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,649評論 3 334
  • 正文 我和宋清朗相戀三年零蓉,在試婚紗的時候發(fā)現(xiàn)自己被綠了卿嘲。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,795評論 1 347
  • 序言:一個原本活蹦亂跳的男人離奇死亡淀弹,死狀恐怖丹壕,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情薇溃,我是刑警寧澤菌赖,帶...
    沈念sama閱讀 35,501評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站沐序,受9級特大地震影響琉用,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜策幼,卻給世界環(huán)境...
    茶點故事閱讀 41,119評論 3 328
  • 文/蒙蒙 一邑时、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧垄惧,春花似錦刁愿、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,731評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽滤钱。三九已至,卻和暖如春脑题,著一層夾襖步出監(jiān)牢的瞬間件缸,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,865評論 1 269
  • 我被黑心中介騙來泰國打工叔遂, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留他炊,地道東北人。 一個月前我還...
    沈念sama閱讀 47,899評論 2 370
  • 正文 我出身青樓已艰,卻偏偏與公主長得像痊末,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子哩掺,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,724評論 2 354

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