颤动扩展时如何在屏幕视图中保留扩展的小部件

时间:2020-10-16 19:38:46

标签: flutter dart flutter-layout

我试图重新创建材料包的expandationPanel小部件动画,但是当用户单击“项目”以将扩展的小部件保持在屏幕视图中时,我试图将其向上推。 有人可以伸出援手吗? 在扩展小部件时,我也无法解决溢出错误。

enter image description here

这是这样做的代码

class _MoneyTransactionModelListItemState extends State<MoneyTransactionModelListItem> {
  double _bodyHeight=60.0;
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
            onTap: () {
              setState((){
                this._bodyHeight = this._bodyHeight == 60.0 ?300.0: 60.0;
              });
            },
            child: new Container(
              child: new AnimatedContainer(
                child: AnimatedPadding(
                  curve: Curves.easeInOut,
                        duration: const Duration(milliseconds: 500),
                        padding: this._bodyHeight == 60.0 ? const EdgeInsets.all(0.0) :
                          const EdgeInsets.symmetric( vertical: 18.0) ,
                    child: Container(
                      color: this._bodyHeight == 60.0 ? Colors.white :
                          Colors.grey[100],
                      child: Column(
                      children: [
                        Container(
                          child: new Row(
                              // mainAxisAlignment: MainAxisAlignment.end,
                              // crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[   
                              Icon(
                                Icons.stop_circle_rounded,
                                size: 10.0,
                                color: Colors.black,
                              ),
                              Flexible(
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                          Container(
                                              // color: Colors.green,
                                              padding: const EdgeInsets.symmetric(
                                                  horizontal: 7.0, vertical: 10.0),
                                              child: Column(children: <Widget>[
                                                Row(
                                                  mainAxisAlignment: MainAxisAlignment.end,
                                                  children: <Widget>[
                                                    Padding(
                                                      padding: EdgeInsets.only(right: 7.0),
                                                      child: Text(
                                                        "Title",
                                                        style: TextStyle(
                                                            fontSize: 16.0,
                                                            fontWeight: FontWeight.w600,
                                                            color: Colors.black),
                                                        textAlign: TextAlign.right,
                                                      ),
                                                    ),
                                                  ],
                                                ),
                                                Row(
                                                  mainAxisAlignment: MainAxisAlignment.start,
                                                  children: <Widget>[
                                                    Text('date',
                                                      style: TextStyle(
                                                          fontSize: 14.0,
                                                          fontWeight: FontWeight.w400,
                                                          color: Color(0xFFD9D9D9)),
                                                      textAlign: TextAlign.right,
                                                    ),
                                                  ],
                                                ),
                                              ]),
                                          ),
                                          
                                  ],
                                ),
                              ),
                              
                                          
                            ],
                        ),
                          ),
                        _bodyHeight == 60.0 ? Container() : AnimatedContainer(
                          curve: Curves.easeInOut,
                          duration: const Duration(milliseconds: 700),
                          height: 200.0,
                          // color: Colors.grey,
                        )
                      ],
                  ),
                    ),
                ),
                    curve: Curves.easeInOut,
                    duration: const Duration(milliseconds: 500),
                    height: _bodyHeight,
              // color: Colors.red,
              ),
            ),
          );
  }
}

0 个答案:

没有答案