Question

我在flutter中使用GridView.count（）创建了一个网格视图。

例如，现在开始时，我的网格视图中有8个项目（最大= 8）。我想根据用户稍后选择的某些条件从网格中删除特定的单元格。我很难做到这一点，好像我用一个空容器替换了网格单元（动态检查状态）时，它仍然在网格中发生，而我希望该单元被完全移除（甚至不在GridView中发生））。有没有办法做到这一点？

编辑

这是代码。条件检查在行号return语句中。 10。

Expanded(
                    child: GridView.count(
                      physics: BouncingScrollPhysics(),
                      scrollDirection: Axis.vertical,
                      crossAxisCount: 2,
                      childAspectRatio: 0.7,
                      children: new List<Widget>.generate(
                          category != null ? category.category.length : 0,
                          (index) {
                        return _lowerLimit < category.category.elementAt(index).price && _upperLimit > caregory.categoty.elementAt(index).price ? 
                        GridTile(
                          child: Column(
                            children: <Widget>[
                              Container(
                                margin: EdgeInsets.all(3.0),
                                padding:
                                    EdgeInsets.symmetric(vertical: 30.0),
                                color: Colors.white,
                                child: Hero(
                                  tag: category.category
                                      .elementAt(index)
                                      .productId,
                                  child: Material(
                                    child: InkWell(
                                      onTap: () {
                                        Navigator.of(context).push(
                                            CupertinoPageRoute(
                                                builder: (context) =>
                                                    ItemDetails(
                                                      category.category
                                                          .elementAt(index)
                                                          .productId,
                                                      category.category
                                                          .elementAt(index)
                                                          .name,
                                                      category.category
                                                          .elementAt(index)
                                                          .description,
                                                      category.category
                                                          .elementAt(index)
                                                          .image,
                                                    )));
                                      },
                                      child: Stack(
                                        children: <Widget>[
                                          Center(
                                            child: Image(
                                              image: _loadImage(index),
                                              height: 162.0,
                                              width: 200.0,
                                            ),
                                          )
                                        ],
                                      ),
                                    ),
                                  ),
                                ),
                              ),
                              Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: <Widget>[
                                  Container(
                                    margin: EdgeInsets.only(left: 15.0),
                                    child: Column(
                                      //mainAxisAlignment: MainAxisAlignment.center,
                                      crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                      children: <Widget>[
                                        Container(
                                          width: 120.0,
                                          child: Hero(
                                            tag: category.category
                                                .elementAt(index)
                                                .name,
                                            child: Text(
                                              category.category
                                                  .elementAt(index)
                                                  .name,
                                              style: TextStyle(
                                                  fontSize: 12.5,
                                                  fontWeight:
                                                      FontWeight.bold),
                                              overflow:
                                                  TextOverflow.ellipsis,
                                            ),
                                          ),
                                          margin:
                                              EdgeInsets.only(right: 5.0),
                                        ),
                                        Container(
                                          height: 2.0,
                                        ),
                                        Text(
                                          AppConstants.CURRENCY_SYMBOL +
                                              " " +
                                              double
                                                  .tryParse(category
                                                      .category
                                                      .elementAt(index)
                                                      .price)
                                                  .toStringAsFixed(2),
                                          style: TextStyle(
                                              fontSize: 14.0,
                                              fontWeight: FontWeight.bold,
                                              color: Colors.blue),
                                          overflow: TextOverflow.clip,
                                        )
                                      ],
                                    ),
                                  ),
                                  Container(
                                    margin: EdgeInsets.only(right: 10.0),
                                    alignment: Alignment.topRight,
                                    child: Icon(
                                      Icons.favorite,
                                      color: Colors.blue,
                                    ),
                                  )
                                ],
                              ),
                              Divider(
                                color: Colors.blue,
                                indent: 10.0,
                              ),
                            ],
                          ),
                        ) : Container();
                      }),
                    ),
                  )

Answer 1

假设您有一个list （包含8个项目），您通过它们渲染了GridView。

new GridView.count(children: maptoWidgets(list))

根据用户操作，更新list中的setState，这将使用更新后的项目重新呈现GridView。

setState(() {
  // update the list
})

已根据代码更新：您有类似的情况

_lowerLimit < category.category.elementAt(index).price && 
_upperLimit > caregory.categoty.elementAt(index).price ? GridTile() : Container()

如果不满足该条件，则我们将放置一个空容器。因此，我们将在那里获得一个空白空间，而不是跳过该元素。

如何避免这种情况：

使用如下所示的过滤器

filteredCategory = category.category
                     .where((oneCategory) {_lowerLimit < oneCategory.price 
                                     && _upperLimit > oneCategory.price;}).toList()

在您的GridView.count内，将所有category.category替换为filterCategory。用户操作（或要刷新时）只需调用setState((){})

Answer 2

这应该做的简单的事情。

    //filtering the content based on user online status
    contact = contact.where((contact) => contact.onlineStatus == i).toList();
    //where i is 1 or 0, or both (using data manipulation techniques)

从Flutter中的GridView中动态删除项目

2 个答案: