switfUI官方教程
《Introducing SwiftUI》
SwiftUI is a modern way to declare user interfaces for any Apple platform. Create beautiful, dynamic apps faster than ever before.
SwiftUI是一种为任何苹果平台声明用户界面的现代方式。创建美丽的,动态的应用程序比以往任何时候都快。
1.SwiftUI essentials
1.1 Creating and combining views/创建和组合视图
本教程指导您通过建立landmarks——一个发现和分享你喜欢的地方的应用程序。您将首先构建显示地标细节的视图。
为了布局视图,Landmarks使用堆栈将图像和文本视图组件组合并分层。要向视图添加地图,需要包含一个标准的MapKit组件。当你改进视图设计时,Xcode提供实时反馈,这样你就可以看到这些变化是如何转化为代码的。
Section 1 Create a new project and explore the canvas/创建一个新的项目并探索画布
Create a new Xcode project that uses SwiftUI. Explore the canvas, previews, and the SwiftUI template code.
创建一个使用SwiftUI的新Xcode项目。探索画布、预览和SwiftUI模板代码。
To preview and interact with views from the canvas in Xcode, and to use all the latest features described throughout the tutorials, ensure your Mac is running macOS Sonoma or later.
要在Xcode中预览和与画布视图交互,并使用教程中描述的所有最新功能,请确保您的Mac运行macOS Sonoma或更高版本。
Step 1
Open Xcode and either click “Create New Project” in Xcode’s startup window, or choose File > New > Project.
打开Xcode,在Xcode的启动窗口点击“创建新项目”,或者选择“文件>新建>项目”。
Step 2
In the template selector, select iOS as the platform, select the App template, and then click Next.
在模板选择器中选择iOS作为平台,选择App模板,然后单击“下一步”。
Step 3
Enter “Landmarks” as the product name, select “SwiftUI” for the interface and “Swift” for the language, and click Next. Choose a location to save the Landmarks project on your Mac.
输入“Landmarks”作为产品名称,选择界面为“SwiftUI”,选择语言为“Swift”,单击“Next”。选择一个位置来保存Mac上的Landmarks项目。
Step 4
In the Project navigator, select LandmarksApp
.
在Project navigator中,选择LandmarksApp。
An app that uses the SwiftUI app life cycle has a structure that conforms to the App
protocol. The structure’s body
property returns one or more scenes, which in turn provide content for display. The @main
attribute identifies the app’s entry point.
使用SwiftUI生命周期的应用具有符合app协议的结构。该结构的body
属性返回一个或多个场景,这些场景又提供要显示的内容。@main
属性标识应用程序的入口点。
Step 5
In the Project navigator, select ContentView
.
在Project navigator中,选择“ContentView”。
By default, SwiftUI view files declare a structure and a preview. The structure conforms to the View
protocol and describes the view’s content and layout. The preview declaration creates a preview for that view.
默认情况下,SwiftUI视图文件声明了一个结构和一个预览。该结构符合“视图”协议,并描述视图的内容和布局。预览声明为该视图创建一个预览。
Step 6
The canvas displays a preview automatically.
画布会自动显示预览。
Tip
If the canvas isn’t visible, select Editor > Canvas to show it.
如果画布不可见,选择Editor > canvas来显示它。
Step 7
Inside the body property, remove everything but the Text declaration and change “Hello, world!” to a greeting for yourself.
在body属性中,删除除Text声明之外的所有内容,并更改“Hello, world!”变成了对自己的问候。
As you change the code in a view’s body property, the preview updates to reflect your changes.
当您更改视图的body属性中的代码时,预览会更新以反映您的更改。