目录

一、文件(项目导航器)

二、基本代码界面

三、SwiftUI的功能及设计

1.Section

2.Navigation

例.设置标题

3.@State

4.private

5.$

6..keyboardType()

.pickerStyle()

四、栈

1.V堆栈

2.H堆栈

3.Zed堆栈

五、Color

1.预定义颜色

2.使用RGM值创建颜色

3.渐变色

1.线性梯度

2.径向渐变

3.角度梯度(圆锥形渐变)

六、按钮

1.警报

七、UIView

1.padding编辑

2.三元运算符

3.font()

4.blur()

5.多个视图的实现

6.自定义容器


一、文件(项目导航器)

UISegmentedControl 用法 Swift swiftui section_swift

(1)AppDelegate.swift:应用程序(添加代码)

(2)SceneDelegate.swift:委托,swift包含用户在应用程序中启动一个窗口的代码

其中:iPhone的功能不多,在ipad中应用同时打开,是VDOT的Swift包含的重要内容

(3)ContentView.swift:程序的初始用户界面或UI,将在此进行操作

(4)Assets.xcassets:用于在应用程序中使用图片的集合,可以添加颜色,带有应用程序图标iMessage贴纸和更多启动屏幕点故事板

(5)LaunchScreen.storyboard:可视化编译器,用于创建一小段UI以便在应用程序上显示

(6)info.plist:列表中启动的是一系列特殊值,特殊值描述应用如何工作,哪个设备是哪个版本,

(7)Preview Content:最终预览内容,预览资产为EXCI资产(Preview As...ts.xcassets:资产目录,设计用户界面时要使用的图像)

二、基本代码界面

UISegmentedControl 用法 Swift swiftui section_Text_02

1.快速框架:import SwiftUI

2.符合视图,创建一个成为内容视图的新结构,符合视图协议视图来自swiftUI,是基本协议:struct ContentView:View

3.属性:var:body:some View

4.画布:struct ContentView_Previews

三、SwiftUI的功能及设计

1.Section

UISegmentedControl 用法 Swift swiftui section_Text_03

在Swift中存在对Text数量的限制,在form中如果连续执行10个以上的Text那么就会报错,解决的方案就是将Text分成几组,放在几个Section当中

UISegmentedControl 用法 Swift swiftui section_ios_04

2.Navigation

UISegmentedControl 用法 Swift swiftui section_堆栈_05

用途:放置一些标题和按钮..

例.设置标题

(1)大标题:.navigationBarTitle("标题内容")

(2)栏标题(小标题):.navigationBarTitle(Text("标题内容"),displayMode:.inline)

3.@State

属性包装器,用于创建可响应状态变化的变量,例如加减按钮中的变量

4.private

访问修饰符,私用访问控制,用于限制变量的可见性,防止被外部直接访问和修改

5.$

使用:通常与@Binding或@State属性包装器一起使用,用于引用包装器内部的值

其中,与@State:用于创建一个绑定到该状态的引用

6..keyboardType()

修饰符,用于强制使用另一种类型的键盘,

(1).decimalPad:带“点”数字键盘

(2).ASIICapable:密码输入

(3).URL:网址输入

(4).phonePad:拨号数字键盘,带*#+

(5).namephonePad:字母及数字键盘

......

.pickerStyle()

一个属性,用于允许用户从滚动列表中选取一个值的控件

例如分段选择器:.pickerStyle(SegmentedPickerStyle())

四、栈

H堆栈和Zed堆栈或Z堆栈,可处理水平垂直和深度

1.V堆栈

UISegmentedControl 用法 Swift swiftui section_堆栈_06

添加间距:spacing:数目

对齐方式左侧对齐:alignment

水平排列事物的语法与V堆栈语法相同,包括:增加间距和对齐的能力,

例如H堆栈间距20垂直为:HStack(spacing:20)

2.H堆栈

UISegmentedControl 用法 Swift swiftui section_swift_07

Spacer():在堆栈布局种自动调整自身大小,在向上(HStack)和垂直(VStack)占据剩余的空间

3.Zed堆栈

用于按深度排列内容

UISegmentedControl 用法 Swift swiftui section_ios_08

五、Color

1.预定义颜色

Text("预定义颜色').foregroundColor((Color).red)

2.使用RGM值创建颜色

Color(rad:0.1,grern:0.2,blue:0.3,opacity(透明的):1)

3.渐变色

1.线性梯度

UISegmentedControl 用法 Swift swiftui section_swift_09

UISegmentedControl 用法 Swift swiftui section_堆栈_10

代码含义:创建一个渐变,颜色从白色过渡到黑色,从视图的顶部开始到底部结束

2.径向渐变

UISegmentedControl 用法 Swift swiftui section_ios_11

UISegmentedControl 用法 Swift swiftui section_Text_12

代码含义:创建一个从中心开始,颜色从蓝色渐变到黑色,并且渐变范围从20半径扩展到200点半径的径向渐变效果

3.角度梯度(圆锥形渐变)

UISegmentedControl 用法 Swift swiftui section_堆栈_13

UISegmentedControl 用法 Swift swiftui section_Text_14

六、按钮

UISegmentedControl 用法 Swift swiftui section_Text_15

创建一个显示铅笔图标的视图按钮

1.警报

UISegmentedControl 用法 Swift swiftui section_ios_16

UISegmentedControl 用法 Swift swiftui section_swift_17

七、UIView

UIView用于展示和控制用户界面。屏幕上所有可视控件,如按钮(UIButton)和文本(UILabel),都是每个UIView或其子类的实例。

UISegmentedControl 用法 Swift swiftui section_ios_18

1.padding

UISegmentedControl 用法 Swift swiftui section_swift_19

 padding是一种用于控制视图周围间距的布局修饰符,可以在视图的四个边上添加相同或不同长度的边距,从而创建空白区域,调整视图的边距和间距

2.三元运算符

UISegmentedControl 用法 Swift swiftui section_堆栈_20

使用三元条件运算符可以动态地改变视图的属性,如颜色、字体、尺寸等

3.font()

UISegmentedControl 用法 Swift swiftui section_Text_21

应用于视图(如Text视图)字体样式的修饰符.

例如:font(.title)通常用于表示主标题或重要的文本内容,会根据用户设备的设置和系统本来自动选择合适的字体大小、粗细和样式。

font(.largeTitle):使其成为大标题

4.blur()

UISegmentedControl 用法 Swift swiftui section_Text_22

模糊半径零模糊是常规修饰符。用于添加模糊效果。例如图中的.blur(radius:5)就是添加一个模糊半径设置为10的的模糊特效

5.多个视图的实现

例如:

UISegmentedControl 用法 Swift swiftui section_ios_23

6.自定义容器

UISegmentedControl 用法 Swift swiftui section_ios_24

上图中,自定义视图中还包含了自定义修饰符.titleStyle()

UISegmentedControl 用法 Swift swiftui section_堆栈_25

自定义容器通常指创建自定义的视图,这些视图可以包含和管理其他子视图。