SwiftUI 官方教程

完整中文教程及代码请查看 https://github.com/WillieWangWei/SwiftUI-Tutorials

 

SwiftUI 官方教程

SwiftUI 简介

SwiftUI 是一种为任何 Apple 平台声明用户界面的现代化方式。以前所未有的速度,创建漂亮、动态的应用程序。

 

 
 

只需要描述一次的布局

为你的视图声明任何状态的内容和布局,一旦状态发生改变, SwiftUI 会自动更新视图的渲染。

List(landmarks) { landmark in
HStack {
Image(landmark.thumbnail)
Text(landmark.name)
Spacer() if landmark.isFavorite {
Image(systemName: "star.fill")
.foregroundColor(.yellow)
}
}
}
 

 

SwiftUI教程

构建可复用的组件

将小型、独立视图组合到更大,更复杂的界面中。在任何为 Apple 平台所设计的应用之间,共享您的自定义视图。

struct FeatureCard: View {
var landmark: Landmark var body: some View {
landmark.featureImage
.resizable()
.aspectRatio(3/2, contentMode: .fit)
.overlay(TextOverlay(landmark))
}
}
 

 

SwiftUI教程

精简动画

创建平滑的动画就像调用单个方法一样简单。 SwiftUI 会在必要时自动计算并过渡动画。

VStack {
Badge()
.frame(width: 300, height: 300)
.animation(.basic())
Text(name)
.font(.title)
.animation(Animation.basic().delay(0.25))
}
 

 

在 Xcode 中实时预览

无需运行应用程序,即可设计、构建和测试应用程序的界面。使用可交互的预览来测试您的控件和布局。

SwiftUI 官方教程的更多相关文章

  1. SwiftUI 官方教程(八)

    8. 动态生成预览 接下来,我们会在 LandmarkList_Previews 中添加代码以在不同的设备尺寸上渲染列表.默认情况下,预览会以当前的 scheme 中设备的大小进行渲染.我们可以通过调 ...

  2. SwiftUI 官方教程(七)

    7. 给子 View 传递数据 LandmarkDetail 现在依然使用硬编码的数据来显示地标.像 LandmarkRow 一样,LandmarkDetail 类型和它组合的其他 view 都需要一 ...

  3. SwiftUI 官方教程(五)

    SwiftUI官方教程(五) 5. 同时使用 UIKit 和 SwiftUI 至此,我们已准备好创建 map view 了,接下来使用 MapKit 中的 MKMapView 类来渲染地图. 在 Sw ...

  4. SwiftUI 官方教程(四)

    SwiftUI 官方教程(四) 4. 自定义 Image View 搞定名称和位置 view 后,我们来给地标添加图片. 这不需要添加很多代码,只需要创建一个自定义 view,然后给图片加上遮罩.边框 ...

  5. SwiftUI 官方教程(三)

    3. 用 Stacks 组合 View 在上一节创建标题 view 后,我们来添加 text view,它用来显示地标的详细信息,比如公园的名称和所在的州. 在创建 SwiftUI view 时,我们 ...

  6. SwiftUI 官方教程(二)

    SwiftUI 官方教程(二) 2. 自定义 Text View 为了自定义 view 的显示,我们可以自己更改代码,或者使用 inspector 来帮助我们编写代码. 在构建 Landmarks 的 ...

  7. SwiftUI 官方教程(一)

    完整中文教程及代码请查看 https://github.com/WillieWangWei/SwiftUI-Tutorials   创建和组合 View 此部分将指引你构建一个发现和分享您喜爱地方的 ...

  8. SwiftUI 官方教程(六)

    6. 在列表和详情之间设置导航 虽然列表已经能显示了,但是我们还不能通过点击单个地标来查看地标详情页面.SwiftUI教程 把 list 嵌入一个 NavigationView 中,并把每个 row  ...

  9. Unity性能优化(3)-官方教程Optimizing garbage collection in Unity games翻译

    本文是Unity官方教程,性能优化系列的第三篇<Optimizing garbage collection in Unity games>的翻译. 相关文章: Unity性能优化(1)-官 ...

随机推荐

  1. css+js+html实现的遮罩

    ——————页面遮罩(CSS+JS+HTML)—————— HTML: <div id="mask" class="mask"></div&g ...

  2. 蛮好用的局域网测试工具iperf

    公司局域网总是莫名其妙的和一台机器网速很慢,虽然无法解决也无人解决,但是能有个有效的测试至少也会心里有数. 咱干不了网络硬件布线的活,就测测网速吧. 网上找了下,开始有文章介绍NetIQ Chario ...

  3. python 直接存入Excel表格

    def write_excels(self, document): outwb = openpyxl.Workbook() outws = outwb.create_sheet(index=0) fo ...

  4. vue 导航菜单默认子路由

    export default new Router({ routes: [ { path: '/', name: 'index', component: index, children: [ { pa ...

  5. RBM(受限玻尔兹曼机)和深层信念网络(Deep Brief Network)

    目录: 一.RBM 二.Deep Brief Network 三.Deep Autoencoder 一.RBM 1.定义[无监督学习] RBM记住三个要诀:1)两层结构图,可视层和隐藏层:[没输出层] ...

  6. 1.1、配置Python虚拟环境

    安装虚拟环境 系统:CentOS 7.2 python版本:Python 2.7.5 1.虚拟环境介绍 虚拟环境是Python解释器的一个私有副本,在这个环境中你可以安装私有包,而且不会影响系统中安装 ...

  7. id和class命名规范

  8. webpack 配置 Vue 多页应用 —— 从入门到放弃

    webpack 配置 Vue 多页应用 -- 从入门到放弃 一直以来,前端享有无需配置,一个浏览器足矣的优势,直到一大堆构建工具的出现,其中 webpack 就是其中最复杂的一个,因此出现了一个新兴职 ...

  9. Navicat Premium 下载地址

    Navicat Premium(32 bit)简体中文版:http://xiazai.formysql.com/trial/navicat_premium_trial.exe Navicat Prem ...

  10. 使用MySQL Migration Toolkit快速导入Oracle数据

    近来笔者有项目需要将原有的Oracle数据库中的数据导入到MySQL中,经过试用发现MySQL GUI Tools中的MySQL Migration Toolkit可以非常方便快捷的将Oracle数据 ...