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. 【SQL】MERGE

    MERGE可以合并多个表中的数据,也可实现多表中数据的同步.使用MERGE语句对表中数据进行有条件的更新和插入.当查找的行存在时,UPDATE更新行中的数据:当查找的行不存在时,INSERT插入数据. ...

  2. js实现年月日三级联动

    当我们注册一个qq的时候,会看到一个三级年月日的联动菜单,下面简单介绍. <!doctype html> <html lang="en"> <head ...

  3. ROS: Ubuntu16.04安装ROS-kinetic

    参考连接:SLAM: Ubuntu14.04_Kylin安装ROS-Indigo第一步: 软件源配置 1. 增加下载源(增加ubuntu版的ros数据仓库,即下载源)(通用指令适合任何版本的ros) ...

  4. 安卓JNI使用OpenCV

    OpenCV也有Java数据结构的包,不过计算速度还是很慢,非不得已不使用此种方式调用OpenCV.使用NDK编写底层OpenCv的调用代码,使用JNI对代码进行封装,可以稍微提高一点效率. 参考链接 ...

  5. 读书笔记「Python编程:从入门到实践」_5.if语句

    5.1 一个简单示例 cars = ['audi', 'bmw', 'subaru', 'toyota'] for car in cars: if car == 'bmw': print(car.up ...

  6. socket主要函数介绍

    1.   基本套接字函数(1)socket函数原型 socket(建立一个socket文件描述符) 所需头文件 #include <sys/types.h> #include <sy ...

  7. Spring AOP --JDK动态代理方式

    我们知道Spring是通过JDK或者CGLib实现动态代理的,今天我们讨论一下JDK实现动态代理的原理. 一.简述 Spring在解析Bean的定义之后会将Bean的定义生成一个BeanDefinit ...

  8. day002 计算机基础之 操作系统和编程语言的分类

    &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp今天主要针对计算机基础中的操作系统和编程语言的分类进行了讲解. 操作系统 &nbsp ...

  9. vue-路由使用

    路由安装 终端下载路由插件 npm install vue-router --save-dev 配置 在main.js中引入插件 //Router 为自定义名 vue-router 为插件的名字 im ...

  10. 解析python部分常用魔术方法

    def __add__(self, *args, **kwargs): # real signature unknown """ Return self+value. & ...