首页 > 解决方案 > 如何构建要在 ListView.builder 中使用的类的对象?

问题描述

我制作了一类汽车(有多个字符串,例如价格和品牌等),我正在尝试构建它的列表,以便在 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);
          },
        ),
      ),
    );
  }
}

标签: flutter

解决方案


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

scrollDirection: Axis.vertical,
shrinkWrap: true,

并将父列放在列表视图中,并使构建器成为它的子项,而不是该列的子项。我的项目显示并且我只能在我按下某个特定位置时滚动……除此之外它不滚动……

https://gyazo.com/f221fe659df002032ef7b56af5da4a56


推荐阅读