为活动设置父窗口小部件动画以适合孩子的大小

时间:2019-01-05 11:23:10

标签: flutter flutter-layout flutter-animation

首先,考虑到我是Flutter的新手,解决方案可能很明显,但是我已经搜索了许多小时,但无济于事,所以继续讨论这个问题。 我正在尝试在Flutter中提供降价说明,在轻敲人字形时应该可以对其进行扩展。

我尝试将AnimatedContainerAnimatedSizeFlexExpandedFlutter Layout Row / Column - share width, expand height一起使用,并尝试查看警告”“只能从绘画回调或交互中调用它事件处理程序(例如手势回调)。”  如果我尝试在涂漆之前将孩子的尺寸弄大,Flutter会给我。

我看过几个地方,包括我将在此处链接的StackOverflow问题:

接下来的代码是我试图获得扩展/折叠动画的地方。 变量isExpanded只是一个布尔值,而函数_onPressed只是在该布尔值之间切换。 基于此,我应该获得降价商品的总高度或仅显示其中的一部分。

@override
Widget build(BuildContext context) {
  markdown = Markdown(body);
  var icon = (isExpanded) ? Icons.expand_less : Icons.expand_more;
  var iconButton = IconButton(icon: Icon(icon), onPressed: _onPressed);

  return Container(
    child: Column(children: <Widget>[
      AnimatedContainer(
        // constraints: BoxConstraints(), this is where I'd like to set the change from 30% to infinity
        child: SingleChildScrollView(child: markdown),
        curve: Curves.bounceIn,
        duration: Duration(milliseconds: 300),
      ),
      iconButton
    ]),
  );
}

我想做的是一个类似Trello的动画。在电话应用程序中,卡的描述是可扩展和可折叠的。展开后,它仅占据所需的高度,甚至会使屏幕溢出。这意味着可滚动部分是包含说明和任何其他小部件的小部件,而不是说明本身。

实际发生的是:

  • 如果我尝试使用BoxConstraints设置高度(在MediaQuery中,然后扩展到Size.infinity,则动画实际上无法处理,因为它从有界到无界。 / li>
  • 如果我尝试将height中的参数AnimatedContainer设置为屏幕的30%,然后设置为无穷大,则当其为无穷大时,内容就会消失。

1 个答案:

答案 0 :(得分:0)

也许使用SizeTransitionScaleTransition。这是answer,它使用以下小部件来折叠和展开小部件。