1

当我点击 OrderButton 时，所有 VStack 的背景颜色都变为灰色，然后像分配了单击事件一样返回。我怎样才能防止这种情况？

import SwiftUI

struct DrinkDetail : View {

    var drink: Drink

    var body: some View {

        List {

            ZStack (alignment: .bottom) {
                Image(drink.imageName)
                    .resizable()
                    .aspectRatio(contentMode: .fit)
                Rectangle()
                    .frame(height: 80)
                    .opacity(0.25)
                    .blur(radius: 10)
                HStack {
                    VStack(alignment: .leading, spacing: 3) {
                        Text(drink.name)
                            .foregroundColor(.white)
                            .font(.largeTitle)
                        Text("It is just for $5.")
                            .foregroundColor(.white)
                            .font(.subheadline)
                    }
                    .padding(.leading)
                    .padding(.bottom)
                    Spacer()
                }

            }
            .listRowInsets(EdgeInsets())

            VStack(alignment: .leading) {
                Text(drink.description)
                    .foregroundColor(.primary)
                    .font(.body)
                    .lineLimit(nil)
                    .lineSpacing(12)

                HStack {
                    Spacer()
                    OrderButton()
                    Spacer()
                }
                .padding(.top, 50)
                .padding(.bottom, 50)

            }
            .padding(.top)
        }
        .edgesIgnoringSafeArea(.top)
        .navigationBarHidden(true)
    }
}


struct OrderButton : View {
    var body: some View {
        Button(action: {}) {
            Text("Order Now")
        }
        .frame(width: 200, height: 50)
        .foregroundColor(.white)
        .font(.headline)
        .background(Color.blue)
        .cornerRadius(10)
    }
}


#if DEBUG
struct DrinkDetail_Previews : PreviewProvider {
    static var previews: some View {
        DrinkDetail(drink: LoadModule.sharedInstance.drinkData[3])
    }
}
#endif

通过使用ScrollView并添加更多参数来自动调整Text大小解决了该问题：

        ScrollView(.vertical, showsIndicators: false) {

            ZStack (alignment: .bottom) {
                Image(drink.imageName)
                    .resizable()
                    .aspectRatio(contentMode: .fit)
                Rectangle()
                    .frame(height: 80)
                    .opacity(0.25)
                    .blur(radius: 10)
                HStack {
                    VStack(alignment: .leading, spacing: 3) {
                        Text(drink.name)
                            .foregroundColor(.white)
                            .font(.largeTitle)
                        Text("It is just for $5.")
                            .foregroundColor(.white)
                            .font(.subheadline)
                    }
                    .padding(.leading)
                    .padding(.bottom)
                    Spacer()
                }

            }
            .listRowInsets(EdgeInsets())

            VStack(alignment: .leading) {
                Text(drink.description)
                    .foregroundColor(.primary)
                    .font(.body)
                    .lineLimit(nil)
                    .fixedSize(horizontal: false, vertical: true)
                    .lineSpacing(12)
                    .padding(Edge.Set.leading, 15)
                    .padding(Edge.Set.trailing, 15)

                HStack {
                    Spacer()
                    OrderButton()
                    Spacer()
                }
                .padding(.top, 50)
                .padding(.bottom, 50)

            }
            .padding(.top)
        }
        .edgesIgnoringSafeArea(.top)
        .navigationBarHidden(true)
4

1 回答 1

0

您想要获得的 UI 是什么？因为，从您的示例来看，这似乎List没有必要。确实List是：

一个容器，显示排列在单列中的数据行。

如果您真的不需要List，可以将其替换为VStack（如果您的内容必须适合屏幕）或 a ScrollView（如果您的内容高于屏幕）。替换List将解决您的问题，这取决于其单元格的列表选择样式。

另一种方法是，如果您需要使用视图，可以通过以下方式设置 to 中单元格的选择List样式（但这会影响您在项目中的所有内容）：SceneDelegatenoneList

func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
    let contentView = ContentView() //replace this with your view

    if let windowScene = scene as? UIWindowScene {
        UITableViewCell.appearance().selectionStyle = .none

        let window = UIWindow(windowScene: windowScene)
        window.rootViewController = UIHostingController(rootView: contentView)
        self.window = window
        window.makeKeyAndVisible()
    }
}
于 2019-09-22T13:08:43.277 回答