昨天我们简单浏览了一下SwfitUI,今天看看里面的组件吧
就从Stack说起，stack查看文档我们看到HVZ三种stack，那么分别是怎么用的呢？
ZStack
import SwiftUI
struct SKZStack :View {
var body: some View{
ZStack {
Text("我是随意辨析的文本啊")
Text("ZStack")
.fixedSize()
.font(Font.system(size: 22)).foregroundColor(Color.red).rotation3DEffect(Angle.init(radians: 3), axis: (1,2,3))
}
}
}
#if DEBUG
struct SKZStack_PreviewProvider : PreviewProvider {
static var previews: SKZStack{
SKZStack()
}
}
#endif
从图的观察我们知道，ZStack是大家在水平的规则上一样，然后进行z方向的叠加，理解起来就是我们是个显示屏是平面，在这个基础上来个垂直于屏幕的方向上设置个轴线按次序把UI叠放在上面
VStack
import SwiftUI
struct SKVStack: View {
var body: some View {
VStack(alignment: HorizontalAlignment.leading, spacing: 0) {
Text("1")
Text("2").font(Font.system(size: 22))
.padding(3)
}.foregroundColor(Color.yellow)
}
}
struct SKVStack_PreviewProvider: PreviewProvider {
static var previews: SKVStack{
SKVStack()
}
}
这个很明显啦，就是大家按次序从上往下按照先后顺写在一个平面排列起来，有点类似排队的感觉
HStack
import SwiftUI
struct SKHStack:View {
var body: some View{
HStack{
Text("1")
Text("2")
}.padding(EdgeInsets.init(top: 10, leading: 20, bottom: 30, trailing: 40)).overlay(Text("overlay"))
}
}
#if DEBUG
struct SKHStack_Previews: PreviewProvider {
static var previews: some View{
SKHStack()
}
}
#endif
这个就有意思啦是水平，按照从左到右按照先先后顺序放到那里
整体来说就是感觉像教学楼一样
同层教室按照VStack HStack，楼层间按照ZStack放置
