SwiftUI系列之一--不要怕，搞起来

苹果公司在WWDC19上宣布了一个激动人心的消息，引入了SwiftUI–一个原生的声明式UI框架。这对于iOS开发习惯了命令式UI编写的猿们来说，是又兴奋又紧张，终于iOSer也可以赶上潮流，使用声明式的方式开发iOS、macos啦。当然小编是属于兴奋的那一种，这不迫不及待就来尝试SwiftUI开发了，接下来的一系列文章，会带领大家一起学习使用SwiftUI，大家加油！我们只需要声明想在UI中看到的内容，SwiftUI会帮我们实现最终的效果。SwiftUI同时也是跨平台的开发框架，可以用于 iOS, macOS, tvOS and watchOS这些平台的开发。本篇文章带领小伙伴们创建第一个SwiftUI项目，并了解一些基础知识。

注意：使用SwiftUI需要XCode11以及MacOS Catalina,请首先确保你的xcode和电脑系统是达标的哦.

在这里插入图片描述

首先打开你的XCode，按照正常创建项目的流程，唯一的不同时，你必须选择swift语言才能在User Interface中发现SwiftUI，然后选中继续创建就OK了。

使用swiftUI创建出来的项目结构如下，和正常的Swift项目还是有些差别的。

在这里插入图片描述

打开SceneDelegate.swift文件看看，可以看到它创建了一个新的ContentView实例，并设置初始可见，有没有觉得似曾相识？这不就是之前的AppDelegate嘛，只不过换了个马甲而已。

let contentView = ContentView()

// Use a UIHostingController as window root view controller.
if let windowScene = scene as? UIWindowScene {
    let window = UIWindow(windowScene: windowScene)
    window.rootViewController = UIHostingController(rootView: contentView)
    self.window = window
    window.makeKeyAndVisible()
}

然后我们再看一下ContentView.swift中都是些什么牛鬼蛇神

struct ContentView: View {
    var body: some View {
        Text("Hello World")
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

可以看到ContentView结构体描述了view展示的内容和layout。

大家可能会好奇ContentView_Previews这是干嘛使的？见名知意，其实它就是我们这个view的预览图，什么意思呢？看图应该就懂了

在这里插入图片描述

这正是XCode为SwiftUI支持的预览视图，有了ContentView_Previews就可以在右侧实时看到对当前view的UI更改，怎么样，是不是感觉很高级？那这个预览页面怎么看到呢？上面截图的右上角的图标，进入点击canvas，再点击resume就可以看到了。当然还不止这样，还有更厉害的呢，其实你也可以选中右边的预览页面中的文字，在最右侧的栏中可以对页面进行更改，同时你的这些设置会更新到代码中，有木有感觉打开了一个新世界的大门？

在这里插入图片描述

上面这些就是对SwiftUI的简单介绍，朋友们，不要怕，搞起来啊！
欢迎大家关注我的公众号–iOS进化论，每天更新iOS相关知识，技巧，最近是做SwiftUI系列，感兴趣的朋友关注走起。每天进步一点点，成为更好的自己，共勉！

公众号二维码