flutter - 颤振抽屉溢出

问题描述

我正在尝试在我的 Flutter 应用程序上实现跟随抽屉显示。我在绘制抽屉外部的 X 关闭图标时遇到问题。有没有简单的方法来绘制抽屉布局之外的 X？请注意，抽屉内容本身可以有很多行（可滚动。）

到目前为止，我得出以下解决方案：

import 'package:flutter/material.dart';

class tempDrawer extends StatelessWidget {
  @override
  Widget build(BuildContext context) {

    return
      Container(
          width: 250,

          child:Drawer(child:
          SafeArea(child:Container(
            //width: 300,
              decoration: BoxDecoration(
                  gradient: LinearGradient(
                    begin: Alignment.topCenter,
                    end: FractionalOffset.bottomCenter,
                    colors: [Color(0xffa4151a), Color(0xffe34b3d)],
                    stops: [0, 1],
                  )),
              child: ListView(
                padding: EdgeInsets.zero,
                children: <Widget>[
                  Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Container(width:70,child:ClipOval(child: Image(
                          image: AssetImage("images/face.png"),
                          fit: BoxFit.cover,
                          height: 70,
                          width: 70,
                        ))),
                        Container(width: 16,),
                        Container(width: 129,child:Text("Alex assdsddff",overflow: TextOverflow.clip, style: TextStyle(color: Colors.white),)),
                        ClipOval(
                            child:Container(
                                decoration: BoxDecoration(color: Color(0xffa4151a)),
                                width: 50,
                                child:
                                Container(child: Icon(Icons.close,size: 40,color: Colors.white,)))),
                      ]),
                  Divider(color: Colors.white,indent: 20,endIndent: 20,),
                  Row(
                    children: <Widget>[
                      Icon(Icons.home_outlined,color: Colors.white,),
                      Padding(
                        padding: EdgeInsets.only(left: 8.0),
                        child: Text("HOME", style: TextStyle(color: Colors.white),),
                      )
                    ],
                  ),

                ],
              )),
          )
          ));
  }
}

这给了我我需要的结果，但我在我的图标所在的地方有一个“溢出”消息。有没有更正确的方法来放置关闭图标或至少以某种方式摆脱每个特定小部件的溢出消息？

标签： flutternavigation-drawer

试试下面的代码希望它对你有帮助。在里面添加你的容器Expanded或Flexible小部件。请参阅此处扩展和此处灵活

     Expanded(
                      child: Container(
                        width: 99,
                        child: Text(
                          "Some user name",
                          overflow: TextOverflow.clip,
                          style: TextStyle(color: Colors.white),
                        ),
                      ),
                    ),

您的结果屏幕->

flutter - 颤振抽屉溢出

问题描述

解决方案

推荐阅读