Flutter：多个(单个值)ChoiceChip的通过值

ilmyapht 于 2023-02-20 发布在 Flutter

关注(0)|答案(1)|浏览(170)

here解决方案适用于单一ChoiceChip
需要多个ChoiceChip，但索引（选定）始终相同
下面是代码：它似乎需要另一个变量来存储所需的值，但不确定从哪里开始（也许使用提供程序？）

class _MyHomePageState extends State<MyHomePage> {
  int _selectedIndex = 0;

  Widget _buildChips(options) {
    List<Widget> chips = [];
    for (int i = 0; i < options.length; i++) {
      ChoiceChip choiceChip = ChoiceChip(
        selected: _selectedIndex == i,
        label: Text(options[i], style: const TextStyle(color: Colors.white)),
        elevation: 3,
        pressElevation: 5,
        backgroundColor: Colors.grey[400],
        selectedColor: Colors.lightGreen,
        onSelected: (bool selected) {
          setState(() {
            if (selected) {
              _selectedIndex = i;
            }
          });
        },
      );
      chips.add(choiceChip);
    }
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: chips,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text('Select A value'),
            _buildChips(['Regular', 'Hard Sleeper', 'Soft Sleeper']),
            const Text('Select B value'),
            _buildChips(['Python', 'Flutter']),
            ElevatedButton(
              child: const Text('Pass selected A and B values to next screen'),
              onPressed: () {print(_selectedIndex);},
            ),
          ],
        ),
      ),
    );
  }
}

flutter

来源：https://stackoverflow.com/questions/75480714/flutter-pass-value-of-multiple-single-value-choicechip

1条答案

按热度按时间

pu3pd22g1#

可以使用get包和GetXController
https://pub.dev/packages/get

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    Get.put(ChipController());
    return GetBuilder(builder: (ChipController controller) {
      return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              const Text('Select A value'),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: controller.lstType
                    .map((text) => ChoiceChip(
                          selected: controller.selectedChipAData == text,
                          label: Text(text,
                              style: const TextStyle(color: Colors.white)),
                          elevation: 3,
                          pressElevation: 5,
                          backgroundColor: Colors.grey[400],
                          selectedColor: Colors.lightGreen,
                          onSelected: (bool selected) {
                            if (selected) {
                              controller.setSelectedData(text);
                            }
                          },
                        ))
                    .toList(),
              ),
              const Text('Select B value'),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: controller.lstLanguage
                    .map((text) => ChoiceChip(
                          selected: controller.selectedChipBData == text,
                          label: Text(text,
                              style: const TextStyle(color: Colors.white)),
                          elevation: 3,
                          pressElevation: 5,
                          backgroundColor: Colors.grey[400],
                          selectedColor: Colors.lightGreen,
                          onSelected: (bool selected) {
                            if (selected) {
                              controller.setSelectedChipBData(text);
                            }
                          },
                        ))
                    .toList(),
              ),
              ElevatedButton(
                child:
                    const Text('Pass selected A and B values to next screen'),
                onPressed: () {
                  print(controller.selectedChipAData);
                  print(controller.selectedChipBData);
                },
              ),
            ],
          ),
        ),
      );
    });
  }
}

class ChipController extends GetxController {
  String? selectedChipAData;
  String? selectedChipBData;
  List<String> lstType = [
    "Regular",
    "Hard Sleeper",
    "Soft Sleeper",
  ];
  List<String> lstLanguage = [
    "Python",
    "Flutter",
  ];
  void setSelectedData(String data) {
    selectedChipAData = data;
    update();
  }

  void setSelectedChipBData(String data) {
    selectedChipBData = data;
    update();
  }
}

赞(0）回复(0）举报 2023-02-20

我来回答

Flutter：多个(单个值)ChoiceChip的通过值

1条答案

相关问题

热门标签

最新问答