flutter - 如何在没有错误的情况下缩小 parent 忽略 child 的大小

Question

我想将容器设置为高度 0 的动画。我希望 child 缩小到它，但显然它会抛出溢出像素错误。而且我不知道如何让 children 无误地缩小。

我尝试搜索一些像 BoxContraints 这样的小部件以使其忽略溢出或类似的东西，但我什至不确定该怎么做

_topContainerHeight = _queryFieldHasFocus ? 0 : MediaQuery.of(context).size.height / 1.75;

    return StreamBuilder<FirebaseUser>(
        stream: _authService.userStream,
        builder: (context, snapshot) {
          ConnectionState state = snapshot.connectionState;
          bool loggedIn = _authService.user != null;

          return Scaffold(
            appBar: appBar,
            body: SingleChildScrollView(
              physics: ClampingScrollPhysics(),
              child: Column(
                children: <Widget>[
                  AnimatedContainer(
                      duration: Duration(milliseconds: 500),
                      curve: Curves.bounceInOut,
                      height: _topContainerHeight,
                      width: double.infinity,
                      color: Colors.deepPurple,
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          if (state == ConnectionState.waiting) ...[
                            CircularProgressIndicator()
                          ] else ...[
                            if (!loggedIn) ...[
                              Expanded(
                                child: RawMaterialButton(
                                  onPressed: _authService.googleSignIn,
                                  padding: EdgeInsets.all(50.0),
                                  child: Text(
                                    'Clique aqui para iniciar uma conta e criar excursões',
                                    textAlign: TextAlign.center,
                                    style: TextStyle(
                                        color: Colors.white, fontSize: 24.0),
                                  ),
                                ),
                              )
                            ] else ...[
                              Expanded(
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.end,
                                  children: <Widget>[
                                    Container(
                                      color: Colors.deepPurple,
                                      child: Column(
                                        crossAxisAlignment: CrossAxisAlignment.center,
                                        children: <Widget>[
                                          Align(
                                              alignment: FractionalOffset.bottomCenter,
                                            child: FlatButton(
                                                onPressed: () {
                                                  Navigator.of(context).push(MaterialPageRoute(builder: (context) => AddTravelPage()));
                                                },
                                                color: Colors.deepPurple.shade400,
                                                highlightColor:
                                                Colors.deepPurple.shade400,
                                                splashColor: Colors.deepPurple,
                                                padding: EdgeInsets.all(20.0),
                                                child: SizedBox(
                                                    width: double.infinity,
                                                    child: Row(
                                                      mainAxisAlignment:
                                                      MainAxisAlignment
                                                          .spaceBetween,
                                                      children: <Widget>[
                                                        Text(
                                                          'Criar uma excursão',
                                                          textAlign: TextAlign.left,
                                                          style: TextStyle(
                                                              color: Colors.white,
                                                              fontSize: 16.0,
                                                              fontWeight:
                                                              FontWeight.w600),
                                                        ),
                                                        Icon(Icons.add,
                                                            color: Colors.white)
                                                      ],
                                                    ))),
                                          ),

                                        ],
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ]
                          ],
                        ],
                      )),
                  Column(
                      children: <Widget>[
                        Padding(
                          padding: EdgeInsets.all(20.0),
                          child: TextField(
                            controller: _queryFieldController,
                            focusNode: _queryFieldFocus,
                            onTap: _updateQueryFieldFocus,
                            style: TextStyle(fontSize: 20.0),
                            decoration: InputDecoration(
                                hintText: 'Para qual evento deseja ir?'),
                            textInputAction: TextInputAction.search,
                          ),
                        ),
                      ],
                  ),
                ],
              ),
            ),
          );
        });

我想让它缩小

Answer 1

你可以使用 SizedOverflowBox Widget，它的效果类似于 overflow: hidden in css。 https://api.flutter.dev/flutter/widgets/SizedOverflowBox/SizedOverflowBox.html

附注欢迎来到 stackoverflow