Watch 上 SwiftUI 按钮中奇怪的内部视图

Question

我刚刚开始使用 Watch 开发和 SwiftUI，并认为我会从一个简单的登录屏幕开始。我做了两个不同风格的两个按钮。奇怪的是，我的按钮有一个奇怪的红色内部视图，我不知道为什么。

struct ContentView : View
{
    var body: some View
    {
        VStack
        {
            Button( "Login")
            {            
            }
            .accentColor( .white)
            .frame( idealHeight:50.0)
            .padding( [.leading, .trailing], 10.0)
            .background( Color.red)
            .cornerRadius( 5.0)

            Button( "Sign Up")
            {
            }
            .accentColor( .red)
            .frame( idealHeight:50.0)
            .padding( [.leading, .trailing], 10.0)
            .background( Color.white)
            .cornerRadius( 5.0)
        }
    }
}

有人能告诉我这里发生了什么吗？

另外，如果有人的声誉为 1500，他们可以创建 WatchOS6 标签吗？

更新：这在 iPhone 上比在手表上工作得更好，按钮在两种设备上的工作方式似乎不同。正如@MarkT 指出的那样，您需要从简单的按钮样式开始。问题在于它会阻止您使用自己的按钮样式。

Answer 1

您只是在“默认”按钮后面定义背景，这就是它看起来如此连线的原因。

将按钮样式更改为“普通”并将角半径应用于背景会有所帮助。当然，您必须通过使用填充来调整背景大小...

       Button( "Login")
            {
            }
            .buttonStyle(PlainButtonStyle())
            .padding(.horizontal, 60)
            .padding(.vertical, 10)
            .background(
                   Color.red
                      .cornerRadius( 5.0))
                

更新：正如 d4Rk 中提到的，我们必须使用 PlainButtonStyle()