SwiftUI系列教程第1章第1节：创建一个简单的SwiftUI项目

最新推荐文章于 2023-08-09 19:40:56 发布

李发展

最新推荐文章于 2023-08-09 19:40:56 发布

阅读量2.1k

点赞数 4

分类专栏： iOS移动开发文章标签： swiftui SwiftUI ios开发

本文为互动教程网原创文章，欢迎转载但请注明来源。

本文链接：https://blog.csdn.net/fzhlee/article/details/99637541

版权

iOS移动开发专栏收录该内容

470 篇文章 42 订阅

订阅专栏

源码地址：https://github.com/fzhlee/SwiftUI-Guide

图片来源：developer.apple.com

SwiftUI
更好的应用，更少的代码。
SwiftUI是一种创新、简单的iOS开发中的界面布局方案，可以通过Swift语言的强大功能，在所有的Apple平台上快速构建用户界面。仅使用一组工具和API为任何Apple设备构建用户界面。
SwiftUI具有易于阅读和自然编写的声明式Swift语法，可与新的Xcode设计工具无缝协作，使您的代码和设计完美同步。
自动支持动态类型、暗黑模式、本地化和可访问性，意味着您的第一行SwiftUI代码已经是您编写过的最强大的UI代码了。

SwiftUI开发实用快捷键
Command + Option + Enter : 打开或关闭预览窗口
Command + Option + P : 刷新预览窗口

SwiftUI的85节教程及源码
所有课程基于Xcode 11 beta5，并在Xcode 11 beta5上编译通过。
Xcode 11 beta版本下载地址：https://developer.apple.com/download/
当Xcode11正式版发布之后，会更新所有源码，以适配Xcode 11正式版。

图片来源：developer.apple.com

第一章常用的Views

第1节：SwiftUI空白项目的创建步骤：

1、打开Xcode，然后使用菜单命令:File > New > Project命令，打开项目创建窗口。
2、在项目模板选择窗口中，选择Single View App模板，然后点击Next按钮，进入下一步设置窗口。
3、在项目配置窗口中，需要勾选Use SwiftUI复选框，然后填写其它的配置选项，点击Next按钮，完成项目的创建。
4、SwiftUI项目创建完成之后，其项目结构和代码功能如下图所示：

5、项目导航区：

文件名称	说明
AppDelegate.swift	提供didFinishLaunchingWithOptions等方法，用来处理程序启动之后的事件，或者响应来自外部的事件。
SceneDelegate.swift	设置应用程序窗口的rootViewController，并指定使用哪个ContentView作为rootViewController的rootView。
ContentView.swift	项目的初始界面，用户界面上的可视控件可以放置在此文件中。
Assets.xcassets	项目的资源文件，您可以在此处放置项目中所需的图片、颜色等资源。
LaunchScreen.storyboard	用来配置项目启动过程中所显示的内容。
Info.plist	项目的配置属性文件，配置产品名称、版本号、Build号、Bundle Identifier等项目。

6、代码编辑器：

SwiftUI使用声明性语法，因此开发者可以简单地说明用户界面应该做什么。
例如，您可以编写需要包含文本字段的项目列表，然后描述每个字段的对齐方式，字体和颜色。
您的代码比以前更简单，更易于阅读，从而节省您的时间和维护。

7、ContentView.swift代码说明：

//导入SwiftUI框架
import SwiftUI 		             

//定义一个名为ContentView的结构体，该结构体遵循View协议，遵循View协议的元素才可以在SwiftUI框架中。就像在UIKit中，所见皆UIView一样，在SwiftUI中，所见皆是View。
struct ContentView: View {		 
//添加View协议中的body属性，在body属性中通过SwiftUI提供的各种布局控件，完成界面元素的搭建。关键词some表示返回的是某种View，但是SwiftUI不需要在意是具体的哪种View
    var body: some View {
    	//在屏幕上显示一个标签，标签的内容位于双引号之内
        Text("Hello World")
    }
}

//当处于Debug模式时，允许执行下方的代码
#if DEBUG
//定义一个遵循PreviewProvider的结构体，用于设置在右侧预览区需要实时预览的内容
struct ContentView_Previews: PreviewProvider {
//添加PreviewProvider协议中的previews属性，用来设置在实时预览区显示的内容
    static var previews: some View {
    	//设置在实时预览区显示ContentView结构体中的内容，您还可以在此设置预览的模拟器尺寸、是否Dark Mode等选项。
        ContentView()
    }
}
#endif

8、SceneDelegate.swift代码说明：

//使用此方法可以选择性地配置UIWindow窗口，并将其附加到提供的UIWindowScene
func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {

        if let windowScene = scene as? UIWindowScene {
	    //初始化一个UIWindow窗口对象
            let window = UIWindow(windowScene: windowScene)
	    // 使用一个UIHostingController实例，作为该窗口的根 view controller
            window.rootViewController = UIHostingController(rootView: ContentView())
	    // 将新建的窗口作为当前程序的窗口对象
            self.window = window
	    // 将窗口作为主窗口并显示
            window.makeKeyAndVisible()
        }
    }

SwiftUI课程章节导航区：

iOS开发相关互动课程列表，手把手学习iOS开发，App Store免费下载：
1、互动教程合集：https://apps.apple.com/cn/app/id1392811165
2、Xcode互动教程免费下载地址：https://itunes.apple.com/cn/app/id1063100471
3、Swift语言入门实例互动教程免费下载地址：https://itunes.apple.com/cn/app/id1320746678
4、app开发中的神兵利器免费下载地址：https://itunes.apple.com/cn/app/id1209739676
5、Objective-C语言应用开发互动教程免费下载地址：https://apps.apple.com/cn/app/id838877136

李发展

关注

4
点赞
踩
28

收藏

觉得还不错? 一键收藏
打赏
0
评论
SwiftUI系列教程第1章第1节：创建一个简单的SwiftUI项目

源码地址：https://github.com/fzhlee/SwiftUI-Guide图片来源：developer.apple.comSwiftUI更好的应用，更少的代码。SwiftUI是一种创新、简单的iOS开发中的界面布局方案，可以通过Swift语言的强大功能，在所有的Apple平台上快速构建用户界面。仅使用一组工具和API为任何Apple设备构建用户界面。SwiftUI具...
复制链接

扫一扫