Flutter,如何设置列表视图项的最大高度

wlwcrazw  于 2023-06-24  发布在  Flutter
关注(0)|答案(4)|浏览(233)

我尝试的是下面。

SizedBox(
           width: MediaQuery.of(context).size.width * 0.88,
           height: MediaQuery.of(context).size.height * 0.42,
             child: ListView.builder(
                   itemCount: 10,                          
                   itemBuilder: (BuildContext context, int index) {
                            return _buildListItem();
                         }),
                   )

和列表小部件

Widget _buildListItem() {
    return ConstrainedBox(
      constraints: BoxConstraints(
        minHeight: 20,
          maxHeight: 120),
       child:Container(child:Text("Looooongggg textttttttttt 
              the text size is alwayysss different "),
       ),}

我想使列表视图项目的大小动态,但也最大高度是固定在120。换句话说,无论文本有多长,容器也不希望达到120或更多。
这段代码总是只显示最大高度的容器。不管字母有多短,
我怎么能做到呢?

fgw7neuy

fgw7neuy1#

尝试IntrinsicHeight小部件

Widget _buildListItem() {
    return ConstrainedBox(
      constraints: BoxConstraints(
        minHeight: 20,
          maxHeight: 120),
       child: IntrinsicHeight(child:Container(child:Text("Looooongggg textttttttttt 
              the text size is alwayysss different "),
       )),}
bqf10yzr

bqf10yzr2#

您可以通过将滚动物理设置为 NeverScrollablePhysics 来实现这一点。通过这样做,列表视图将具有足够的高度,以便它的所有子级都可以容纳其中。例如:

...
    ListView.builder(
      physics:NeverScrollableScrollPhysics(),//this line would the change                               
      itemCount: 10,                          
      itemBuilder: (BuildContext context, int index) {
              return _buildListItem();
            }),
           ),
    ...
bqujaahr

bqujaahr3#

我做了件有趣的事,看

ConstrainedBox(
          constraints: BoxConstraints(
            minHeight: 50,
            maxHeight:
                (50 * (wallet.length < 3 ? wallet.length : 3)).toDouble(),
          ),
          child: ListView(

我的listview显示了我的钱包列表的内容的文本小部件列表,我发现50是足够的大小为1项,所以作为maxHeight,我乘以50行数,最多3行,所以我不会浪费空间时,我的列表有少于3项,和更多的项目,listview将滚动。我是新的Flutter和编程一般来说,这当然不是最好的解决方案,但它为我工作。

irlmq6kh

irlmq6kh4#

使用Container并将最小值、最大值高度指定给BoxConstraints

Container(
        child: ListView.builder(itemBuilder: (BuildContext context, index) {
            return Container(
              constraints: BoxConstraints(minHeight: 20, maxHeight: 40),
              color: Colors.red,
              child: Divider(),
            );
        }, itemCount: itemsList.length,),
      ),

输出:

相关问题