如何根据内部文本动态更改容器大小?

问题描述

我正在显示一个动画容器列表,这些容器最初具有特定的 maxLines 文本。当用户点击容器时,我希望容器展开以完美适合整个文本

这是我的简化代码:

AnimatedContainer(
                         height: containerHeight,curve: Curves.easeOut,duration: Duration(milliseconds: 400),child: Column(
                                   mainAxisAlignment: MainAxisAlignment.center,crossAxisAlignment: CrossAxisAlignment.start,children: [
                                     Text(searchBooksList[index].title),Text('By ${searchBooksList[index].author}'),Expanded(
                                         child: Text(
                                           '\n${searchBooksList[index].description}',overflow: TextOverflow.ellipsis,maxLines: searchBooksList[index].expanded ? 50 : 7,)
                                     ),],),)

当用户点击容器时:

onTap: () {
            setState(() {
            searchBooksList[index].expanded = !searchBooksList[index].expanded;

            });
          },

目前,我明确提到了基于文本长度的容器高度

double len;
                 if(searchBooksList[index].description.length <= 500)
                   len=0.3;
                 else if (searchBooksList[index].description.length > 500 && searchBooksList[index].description.length<=750)
                   len = 0.6;
                 else if(searchBooksList[index].description.length > 750 && searchBooksList[index].description.length<=1000)
                   len=0.66;
                 else if(searchBooksList[index].description.length > 1000 && searchBooksList[index].description.length<=1500)
                   len=1.0;
                 else if(searchBooksList[index].description.length>=1500)
                   len=1.2;
                 double containerHeight = searchBooksList[index].expanded ? 1000 * len
                     : 1000 * 0.25;

这是现在发生的事情:

enter image description here

但这会在某些文本的末尾留下空行。有没有更好的方法来适应文本而不调整文本大小?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)