flutter的ListView.builder自动计算高度

最新推荐文章于 2024-08-23 18:24:46 发布

小浪花a

最新推荐文章于 2024-08-23 18:24:46 发布

阅读量4.1k

点赞数

分类专栏： flutter 文章标签： flutter dart 前端

本文链接：https://blog.csdn.net/m0_47265814/article/details/111500190

版权

flutter 专栏收录该内容

48 篇文章 2 订阅

订阅专栏

多个listview套用时，或者与row、column同时使用时，会报hasSize错，这是就需要给对应的widget添加高度或宽度，由于listview.builder是按照数组长度自动计算高度，所以listview的长度是变化的，他有自己计算高度的方式：

shrinkWrap:true,

List collegeBaseList = [
  {
    'collegeName' : '标题1',
    'tabs' : ['标签1','标签2','标签3'],
    'imgUrl' : '',
  },
  {
    'collegeName' : '标题2',
    'tabs' : ['标签1','标签2','标签3','标签4'],
    'imgUrl' : '',
  },
  {
    'collegeName' : '标题3',
    'tabs' : ['标签1','标签2','标签3','标签5'],
    'imgUrl' : '',
  },
];
// 标题下面的列表
class CollegeBaseBody extends StatefulWidget {
  @override
  _CollegeBaseBodyState createState() => _CollegeBaseBodyState();
}

class _CollegeBaseBodyState extends State<CollegeBaseBody> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child:ListView.builder(
          shrinkWrap:true,
          itemExtent: 80.0,
          itemCount:collegeBaseList.length ,
          itemBuilder: (BuildContext content,int index){
            return Container(
              child:Card(
                child:ListTile(
                  title:Text(collegeBaseList[index]['collegeName']),
                  subtitle: Container(
                    height:30,
                    color:Colors.yellow,
                    child:ListView.builder(
                      shrinkWrap:true,
                      // itemExtent: 70.0,
                      scrollDirection: Axis.horizontal,
                      itemCount: collegeBaseList[index]['tabs'].length,
                      itemBuilder: (BuildContext content,int num){
                        return Container(
                          margin:EdgeInsets.fromLTRB(10, 4, 10, 4),
                          padding:EdgeInsets.only(left:4,right:4),
                          color:Colors.blue,
                          // child: Text(collegeBaseList[index]['collegeName']['tabs'][index]),
                          child: Text(collegeBaseList[index]['tabs'][num],),
                        );
                      },
                    ),
                  ),
                ),
              ),
            );
          },
      ),
    );
  }
}