首页 > 解决方案 > 无法在颤动的列表视图中滚动交错的网格视图

问题描述

我在 Listview.Images 中添加了交错网格视图作为小部件,并且所有内容都可以完美加载,但是指向它时我无法滚动交错网格视图。但是整个页面可以逐点滚动到列表视图的其他部分。我附上了下面的代码。谁能帮我解决这个问题。

import 'package:beata2/services/sign_in.dart';
import 'package:beata2/ui/fashion.dart';
import 'package:beata2/ui/firstScreen.dart';
import 'package:beata2/ui/hotDeals.dart';
import 'package:carousel_pro/carousel_pro.dart';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';

import 'add_card_for_gride.dart';
import 'car_item_model.dart';

class Dashboard extends StatefulWidget {
  @override
  _DashboardState createState() => _DashboardState();
}

class _DashboardState extends State<Dashboard> {
  String carBand;
  String carYear;
  String carImage;
CarModel carObjec = new CarModel("carBand","carYear","carImage");

var car;
  List<CarModel> _listOfObjects = <CarModel>[];
  @override
  void initState() {
    // TODO: implement initState
    carObjec.getData().then((result) {
      setState(() {
        car = result;
      });
    });
    super.initState();
  }

 

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: ListView(
      children: <Widget>[
        SizedBox(
          height: 350.0,
          width: 450.0,
          child: Stack(
            children: [
              SizedBox(
                height: 250.0,
                child: AppBar(
                  title: Text("Welcome"),
                  backgroundColor: Colors.blue,
                  leading: IconButton(
                    icon: Icon(Icons.menu),
                    onPressed: () {},
                  ),
                  elevation: 0.0,
                ),
              ),
              Positioned(
                left: 0.0,
                right: 0.0,
                top: 100.0,
                bottom: 0.0,
                child: Container(
                  child: CarouselSlider(
                      items: [
                        'https://www.crn.com/resources/025c-0f3247198c32-7caef631a12d-1000/pets.jpg',
                        'https://cdn.aohostels.com/img/infos/pets/Header-Pets-C.jpg',
                      ].map((e) {
                        return ClipRRect(
                            borderRadius:
                                BorderRadius.all(Radius.circular(10.0)),
                            child: Container(
                              child: GestureDetector(
                                  child: Image.network(e, fit: BoxFit.fill),
                                  onTap: () {
                                    switch (e) {
                                      case "https://www.crn.com/resources/025c-0f3247198c32-7caef631a12d-1000/pets.jpg":
                                        Navigator.push<Widget>(
                                          context,
                                          MaterialPageRoute(
                                            builder: (context) => Fashion(),
                                          ),
                                        );
                                        break;
                                      case "https://cdn.aohostels.com/img/infos/pets/Header-Pets-C.jpg":
                                        Navigator.push<Widget>(
                                          context,
                                          MaterialPageRoute(
                                            builder: (context) => HotDeals(),
                                          ),
                                        );
                                        break;
                                      default:
                                        return Text(' ');
                                        break;
                                    }
                                  }),
                            ));
                      }).toList(),
                      options: CarouselOptions(
                        height: 350.0,
                        aspectRatio: 16 / 9,
                        viewportFraction: 0.8,
                        initialPage: 0,
                        enableInfiniteScroll: true,
                        reverse: false,
                        autoPlay: true,
                        autoPlayInterval: Duration(seconds: 3),
                        autoPlayAnimationDuration: Duration(milliseconds: 800),
                        autoPlayCurve: Curves.fastOutSlowIn,
                        enlargeCenterPage: true,
                        scrollDirection: Axis.horizontal,
                      )),
                ),
              ),
            ],
          ),
        ),
        Padding(
          padding: EdgeInsets.all(8.0),
          child: Text("Categories"),
        ),
        Container(
          height: 30.0,
          child: ListView(
            scrollDirection: Axis.horizontal,
            children: <Widget>[
              Category(
                image_location: 'assets/interface.png',
                image_caption: 'Categories',
              ),
              Category(
                image_location: 'assets/interface.png',
                image_caption: 'Categories',
              ),
              Category(
                image_location: 'assets/interface.png',
                image_caption: 'Categories',
              ),
              Icon(Icons.add),
              Icon(Icons.add),
              Icon(Icons.add),
               Icon(Icons.add),
              Icon(Icons.add),
              Icon(Icons.add),
            ],
          ),
        ),
        Padding(
          padding: EdgeInsets.all(30.0),
          child: Text("All"),
        ),
         StreamBuilder(
            stream: car,
            builder: (context, snapshot) {
              if (snapshot.hasData) {
                for (int i = 0; i < snapshot.data.documents.length; i++) {
                  // DocumentSnapshot snap = snapshot.data.documents[i];

                  String carBrand =
                      snapshot.data.documents[i].data['carBrand'];
                  String caryear = snapshot.data.documents[i].data['carYear'];
                  String carimage =
                      snapshot.data.documents[i].data['urls'][0];                  
                  _listOfObjects.add(CarModel(carBrand,caryear,carimage));
                }
                return sliverGridWidget(context);
              } else {
                return Text("loading");
              }
            }
            ),
        
      ],
    ));
  }

  Widget sliverGridWidget(context) {
     return StaggeredGridView.countBuilder(
       padding: const EdgeInsets.all(8.0),
       shrinkWrap: true,
      primary: true,
      crossAxisCount: 4,
      itemCount: _listOfObjects.length, //staticData.length,
      // itemBuilder: (context, index) {
      //   return Card(
      //       elevation: 8.0,
      //       child: InkWell(
      //           child: Hero(
      //             tag: index, // staticData[index].images,
      //             child: new FadeInImage(
      //               width: MediaQuery.of(context).size.width,
      //               image: NetworkImage(
      //                   "https://images.unsplash.com/photo-1468327768560-75b778cbb551?ixlib=rb-1.2.1&w=1000&q=80"), // NetworkImage(staticData[index].images),
      //               fit: BoxFit.cover,
      //               placeholder: AssetImage("assets/images/app_logo.png"),
      //             ),
      //           ),
      //           onTap: () {
      //             //
      //           }
      //           )
      //           );
      // },
      itemBuilder: (BuildContext context, int index) {
        return AadCardForGrid(_listOfObjects[index]);
      },
     staggeredTileBuilder: (int index) => StaggeredTile.fit(2),
     mainAxisSpacing: 4.0,
      crossAxisSpacing: 4.0,
      
    );

  }
}

class Category extends StatelessWidget {
  final String image_location;
  final String image_caption;

  Category({
    this.image_location,
    this.image_caption,
  });

  @override
  Widget build(BuildContext context) {
    return Padding(
        padding: EdgeInsets.all(2.0),
        child: InkWell(
          onTap: () {},
          child: Container(
            width: 100.0,
            child: ListTile(
              title: Image.asset(
                image_location,
                width: 100.0,
                height: 80.0,
              ),
              subtitle: Text(image_caption),
            ),
          ),
        ));
  }
}

标签: flutterlistviewdart

解决方案


推荐阅读