'constraints.hasBoundedWidth': 不正确

Question

以下是我的代码

main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Student Info",
      debugShowCheckedModeBanner: false,
      home: SafeArea(
        child: HomePage(),
      ),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: ListView(
        children: <Widget>[StudentScreenAppBar(), StudentGraduateList()],
      ),
    );
  }
}

class StudentScreenAppBar extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      mainAxisAlignment: MainAxisAlignment.start,
      children: <Widget>[
        AppBar(
          leading: IconButton(
              icon: Icon(
                Icons.arrow_back_ios,
                color: Colors.black,
                size: 20.0,
              ),
              onPressed: () {}),
          centerTitle: true,
          title: Text(
            "Student Info",
            style: TextStyle(color: Colors.black),
          ),
          actions: <Widget>[
            IconButton(
                icon: Icon(
                  Icons.settings,
                  size: 20.0,
                  color: Colors.black,
                ),
                onPressed: () {}),
//        SizedBox(width: 10.0,),
            IconButton(
                icon: Icon(
                  Icons.settings_ethernet,
                  color: Colors.black,
                  size: 20.0,
                ),
                onPressed: () {})
          ],
          elevation: 0.0,
          backgroundColor: Colors.white,
        ),
        Container(
            decoration: BoxDecoration(border: Border.all(color: Colors.black)),
            padding: const EdgeInsets.fromLTRB(8.0, 2.0, 8.0, 2.0),
            child: Image.asset(
              "images/isdi_school.png",
              width: 40.0,
              height: 15.0,
              fit: BoxFit.contain,
            ))
      ],
    );
  }
}

class StudentGraduateList extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.fromLTRB(0.0, 20.0, 0.0, 0.0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          yearListForUgPg("Under Graduate"),
          yearListForUgPg("Post Graduate")
        ],
      ),
    );
  }

  Widget yearListForUgPg(String graduationName) {
    return Column(
      children: <Widget>[
        Container(
          padding: const EdgeInsets.fromLTRB(25.0, 4.0, 25.0, 4.0),
          child: Text(
            graduationName,
            style:
                TextStyle(color: Colors.white, fontFamily: "suisseintlMedium"),
          ),
          decoration: BoxDecoration(color: Colors.black),
        ),
        ListView.builder(
          shrinkWrap: true,
          itemBuilder: (context, index) {
            return Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  "2018",
                  style: TextStyle(
                      fontFamily: "okomitoBold", color: Colors.black),
                ),
                Icon(Icons.arrow_forward)
              ],
            );
          },
          itemCount: 10,
        )
      ],
    );
  }
}

ListView 小部件未显示。如果我评论 ListView，那么代码可以正常工作，我可以看到 UI。我尝试将 ListView 包裹在 Expanded and Flexible Widget 中，但它不起作用。

如果我取消对 ListView 的注释，则会收到错误提示 'constraints.hasBoundedWidth': is not true。我正试图在我的 UI:

中实现这样的目标

![图片][1]

Answer 1

只需将您的 -Column 包裹在 Expanded 小部件中：这样您的 Column 将尝试占用父 Row 中可用的 space。

更新代码：

class StudentGraduateList extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.fromLTRB(0.0, 20.0, 0.0, 0.0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          Expanded(child: yearListForUgPg("Under Graduate")),
          Expanded(child: yearListForUgPg("Post Graduate"))
        ],
      ),
    );
  }

Answer 2

你也可以这样使用

您可以将 Column 放入容器中并指定宽度

我们的 Column 尝试无限扩展，因此您应该通过设置预定义的宽度来限制它。这是一个例子：

final _mediaQuery = MediaQuery.of(context).size;

Container(
  width: _mediaQuery.width,
  height: _mediaQuery.height * 0.4,
  child: ...
  ....
)

'constraints.hasBoundedWidth': 不正确

'constraints.hasBoundedWidth': is not true

listview

constraints

width

flutter