将卡大到足以容纳孩子的文字

Question

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

我想将卡片的正常高度设置为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为true时，我没有指定高度，因此我可以将卡扩展到正确的高度以包含文本。 >

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

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

---

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

我正在创建一张包含详细说明的简单卡片。我想将卡片的正常高度设置为50px，当用户单击它时，我要扩展卡片以使其适合所有......>

Answer 1

您可以设置两个变量：

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