Text 如何在SwiftUI中确定在多单词文本视图中点击的单词

Text 如何在SwiftUI中确定在多单词文本视图中点击的单词,text,swiftui,tap,Text,Swiftui,Tap,我希望以流布局方式显示单词列表,并能够“选择”一个单词(点击一个单词并知道点击了哪个单词)。我不知道如何以流畅的方式排列单个单词,因此我创建了一个文本视图,将单词作为一个由空格分隔的字符串,但现在我不知道如何检测用ontapsigner修饰符点击的单词(或nil)。有办法吗 @State var words : String = ["causticily", "sophora", "promiscuously", "lambaste", "pouring", "wagging", "ta

我希望以流布局方式显示单词列表,并能够“选择”一个单词(点击一个单词并知道点击了哪个单词)。我不知道如何以流畅的方式排列单个单词,因此我创建了一个
文本
视图,将单词作为一个由空格分隔的字符串,但现在我不知道如何检测用
ontapsigner
修饰符点击的单词(或nil)。有办法吗

    @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对这个问题的回答,它创建了一个字符串数组的流布局

编辑:事实上,点击效果不好——只有第一行的单词表示点击手势,并且只有在你点击单词正上方的时候。无法在其他行上注册抽头。真奇怪,闻起来像虫子

    @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
                        })
                }
            }
        }

    }
@State-var-words:[String]=[“腐蚀性”、“槐花”、“乱交”、“猛烈抨击”、“倒酒”、“摇摆”、“尾块”、“风骚”、“渗透性”、“丰富”、“安菲乐”、“百分含量”、“环孔性”、“干扰性”、“壁虎”、“硝基氯仿”、“偏头痛”、“咒语”、“收敛性”、“蛆虫”、“纠缠”、“无礼”、“腱鞘炎”,“黄鱼”、“莱昂内尔”、“混浊的”、“出租的”、“反流的”、“分摊的”、“轮回的”、“瘀斑的”、“贝弗尔的”、“哈恩斯的”、“天文馆的”、“琥珀色的”、“绉纹的”、“儿茶色的”、“卷曲的”、“内燃的”、“旋转的”、“耳朵的”、“长尾的”、“有效的”、“平衡的”、“犁过的”、“被子植物的”、“阿卡迪亚的”、“新奇的”、“戈壁化的”内皮细胞“,”中脑“,”玫瑰色“,”塔拉平“,”学院“,”清洁剂“,”埃斯克特“,”维辛“,”十字“]
var body:一些观点{
变量宽度=CGFloat.zero
变量高度=CGFloat.zero
返回GeometryReader{g in
ZStack(对齐:。顶部引导){
ForEach(0..g.尺寸.宽度)
{
宽度=0
高度-=d.高度
}
让结果=宽度
如果我=self.words.count-1{
高度=0//最后一项
}
返回结果
})
}
}
}
}

我的解决方案是使用WKWebView来选择单击的单词。以下是


这听起来与我在@Asperi中解决的问题类似,对我来说效果很好。这是一个应该通用的布局。