vendredi 11 décembre 2020

Flutter - Mobx and dynamic Checkbox()

I am using Mobx and I intend to create a checkbox list, that list is already created, however I cannot make the values ​​change when we click on the checkbox, although the logic is being executed and adds items to the list the change is not detected , but if you refresh, the checked chekbox will appear.

I have the following store:

    ObservableList<Category> categoryCheck = ObservableList<Category>();
ObservableList<Category> categoriesTree = ObservableList<Category>();

@action
  void removeCategoryCheck(Category category) {
    categoryCheck.remove(category);

    categoryCheck = categoryCheck;
  }

  @action
  void addCategoryCheck(Category category) {
    categoryCheck.add(category);

    categoryCheck = categoryCheck;
  }

@action
  Future<void> getCategoriesTree() async {
    setLoading(true);
    clearCategoriesTree();
    final response = await repository.getCategoriesTree();
    response.map((category) {
      addToCategoriesTree(Category.fromJson(category));
    }).toList();
    categoriesTree = categoriesTree;
    setLoading(false);
  }

On my Screen where I show the checkbox list, I have the following:

Widget _buildScreen(context) {
    return Observer(
      builder: (context) {
        return ListView(
          shrinkWrap: true,
          //padding: EdgeInsets.all(15.0),
          children: [                
            _buildCategories(context),
          ],
        );
      },
    );
  }


Widget _buildCategories(context) {
    if (_storeCategories.isLoading) {
      return Container(
        child: Text('A carregar Categorias'),
      );
    } else {
      return Container(
          padding: EdgeInsets.only(top: 10),
          height: 300,
          child: ListView(
            shrinkWrap: false,
            children: [
              TreeView(
                indent: 44,
                iconSize: 30,
                treeController: _controller,
                nodes: [
                  for (var item in _storeCategories.categoriesTree)
                    TreeNode(
                        content: Row(
                          children: [
                            Text(item.name,
                                style: TextStyle(color: Colors.black)),
                            Theme(
                              data: ThemeData(
                                unselectedWidgetColor: Colors.grey,
                              ),
                              child: Checkbox(
                                  value: _storeCategories.inCheckList(item),
                                  activeColor: Colors.green,
                                  onChanged: (bool newValue) {
                                    if (newValue) {
                                      _storeCategories.addCategoryCheck(item);
                                    } else {
                                      _storeCategories
                                          .removeCategoryCheck(item);
                                    }
                                  }),
                            )
                          ],
                        ),
                        children: item.childs.length > 0
                            ? [
                                for (var itemChild in item.childs)
                                  TreeNode(
                                      content: Row(
                                        children: [
                                          Text(itemChild.name,
                                              style: TextStyle(
                                                  color: Colors.black)),
                                          Theme(
                                            data: ThemeData(
                                              unselectedWidgetColor:
                                                  Colors.grey,
                                            ),
                                            child: Checkbox(
                                                value: _storeCategories
                                                    .inCheckList(itemChild),
                                                activeColor: Colors.green,
                                                onChanged: (bool newValue) {
                                                  if (newValue) {
                                                    _storeCategories
                                                        .addCategoryCheck(
                                                            itemChild);
                                                  } else {
                                                    _storeCategories
                                                        .removeCategoryCheck(
                                                            itemChild);
                                                  }
                                                }),
                                          )
                                        ],
                                      ),
                                      children: itemChild.childs.length > 0
                                          ? [
                                              for (var itemChildChild
                                                  in itemChild.childs)
                                                TreeNode(
                                                    content: Row(
                                                  children: [
                                                    Text(itemChildChild.name,
                                                        style: TextStyle(
                                                            color:
                                                                Colors.white)),
                                                    Theme(
                                                      data: ThemeData(
                                                        unselectedWidgetColor:
                                                            Colors.grey,
                                                      ),
                                                      child: Checkbox(
                                                          value: _storeCategories
                                                              .inCheckList(
                                                                  itemChildChild),
                                                          activeColor:
                                                              Colors.green,
                                                          onChanged:
                                                              (bool newValue) {
                                                            if (newValue) {
                                                              _storeCategories
                                                                  .addCategoryCheck(
                                                                      itemChildChild);
                                                            } else {
                                                              _storeCategories
                                                                  .removeCategoryCheck(
                                                                      itemChildChild);
                                                            }
                                                          }),
                                                    )
                                                  ],
                                                )),
                                            ]
                                          : []),
                              ]
                            : []),
                ],
              )
            ],
          ));
    }
  }



Aucun commentaire:

Enregistrer un commentaire