Flutter Pageview.builder每个页面的内容

时间:2019-07-25 17:21:16

标签: android json list flutter pageviews

我想创建一个动态类别显示列表,每次我从API添加新类别时,它都会在flutter应用程序中显示,并带有类别内产品列表。

所以我正在使用 Pageview.builder Gridview.builder 显示项目,但问题是所有 Pageviews 具有相同的GridView.builder的内容。 如何使每个PageView具有不同的GridView构建器内容?

代码:


class GridShop extends StatefulWidget {
  @override
  _GridShop createState() => new _GridShop();
}

class _GridShop extends State<GridShop> {
  @override
  Widget build(BuildContext context) {
    double _gridSize =
        MediaQuery.of(context).size.height * 0.88; //88% of screen
    double childAspectRatio = MediaQuery.of(context).size.width /
        (MediaQuery.of(context).size.height / 1.0);

    List<Product> _products = new ProductsRepository().categoryProducts();
    List _categories = new ProductsRepository().categories();



    Widget _pageItemBuilder(BuildContext context, int index){

      return new GridView.builder(
          itemCount: _products.length,
          gridDelegate:
          new SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              childAspectRatio: childAspectRatio),
          itemBuilder: (BuildContext context, int index) {
            return new Padding(
                padding: EdgeInsets.only(
                    top: index % 2 == 0 ? 20 : 0,
                    right: index % 2 == 0 ? 5 : 0,
                    left: index % 2 == 1 ? 5 : 0,
                    bottom: index % 2 == 1 ? 20 : 0),
                child: ProductWidget(
                    product: _products[index]));
          });
    }
    _onPageViewChange(int page) {
      print("Current Page: " + page.toString());
      int previousPage = page;
      if(page != 0) previousPage--;
      else previousPage = 2;
      print("Previous page: $previousPage");
    }

    return new Column(children: <Widget>[
      new Container(
          height: _gridSize + 100,
          decoration: BoxDecoration(
              color: const Color(0xFFeeeeee),),
          padding: EdgeInsets.only(left: 10, right: 10),
          child: new Column(children: <Widget>[
            new Container(
                margin: EdgeInsets.only(top: 40),
                child: new Column(children: <Widget>[
                  new Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        new CategoryDropMenu(),
                        new FlatButton.icon(
                            onPressed: () {
                              print("/-***********************-/-*/-*/*-/-*/-/-*/*-/*-/-*/*-/-/-*/-*/-");
                              print(_categories.toString());
                            },
                            icon: new Icon(Icons.filter_list),
                            label: new Text("cats"))
                      ]),
                  new Container(
                      height: _gridSize - 60,
                      margin: EdgeInsets.only(top: 0),
                      child: new PhysicalModel(
                          color: Colors.transparent,
                          borderRadius: BorderRadius.only(
                              bottomLeft: Radius.circular(_gridSize / 10 - 10),
                              bottomRight:
                                  Radius.circular(_gridSize / 10 - 10)),
                          clipBehavior: Clip.antiAlias,
                          child: new PageView.builder(




                           itemCount: _categories.length,
                            scrollDirection: Axis.horizontal,
                            reverse: false,
                            pageSnapping: true,
                            onPageChanged: _onPageViewChange,
                            itemBuilder: (BuildContext context, int index){
                             return Container(
                               child: Column(
                                 children: <Widget>[
                                   _pageItemBuilder(context, index)
                                 ],
                               ),
                             );
                            },


                          ))),
                new MenuBar(),

                ]))
          ])),

    ]);
  }
}

以及如何将列表内容传递给构建者? 我尝试过

Future<String> getCategoryStocks(url) async {
  final urlCategories = url;
  var response = await http.get(urlCategories);

  if (response.statusCode == 200) {
// If server returns an OK response, parse the JSON.
    categoriesData = utf8.decode(response.bodyBytes);
    print(categoriesData);
    return categoriesData;

  } else {
// If that response was not OK, throw an error.
    throw Exception('Failed to load categories');
  }
}

List<Product>  categoryProducts(){
      print("/////////////////////////////////////////////////////////Category Products//////////////////////////////////////////////////////////");

      List dataCat = categories();
      List links = [];
      List linkStocks = [];
      for (var item in dataCat) {
        links.add("laravel/public/api/category/" + item.toString());
      }

      print(links.toString());
      for (var link in links) {
        var get = getCategoryStocks(link.toString());
        var jsonB = (json.decode(get) as List).cast<Map<String, dynamic>>();
        var list = jsonB.map<Response1>((e) => Response1.fromJson(e)).toList();

        linkStocks.add(get);

      }
      print(linkStocks.toString());

      var jsonB = (json.decode(body) as List).cast<Map<String, dynamic>>();
      var list = jsonB.map<Response1>((e) => Response1.fromJson(e)).toList();

      for (var item in list) {
        items.add(new Product("laravel/storage/app/upload/images/" + item.image ,item.name, item.descriptions, item.price, item.quantity ,item.id));
      }

      print(items);
      print(items.runtimeType);
      return items;

    }


    List categories() {
      var jsonB = (jsonDecode(categoriesData) as List).cast<Map<String, dynamic>>();
      var list = jsonB.map<Response1>((e) => Response1.fromJson(e)).toList();
      List<String> categories = [];
      for (var item in list) {
        categories.add(item.name);
      }
      print(categories.toString());
      return categories;
    }

0 个答案:

没有答案