繁体   English   中英

如何在颤动中为容器小部件设置动态高度?

[英]How to set dynamic height for Container Widget in flutter?

我在容器内有文本小部件,如果文本超过 4 行,则会溢出到容器底部。 如何为此容器设置取决于文本行并避免底部溢出的动态高度? 目前容器具有固定值,但如果我删除此值,它将消失。

在此处输入图像描述

home component 

Widget build(BuildContext context) {
 return Container (
   child:    SliverToBoxAdapter(
                        child: Container(
                          height: 180,
                          margin: EdgeInsets.only(top: 10),
                          child: CustomeInfoWidget(
                            infoData: _infoDataList,
                          ),
                        ),
                      ),
) 
}

CustomeInfoWidget

Widget build(BuildContext context) {
    final double _width = MediaQuery.of(context).size.width;

    return Container(
      margin: EdgeInsets.only(top: 15, left: 15, right: 15),
      child: Stack(
        children: [
          PageView.builder(
            itemCount: widget._infoDataList.length,
            controller: _pageController,
            
            itemBuilder: (BuildContext context, int index) {
              return Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Container(
                    width: _width - 10,
                    child: Padding(
                      padding: const EdgeInsets.only(bottom: 10),
                      child: Text(widget._infoDataList[index].title,
                          textAlign: TextAlign.left,
                         
                  ),
                  Container(
                    child: Text(
                      widget._infoDataList[index].content,
                    
                    ),
                  )
                ],
              );
            },
          ),
        
        ],
      ),
    );
  }

使用 Singlechildscrollview 包装容器或为 Text 小部件设置溢出Flutter - 在溢出时包装文本,例如插入省略号或淡入淡出

在您的 home 组件上,您正在修复CustomeInfoWidget的高度。 您可以删除它。

 SliverToBoxAdapter(
   child: Container(
    //  height: 180,// remove this
      margin: EdgeInsets.only(top: 10),
          child: CustomeInfoWidget(

您可以将SliverFillRemaining用于PageView

SliverFillRemaining(
  child:  PageView.builder(

或者,您可以使用Singlechildscrollview包装您的文本容器以进行内部滚动。

您还可以计算文本高度并提供它。

如何在 Flutter 中获取 Text 小部件的大小

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM