flutter 为什么我的SwitchListTile不工作时，我分为1个单独的Widget？

6za6bjd0 于 2023-06-30 发布在 Flutter

关注(0)|答案(2)|浏览(117)

目前，我想使用SwitchListTile Widget分成1个单独的Widget多次重复使用，但当我点击它时，什么也没有发生。
下面是我的代码：

class SwitchScreen extends StatefulWidget {
  const SwitchScreen({super.key});

  @override
  State<SwitchScreen> createState() => _SwitchScreenState();
}

class _SwitchScreenState extends State<SwitchScreen> {
  bool check = false;

  Widget _buildSwitchListTile(String title, String description, bool currentValue) {
    return SwitchListTile(
      title: Text(title),
      value: currentValue,
      subtitle: Text(description),
      onChanged:(newValue) {setState(() { currentValue = newValue; });},
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Filters'),
      ),
      body: Column(
        children: [
          Container(
            padding: const EdgeInsets.all(20),
            child: Text(
              'select',
            ),
          ),
          Expanded(
            child: ListView(
              children: [
                _buildSwitchListTile(
                  'text',
                  'description',
                  check,
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}

我尝试修复它，并成功地通过传递一个函数到我的自定义Widget，如下面的代码：

class SwitchScreen extends StatefulWidget {
  const SwitchScreen({super.key});

  @override
  State<SwitchScreen> createState() => _SwitchScreenState();
}

class _SwitchScreenState extends State<SwitchScreen> {
  bool check = false;

  Widget _buildSwitchListTile(String title, String description, bool currentValue, Function(bool) updateValue) {
    return SwitchListTile(
      title: Text(title),
      value: currentValue,
      subtitle: Text(description),
      onChanged: updateValue,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Filters'),
      ),
      body: Column(
        children: [
          Container(
            padding: const EdgeInsets.all(20),
            child: Text(
              'select',
            ),
          ),
          Expanded(
            child: ListView(
              children: [
                _buildSwitchListTile(
                  'text',
                  'description',
                  check,
                  (newValue) {
                    setState(() {
                      check = newValue;
                    });
                  },
                 ),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}

它按我想的那样工作了，但我真的不知道它为什么会这样。谁能给我解释一下！

flutter

来源：https://stackoverflow.com/questions/76561421/why-my-switchlisttile-not-working-when-i-divide-into-1-separate-widget

2条答案

按热度按时间

epggiuax1#

您可以在新的Stateful class中使用SwitchListTile并传递3个参数。如果你想知道每个SwitchListTile中currentValue的状态，也可以添加typedef回调。

typedef ReturnSingleValue<T> = void Function(T value);

class SwitchClass extends StatefulWidget {
  final String title;
  final String description;
  final bool currentValue;
  final ReturnSingleValue<bool> onChanged;
  const SwitchClass(
      {super.key,
      required this.currentValue,
      required this.title,
      required this.description,
      required this.onChanged});

  @override
  State<SwitchClass> createState() => _SwitchClassState();
}

class _SwitchClassState extends State<SwitchClass> {
  bool currentValue = false;

  @override
  void initState() {
    currentValue = widget.currentValue;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return SwitchListTile(
      title: Text(widget.title),
      value: currentValue,
      subtitle: Text(widget.description),
      onChanged: (newValue) {
        setState(() {
          currentValue = newValue;
        });
        widget.onChanged(newValue);
      },
    );
  }
}

并调用父Widget中的SwitchClass。

ListView(
              children: [
                _buildSwitchListTile(
                  'text',
                  'description',
                  check,
                ),
                _buildSwitchListTile(
                  'text',
                  'descrisption',
                  check,
                ),
                SwitchClass(
                  title: 'text',
                  description: 'desc',
                  currentValue: check,
                  onChanged: (value) {
                    print('firstButton $value');
                  },
                ),
                SwitchClass(
                  title: 'text',
                  description: 'desc',
                  currentValue: check,
                  onChanged: (value) {
                    print('secondButton $value');
                  },
                ),
              ],
            ),

赞(0）回复(0）举报 2023-06-30

x0fgdtte2#

更新代码：
使用此代码可使用多个SwitchListTile

class Options {
  final String title;
  final String description;
  bool currentValue;
  Options(
      {required this.title,
      required this.description,
      required this.currentValue});
}

class SwitchScreen extends StatefulWidget {
  const SwitchScreen({super.key});

  @override
  State<SwitchScreen> createState() => _SwitchScreenState();
}

class _SwitchScreenState extends State<SwitchScreen> {
  List<Options> optionsList = [
    Options(
      title: 'text',
      description: 'description',
      currentValue: false,
    ),
  ];

  _buildSwitchListTile(
      {required String title,
      required bool currentValue,
      required String description,
      required onChanged}) {
    return SwitchListTile(
      title: Text(title),
      value: currentValue,
      subtitle: Text(description),
      onChanged: onChanged,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Filters'),
      ),
      body: Column(
        children: [
          Container(
            padding: const EdgeInsets.all(20),
            child: const Text(
              'select',
            ),
          ),
          Expanded(
            child: ListView.builder(
              itemCount: optionsList.length,
              itemBuilder: (BuildContext context, int index) {
                return _buildSwitchListTile(
                  title: optionsList[index].title,
                  description: optionsList[index].description,
                  currentValue: optionsList[index].currentValue,
                  onChanged: (newValue) {
                    setState(
                      () {
                        optionsList[index].currentValue = newValue;
                      },
                    );
                  },
                );
              },
            ),
          )
        ],
      ),
    );
  }
}

赞(0）回复(0）举报 2023-06-30

我来回答

flutter 为什么我的SwitchListTile不工作时，我分为1个单独的Widget？

2条答案

相关问题

热门标签

最新问答