将卡片大到足以适合孩子的文字编辑

我正在创建一张包含详细说明的简单卡片。

我想将卡片的正常高度设置为50像素，当用户单击它时，我要扩展卡片以使其内部的所有内容都适合。

到目前为止，为了满足我的需求，我写了这篇文章：

String aLotOfText = "When Gradle resolves the compile classpath,it first resolves the runtime classpath and uses the result to determine what versions of dependencies should be added to the compile classpath. In other words,the runtime classpath determines the required version numbers for identical dependencies on downstream classpaths. Your app's runtime classpath also determines the version numbers that Gradle requires for matching dependencies in the runtime classpath for the app's test APK. The hierarchy of classpaths is described in figure 1.";
bool cardExpanded = false;


InkWell(
onTap: () {
expandCard();
},child: AnimatedContainer(
height: cardExpanded ? null : 50,duration: Duration(milliseconds: 200),child: Card(
child: Text(aLotOfText),),)
)


expandCard() {
setState(() {
cardExpanded = !cardExpanded;
});
}


正如您在height: cardExpanded ? null : 50,为cardExpanded的{​​{1}}行中看到的那样，我没有指定高度，所以我可以将卡向右扩展包含文本的高度。

但是有了这个小技巧，我已经完全失去了动画效果，只要这张卡与20张或更多其他卡一起进入列表视图，打开和关闭便会使列表上下跳动。

我敢肯定，有一种方法可以将卡扩展到合适的高度，同时保留动画。

我还想指定上面的只是一个例子，在我的卡片中，还将有图像和按钮。
另外，用按钮打开卡时，我可以添加一些文本，因此卡在打开时也必须扩展。
这就是为什么我不能指定高度的原因。

编辑

有了true，我得到了想要的东西，因此，卡片的大小足以容纳内容，但是您可以看到那里没有动画

相反，如果我提供类似height: cardExpanded ? null : 50的值，则会获得动画，但是很明显，卡片会一直增长到100像素，并且不会显示所有内容。

我想要获得的结果是第一个示例中的内容以及动画。

谢谢

您可以设置两个变量：

height = MediaQuery.of(context).size.height * 0.8; //the percentage you want the card to grow
width = MediaQuery.of(context).size.width * 0.8;


因此，当expanded为true时，容器会增大。

height: cardExpanded ? height : 50,width: cardExpanded ? width : 50,

此外，要指定动画的执行方式，您可以使用一个属性，使动画看起来更平滑。

curve: Curves.bounceInOut,

或者您可以尝试使用展开式调整之类的小部件。