我想以流动布局的方式显示一个单词列表,并且能够 "选择 "一个单词(点击一个单词,就能知道被点击的是什么单词)。 我无法弄清楚如何以流动的方式布局单个单词,所以我创建了一个单一的 Text
视图中的单词是一个用空格隔开的字符串,但现在我不知道如何检测用一个 onTapGesture
修饰语。 有什么办法吗?
@State var words : String = ["causticily", "sophora", "promiscuously", "lambaste", "pouring", "wagging", "tailblock", "coquette", "permeability", "rich", "enfilade", "centiloquy", "circumforaneous", "deturbation", "gecko", "nitro-chloroform", "migraine", "spellken", "convergence", "maggotish", "pester", "unprudent", "tenosynovitis", "yellowfish", "lionel", "turbinoid", "leased", "antitropous", "apportion", "metempsychosis", "ecchymosis", "beflower", "harns", "planetarium", "succinyl", "cremocarp", "catechisation", "capacify", "inburnt", "cabotage", "earing", "evestigate", "effectually", "balaniferous", "plowed", "angiospermatous", "acadian", "newfangly", "goblinize", "endotheca", "mesencephalon", "rose-colored", "talapoin", "academe", "cleanser", "escript", "vicine", "crossed"].joined(separator: " ")
var body : some View {
ZStack {
Text(self.words)
.lineLimit(nil)
.onTapGesture { // (word:String?) in
print("word=?")
}
}
}
截图。
我改编了@Asperi对这个问题的回答 带Wrap的SwiftUI HStack 其中创建了一个字符串数组的流程布局。
EDIT:其实敲击的效果并不好--只有第一行的单词才会注册敲击手势,而且只有当你在单词的正上方敲击时才会注册。无法在其他行注册点击。真的很奇怪,有种BUG的味道。
@State var words : [String] = ["causticily", "sophora", "promiscuously", "lambaste", "pouring", "wagging", "tailblock", "coquette", "permeability", "rich", "enfilade", "centiloquy", "circumforaneous", "deturbation", "gecko", "nitro-chloroform", "migraine", "spellken", "convergence", "maggotish", "pester", "unprudent", "tenosynovitis", "yellowfish", "lionel", "turbinoid", "leased", "antitropous", "apportion", "metempsychosis", "ecchymosis", "beflower", "harns", "planetarium", "succinyl", "cremocarp", "catechisation", "capacify", "inburnt", "cabotage", "earing", "evestigate", "effectually", "balaniferous", "plowed", "angiospermatous", "acadian", "newfangly", "goblinize", "endotheca", "mesencephalon", "rose-colored", "talapoin", "academe", "cleanser", "escript", "vicine", "crossed"]
var body : some View {
var width = CGFloat.zero
var height = CGFloat.zero
return GeometryReader { g in
ZStack(alignment: .topLeading) {
ForEach(0..<self.words.count, id: \.self) { i in
Text(self.words[i])
.padding([.horizontal, .vertical], 4)
.onTapGesture {
print("word tapped=\(self.words[i])")
}
.alignmentGuide(.leading, computeValue: { d in
if (abs(width - d.width) > g.size.width)
{
width = 0
height -= d.height
}
let result = width
if i < self.words.count-1 {
width -= d.width
} else {
width = 0 //last item
}
return result
})
.alignmentGuide(.top, computeValue: {d in
let result = height
if i >= self.words.count-1 {
height = 0 // last item
}
return result
})
}
}
}
}