如何构建要在ListView.builder中使用的类的对象?

时间:2019-07-14 22:22:55

标签: flutter

我制作了一类汽车(具有多个字符串,例如价格和品牌等。),我试图建立一个列表,以便在ListView中构建卡片时可以使用它,但屏幕上没有任何显示当我运行代码时。 我收到一个错误消息,说垂直视口被赋予了无限的高度,并且我的应用程序不显示任何卡片(尽管它确实在屏幕上显示了其他任何内容)

我的课:-

class cars {
  String brand, type, model, color, price, pic;

  cars(String b, String t, String m, String c, String p1, String p2) {
    brand = b;
    type = t;
    model = m;
    color = c;
    price = p1;
    pic = p2;
  }
}

(页面类)

class CHomePage extends State<CHP> {
  int i = 0;
  String price;
  int selected = 0;
  List<String> prices = ["Any", "<= 1200", "<= 1600", "<= 1800", "<= 2000"];
  List<cars> myCars = new List();

  void carsBuilder() {
    cars c = new cars(
        "Chevorlet", "Corvette Stingray", "2019", "Turqoise", "\$2100",
        "assets/Images/corvette.jpg");
    myCars.add(c);
    c = new cars("Chevorlet", "Impala", "1967", "Black", "\$1900",
        "assets/Images/impala.jpg");
    myCars.add(c);
    c = new cars(
        "Dodge", "Challenger SRT Hellcat", "1967", "Dark Red", "\$2000",
        "assets/Images/challenger.jpg");
    myCars.add(c);
  }
  Widget buildPicker() {
    return CupertinoPicker(
        itemExtent: 50,
        backgroundColor: CupertinoColors.white,
        onSelectedItemChanged: (index) {
          setState(() {
            selected = index;
          });
        },
        children: List<Widget>.generate(
          prices.length,
          (index) {
            return Center(
              child: Text(
                prices[index],
                style: TextStyle(fontSize: 18, color: Color(0xff469ABF)),
              ),
            );
          },
        ));
  }
  void incrementTab(index) {
    setState(() {
      i = index;

      if (i == 1) {
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => CAP()),
        );
      } else if (i == 2) {
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => LP()),
        );
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CupertinoNavigationBar(
        middle: Text(
          'Home Page',
          style: TextStyle(color: Color(0xff469ABF)),
        ),
      ),
      body: Center(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            new Padding(
              padding: EdgeInsets.all(20),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  new Text(
                    "Choose Price Range:   ",
                    style: TextStyle(fontSize: 18, color: Color(0xff469ABF)),
                  ),
                  new CupertinoButton(
                    onPressed: () async {
                      await showModalBottomSheet<int>(
                        context: context,
                        builder: (BuildContext context) {
                          return buildPicker();
                        },
                      );
                    },
                    child: Text(prices[selected]),
                  ),
                ],
              ),
            ),
            new ListView.builder(
              itemCount: myCars.length,
              itemBuilder: (context, index) {
                return Card(
                  child: Column(
                    children: <Widget>[
                      new ListTile(
                        leading: Icon(Icons.directions_car),
                        title: Text(myCars[index].type),
                        subtitle: Text(myCars[index].price),
                      ),
                      new ButtonTheme.bar(
                        child: ButtonBar(
                          children: <Widget>[
                            new CupertinoButton(
                              child: Text("View More Details"),
                              onPressed: () {},
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                );
              },
            ),
          ],
        ),
      ),
      bottomNavigationBar: new Theme(
        data: Theme.of(context).copyWith(
            primaryColor: Colors.lightBlue,
            textTheme: Theme.of(context)
                .textTheme
                .copyWith(caption: new TextStyle(color: Colors.black))),
        child: new BottomNavigationBar(
          items: [
            BottomNavigationBarItem(
              title: new Text('Home'),
              icon: Icon(Icons.home),
            ),
            BottomNavigationBarItem(
              title: new Text('Account'),
              icon: Icon(Icons.person),
            ),
            BottomNavigationBarItem(
              title: new Text('Logout'),
              icon: Icon(Icons.directions_run),
            ),
          ],
          currentIndex: i,
          onTap: (index) {
            incrementTab(index);
          },
        ),
      ),
    );
  }
}

2 个答案:

答案 0 :(得分:1)

更新:- 我将这两行添加到了ListView.builder中:-

scrollDirection: Axis.vertical,
shrinkWrap: true,

,然后将父列放在列表视图中,并使构建器成为它的子级,而不是该列的子级。 我的项目显示出来,只有按特定的地方时我才能滚动..除了它不滚动..

https://gyazo.com/f221fe659df002032ef7b56af5da4a56

答案 1 :(得分:0)

您要在哪里初始化汽车列表

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    carsBuilder();
  }