如何在 Swiftui 中与其他组件一起在 ScrollView 或 VStack 中完全显示 Picker？

Posted 2023-02-24

【中文标题】如何在 Swiftui 中与其他组件一起在 ScrollView 或 VStack 中完全显示 Picker？

【英文标题】：How to display a Picker in Swiftui completely in a ScrollView or VStack with other components?

【发布时间】：2019-07-18 09:49:21

【问题描述】：

只要我将 Picker 放入 ScrollView 或 VStack 中，并且其中还有更多代码（如 ForEach 循环），就只显示 Picker-label。

我想知道为什么，因为在 Scrollview 之外或单独它显示正确。

代码如下：

@State private var exercises = ["Unterarmstütz", "Dehnen", "Kopfstand", "Handstand"]
@State private var selectedExercise = "Plank"
@State private var selectedTimeIndex = 60

var body: some View 
    VStack 
       ScrollView 
            Picker(selection: $selectedTimeIndex, label: Text("select Time")) 
                Text("Option 1")
                Text("Option 2")
                Text("Option 3")
            
            ForEach(exercises.identified(by: \.self))  exercise in
                Button(action: 
                    self.selectedExercise = String("exercise")
                ) 
                    Text("exercise")
                
            

        
    

【问题讨论】：

将ForEach 放入Picker 会发生什么？

那么Picker函数就没有了。仅显示三个文本和按钮。另外我希望选择器与按钮分开工作，这是不可能的。但都是可滚动的

【参考方案1】：

问题是ScrollView，如果你把任何内容放在ScrollView里面，那么你必须设置它的框架。

在这里你可以做到，

@State private var exercises = ["Unterarmstütz", "Dehnen", "Kopfstand", "Handstand"]
@State private var selectedExercise = "Plank"
@State private var selectedTimeIndex = 60

var body: some View 

       //use GeometryReader for height & weight//

        GeometryReader  geometry in       

            ScrollView() 

                VStack 

                    Picker(selection: self.$selectedTimeIndex, label: Text("select Time")) 
                        Text("Option 1")
                        Text("Option 2")
                        Text("Option 3")
                    .frame(width: geometry.size.width, height: geometry.size.height, alignment: .center)

                    ForEach(self.exercises, id: \.self)  exercise in
                        Button(action: 
                            self.selectedExercise = String("exercise")
                        ) 
                            Text("exercise")
                        
                    
                
            
        
    

注意：我使用的是 Xcode 11 Beta 4

【讨论】：

选择器出错（precondition failure: invalid input index: 2) 导致手表应用崩溃。我用 ScrollView 包裹了 picker 以处理崩溃。这解决了内部 picker 的问题scrollview.