Flutter中使用Segmented Button组件时屏幕出现黑条问题求助

• 问题根源：你的SegmentedButton里存在重复的value值——第一个和第三个ButtonSegment的value都设成了Options.options1。SegmentedButton需要每个选项的value唯一，用来区分不同分段的状态，重复value会导致组件在onSelectionChanged触发状态更新时，内部渲染逻辑混乱，进而出现黑条；第二个选项用了唯一的Options.options2，所以显示正常；移除onSelectionChanged后，没有状态更新触发内部校验，所以暂时显示正常，但这不是根本解决办法。

• 修复方案：给第三个选项分配唯一的value，确保Options枚举中包含对应的取值，同时调整选中状态的初始化逻辑。

修改后的核心代码片段：

SegmentedButton(
  segments: const <ButtonSegment<Options>>[
    ButtonSegment<Options>(
        value: Options.options1, label: Text('op1')),
    ButtonSegment<Options>(
        value: Options.options2, label: Text('op2')),
    // 改为唯一的Options.options3
    ButtonSegment<Options>(
        value: Options.options3, label: Text('op3'))
  ],
  selected: selection,
  onSelectionChanged: (Set<Options> newSelection) {
    setState(() {
      selection = newSelection;
    });
  },
),

同时要确保Options枚举定义完整：

enum Options {
  options1,
  options2,
  options3, // 新增该枚举值
}

内容的提问来源于stack exchange，提问作者45tera