Question

我遇到以下问题：

在此页面中，我有一个CheckBoxListTile和两个radioButtons。我需要执行一些规则，例如以下规则：

如果选中任何复选框，请禁用并取消选择所有单选按钮
如果选择了任何单选按钮，请取消选中并禁用所有复选框

但是，我无法执行此操作。我已经尝试将statefulWidgets用于复选框和单选按钮，但是逻辑变得非常混乱。

我曾尝试对PostView类使用有状态的小部件，但是由于在那里使用了futureBuilder，所以每当我调用setState（）时，都会重建整个页面，并且不会选中该复选框。

>

我相信有一个更清洁的解决方案，但是现在我看不到。

这是代码段，因此您可以看到（这是使用无状态窗口小部件，我知道我无法通过这种方式进行操作，但这只是向大家展示我正在尝试做的事情）：

Widget _buildFooter(Post postInfo) {
  return Container(
    child: Column(
      children: <Widget>[
        _buildRadioButtons(postInfo),
        RaisedButton(
          child: Text('press'),
          onPressed: () {},
        ),
      ],
    ),
  );
}

class PostView extends StatelessWidget {
  final String id;
  PostView(this.id);

  Post postInfo;

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: MyAppBar(),
      body: FutureBuilder(
        future: ApiService.getpostInfo(id),
        builder: (BuildContext context, AsyncSnapshot snapShot) {
          if (snapShot.connectionState == ConnectionState.done) {
            if (snapShot.hasError) {
              return Center(
                child: Text('error'),
              );
            }
            postInfo = postInfo.fromJson(snapShot.data);
            return ListView.separated(
              separatorBuilder: (BuildContext context, int index) {
                return Divider();
              },
              itemBuilder: (BuildContext context, int index) {
                if (index == 0) {
                  return _buildHeader(postInfo);
                }
                if (index == (postInfo.authors.length + 1)) {
                  return _buildFooter(postInfo);
                }
                index = index - 1;
                return _buildCheckboxListTile(postInfo, index);
              },
              itemCount: (postInfo.authors.length) + 2,
            );
          }
          return CircularProgressIndicator();
        },
      ),
    );
  }
}

_buildCheckboxListTile(Post postInfo, index) {
  return CheckboxListTile(
    title: Text(postInfo.authors[index].name),
    value: postInfo.authors[index].checked,
    onChanged: (bool value) {
        ***Here I need to disabled the radiobuttons in case I get a true

    },
  );
}

_buildRadioButtons(Post postInfo) {
  return Row(
    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
    children: <Widget>[
      Expanded(
        child: CheckboxListTile(
          value: postInfo.value1,
          title: Text('value1'),
          onChanged: (bool value) {
              *** here I need to uncheck all the checkboxes mentioned above
               in case the radio button is selected
          },
        ),
      ),
      Expanded(
        child: CheckboxListTile(
          value: postInfo.value2,
          title: Text('value2'),
          onChanged: (bool value) {},
        ),
      ),
    ],
  );
}

如果没有statefulWidget，这种行为是否可能？

由于我正在学习Flutter，因此欢迎您提供有关该代码的其他建议！

谢谢！

Answer 1

您可以尝试使用状态管理库来轻松管理状态，而无需弄乱代码。这是一篇有关最佳状态管理库的精彩文章：

https://medium.com/flutter-community/flutter-app-architecture-101-vanilla-scoped-model-bloc-7eff7b2baf7e

对于Scoped Model（对我而言，这是最简单的并且是我个人使用的），您可以将二者都设置为ScopedModel小部件的子级，并在状态更改时让它们互相通知。

如何根据另一个窗口小部件的动作来更改窗口小部件的状态？

1 个答案: