完整中文教程及代碼請查看 https://github.com/WillieWangWei/SwiftUI-Tutorials
創建和組合 View
此部分將指引你構建一個發現和分享您喜愛地方的 iOS app ——
Landmarks。首先我們來構建顯示地標詳細信息的 view。
Landmarks使用stacks將image、text等組件進行組合和分層，以此來給 view 布局。如果想給視圖添加地圖，我們需要引入標准MapKit組件。在我們調整設計時，Xcode 可以作出實時反饋，以便我們看到這些調整是如何轉換為代碼的。下載項目文件並按照以下步驟操作。
- 預計完成時間：40 分鍾
- 初始項目文件：下載
1. 創建一個新項目並且瀏覽 Canvas
用 SwiftUI 的 app 模板來創建一個新的 Xcode 項目，並且瀏覽一下這個 canvas。
1.1 打開 Xcode ，在 Xcode 的啟動窗口中單擊 Create a new Xcode project ，或選擇 File > New > Project 。
1.2 選擇 iOS 平台， Single View App 模板，然后單擊 Next 。
1.3 輸入 Landmarks 作為 Product Name ，勾選 Use SwiftUI 復選框，然后單擊 Next 。選擇一個位置保存此項目。
SwiftUI教程
1.4 在 Project navigator 中，選中 ContentView.swift 。
默認情況下， SwiftUI view 文件聲明了兩個結構體。第一個結構體遵循 View 協議，描述 view 的內容和布局。第二個結構體聲明該 view 的預覽。
ContentView.swift
import SwiftUI struct ContentView: View { var body: some View { Text("Hello World") } } struct ContentView_Preview: PreviewProvider { static var previews: some View { ContentView() } } 
1.5 在 canvas 中，單擊 Resume 來顯示預覽。
Tip：如果沒有
canvas，選擇Editor>Editor and Canvas來顯示。
1.6 在 body 屬性中，將 Hello World 更改為自己的問候語。更改代碼時，預覽便會實時更新。
ContentView.swift
import SwiftUI struct ContentView: View { var body: some View { Text("Hello SwiftUI!") } } struct ContentView_Preview: PreviewProvider { static var previews: some View { ContentView() } } 