如何在SwiftUI中使分段选择器水平滚动

Question

我想要一个水平的ScrollView，它可以作为一个水平选择器，并且有分段选择器的样式，同时仍然可以滚动。

我尝试过两种方法...

1. 我制作了一个带有按钮的水平ScrollView，但是一旦添加了更多的组，我无法弄清楚如何使其正常工作。而且也不知道如何使我按下的选定按钮突出显示

2. 我制作了一个水平的PickerView并赋予了它.segmented选择器的样式，然后将其移到了一个水平的ScrollView中，但这并不能滚动...

// Horizontal Picker inside of a Horizontal ScrollView

var groups = ["Group 1", "Group 2", "Group 3", "Group 4", "Group 5", "Group 6"]

Form {
   Section {
      ScrollView(.horizontal, showsIndicators: false) {
         Picker("Pick A Group", selection: $group) {
            ForEach(groups, id: \.self) {
               Text($0)
            }
         }.pickerStyle(.segmented)
      }
      Text("You selected: \(group)")
   }

所以我想问如何使这个可滚动？

- TwoAngryClowns

Answer 1

分段选择器本质上具有平移手势，允许用户沿着选项拖动“选择矩形”。这也用于允许用户在触摸选项时选择不同的选项。您无法将此手势与“滚动”滚动视图的手势区分开。

我只会在选择器周围添加一些空白空间。这样，用户就可以在选择器下方的空白空间上进行平移滚动。您可以通过在VStack中添加Spacer或添加一些padding来实现此目的。

Picker("Pick A Group", selection: $group) {
    ForEach(groups, id: \.self) {
        Text($0)
    }
}
.padding(.bottom, 30)
.pickerStyle(.segmented)

- Sweeper