SwiftUI 中偏移量和按钮的问题？

Question

SwiftUI 中偏移量和按钮的问题？

5

我有一组按钮，我用顺时针旋转的方式显示它们，但我无法正确地点击它们：

我认为偏移量存在问题，但我不知道如何解决，有什么建议吗？

这是代码：

struct CategoryView: View {
    // Circle Radius
    @State private var radius: Double = 150
    let circleSize: Double = 350
    // Degree of circle
    @State private var degree = -90.0
    let cards = ["John", "Mark", "Alex", "Kevin", "Jimmy"]
    
    var body: some View {
        ZStack {
            let anglePerCount = Double.pi * 2.0 / Double(cards.count)
            ForEach(0..<cards.count, id: \.self) { index in
                let angle = Double(index) * anglePerCount
                let xOffset = CGFloat(radius * cos(angle))
                let yOffset = CGFloat(radius * sin(angle))
                Button {
                    
                } label: {
                Text(cards[index])
                    .font(.title)
                    .fontWeight(.bold)
                    .rotationEffect(Angle(radians: angle + Double.pi/2))
                    .offset(x: xOffset, y: yOffset)
                }
            }
        }
        .rotationEffect(Angle(degrees: degree))
        .onAppear() {
            radius = circleSize/2 - 47 // 47 is for padding
        }
    }
}

- Fabez

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- xTwisteDx · Accepted Answer

这是一个简单的错误，所有SwiftUI开发人员都犯过无数次。你修改了标签，但没有修改实际的按钮本身。只需将修饰符移动到按钮上即可。

Button (action: {}, label: {
    Text(cards[index])
        .font(.title)
        .fontWeight(.bold)
})
.rotationEffect(Angle(radians: angle + Double.pi/2))
.offset(x: xOffset, y: yOffset)

在SwiftUI中，几乎所有的东西都是一个View，并且可以像处理视图一样对待。按钮也是一个视图，可以拥有大部分与Text相同的修饰符。在你的问题中，你改变了按钮内部视图而不是实际的按钮本身。这就是为什么当你点击中间时，它似乎没有正确定位，但实际上它确实按照你的要求执行了。这是一个重要的事情要记住，因为你实际上可以将事物推、拉和偏移出视图，从而创建一些有趣的布局；例如侧边菜单或模态框。