如何重用切换按钮

Question

我正在尝试找到一种重复使用切换按钮的最佳方法。我希望从切换按钮小部件中获取尽可能低的参数，这是将构建切换按钮的字符串列表和将用于选择切换按钮的选定字符串。并且从切换按钮中的 onPressed 我想返回选定的字符串，该字符串更新主类中的选定字符串。如果所选值为 null 或与列表不匹配，则选择并将所选值更新为切换列表中的第一个字符串。这是我到目前为止的地方......（对不起......真的很难）

这里是切换按钮小部件

class ReuseToggle extends StatelessWidget {
  final List<String> children;
  final String selected;
  final Function onPressed;

  const ReuseToggle({this.selected, this.onPressed, this.children});
  @override
  Widget build(BuildContext context) {
    return ToggleButtons(
      children: children.map((text) => Text(text)).toList(),
      onPressed: (int index) {
        print(index);
      },
/// logic from official documentation
//        for (int buttonIndex = 0;
//            buttonIndex < isSelected.length;
//            buttonIndex++) {
//          if (buttonIndex == index) {
//            isSelected[buttonIndex] = true;
//          } else {
//            isSelected[buttonIndex] = false;
//          }
//        }
//      },
      isSelected: [true, false],
    );
  }
}

主类

class MaterialScreen extends StatefulWidget {
  @override
  _MaterialScreenState createState() => _MaterialScreenState();
}

List<String> list = ['value1', 'value2'];
String selectedToggle;

class _MaterialScreenState extends State<MaterialScreen> {
  Widget build(BuildContext context) {
    return ReuseToggle(
      children: list,
      selected: selectedToggle,
      onPressed: (value) {
        setState(() {
          selectedToggle = value;
        });
      },
    );
  }
}

Answer 1

这是一种解决方案，但是您必须在主类中初始化 selectedToggle。这样，如果selectedToggle 为空，您的切换按钮将被取消选择，并且您的selectedToggle 在第一次按下时更新。

class ReuseToggle extends StatelessWidget {
  final List<String> children;
  final String selected;
  final Function onPressed;

  const ReuseToggle({this.selected, this.onPressed, this.children});
  @override
  Widget build(BuildContext context) {
    List<bool> isSelected = [];
    for (int i = 0; i < children.length; i++) {
      if (children[i] == selected) {
        isSelected.add(true);
      } else {
        isSelected.add(false);
      }
    }

    return ToggleButtons(
      children: children.map((text) => Text(text)).toList(),
      onPressed: (int index) {
        for (int buttonIndex = 0;
            buttonIndex < isSelected.length;
            buttonIndex++) {
          if (buttonIndex == index) {
            isSelected[buttonIndex] = true;
          } else {
            isSelected[buttonIndex] = false;
          }
        }
        onPressed(children[index]);
      },
      isSelected: isSelected,
    );
  }
}