时间戳

首页 > 解决方案 > OpenContainer Flutter：如何设置打开容器的大小，默认是全屏打开

flutter - OpenContainer Flutter：如何设置打开容器的大小，默认是全屏打开

问题描述

在最近的 Flutter 版本中，有一个新功能 Open Container，这里是片段，如何设置 openContainer 的大小，closedbuilder 是在其范围内接受和渲染，但 open builder 是全屏大小。

OpenContainer(
            openElevation: 0,
            closedElevation: 0,
            closedColor: Colors.transparent,
            transitionType: ContainerTransitionType.fadeThrough,
            openBuilder: (BuildContext context, VoidCallback _) {
              return SizedBox( height:240, 
                        width:MediaQuery.of(context).size.width
                               child:SearchWidget());
            },
            closedBuilder:
                (BuildContext context, VoidCallback openContainer) {
              return Container(
                 height: 50
                 width: 50
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    const Icon(Icons.search),
                    const Text('Search', style: TextStyle(fontSize: 12))
                  ],
                ),

标签： flutterflutter-layoutflutter-animation

解决方案

OpenContainer – 一种容器，它会在点击时填充屏幕以显示新内容。类似于英雄小部件。

您无法调整Widget中的openBuilder方法。OpenContainer

因为如果您在单击搜索按钮后想要一个更小尺寸的小部件，它会将您的小容器转换为一个完整的视图页面，您应该使用animatedBuilder并制作自己的动画

推荐阅读