我想创建一个在 SwiftUI 中显示主题标签的视图
I want to create a view where the hashtag is displayed in SwiftUI
目前,我正在研究SwiftUI 并制作注册主题标签时显示在视图中的UI。
但是我不知道当 VStack 超出屏幕尺寸时如何处理创建和插入新 HStack 的逻辑。
我搜索了几次,但找不到任何有用的字词或关键字。
如果您能知道答案并帮助我,我将不胜感激。
上图为示例。
我想创建一个新的 HStack 并在宽度超过设备的水平尺寸时将其放入 VStack,同时将文本项插入 HStack。
struct HashTagView: View {
var hashTagArray: [String] = ["#Lorem", "#Ipsum", "#dolor", "#sit", "#amet", "#consectetur", "#adipiscing", "#elit", "#Nam", "#semper", "#sit", "#amet", "#ut", "#eleifend", "#Cras"]
var body: some View {
VStack(spacing: 5) {
ForEach(hashTagArray, id:\.self) { tag in
Text(tag)
}
}
.padding()
.border(Color.blue)
.frame(width: UIScreen.main.bounds.size.width)
}
}
这是我的代码。
您应该在此处使用具有自适应布局的 LazyVgrid:
我从你的数组中删除了一些条目,因为如果你将它与 id: \.self
一起使用,你应该确保每个条目都是唯一的。
struct HashTagView: View {
var hashTagArray: [String] = ["#Lorem", "#Ipsum", "#dolor", "#consectetur", "#adipiscing", "#elit", "#Nam", "#semper", "#sit", "#amet", "#ut", "#eleifend", "#Cras"]
private var gridItemLayout = [GridItem(.adaptive(minimum: 100))]
var body: some View {
ScrollView{
LazyVGrid(columns: gridItemLayout , spacing: 5) {
ForEach(hashTagArray, id:\.self) { tag in
Text(tag)
}
}
.padding()
.border(Color.blue)
}
.frame(width: UIScreen.main.bounds.size.width)
}
}
目前,我正在研究SwiftUI 并制作注册主题标签时显示在视图中的UI。 但是我不知道当 VStack 超出屏幕尺寸时如何处理创建和插入新 HStack 的逻辑。 我搜索了几次,但找不到任何有用的字词或关键字。
如果您能知道答案并帮助我,我将不胜感激。
上图为示例。 我想创建一个新的 HStack 并在宽度超过设备的水平尺寸时将其放入 VStack,同时将文本项插入 HStack。
struct HashTagView: View {
var hashTagArray: [String] = ["#Lorem", "#Ipsum", "#dolor", "#sit", "#amet", "#consectetur", "#adipiscing", "#elit", "#Nam", "#semper", "#sit", "#amet", "#ut", "#eleifend", "#Cras"]
var body: some View {
VStack(spacing: 5) {
ForEach(hashTagArray, id:\.self) { tag in
Text(tag)
}
}
.padding()
.border(Color.blue)
.frame(width: UIScreen.main.bounds.size.width)
}
}
这是我的代码。
您应该在此处使用具有自适应布局的 LazyVgrid:
我从你的数组中删除了一些条目,因为如果你将它与 id: \.self
一起使用,你应该确保每个条目都是唯一的。
struct HashTagView: View {
var hashTagArray: [String] = ["#Lorem", "#Ipsum", "#dolor", "#consectetur", "#adipiscing", "#elit", "#Nam", "#semper", "#sit", "#amet", "#ut", "#eleifend", "#Cras"]
private var gridItemLayout = [GridItem(.adaptive(minimum: 100))]
var body: some View {
ScrollView{
LazyVGrid(columns: gridItemLayout , spacing: 5) {
ForEach(hashTagArray, id:\.self) { tag in
Text(tag)
}
}
.padding()
.border(Color.blue)
}
.frame(width: UIScreen.main.bounds.size.width)
}
}