flutter - 如何根据 flutter 中的文本高度调整容器高度?

标签 flutter dart

我正在构建一个 flutter 应用程序,我试图在其中添加一个容器及其子文本。 我希望容器的高度与文本要求的一样高。但它取而代之的是指定的高度。

以下是我的代码:

class ChangePassword extends StatefulWidget {
    @override
  _ChangePasswordState createState() =>
      _ChangePasswordState();
}

class _ChangePasswordState extends State<ChangePassword> {
final GlobalKey<ScaffoldState> _scaffoldkey = new GlobalKey<ScaffoldState>();
@override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
        key: _scaffoldkey,
        drawer: Drawer(
          child: ListView(
            // Important: Remove any padding from the ListView.
            padding: EdgeInsets.zero,
            children: <Widget>[
              Container(
                height: (MediaQuery.of(context).size.height * 0.23),
                child: DrawerHeader(
                  child: Container(
                      padding:
                          EdgeInsets.symmetric(horizontal: 10, vertical: 10),
                      child: Row(
                        children: [
                          Container(
                            height: MediaQuery.of(context).size.width * 0.1,
                            width: MediaQuery.of(context).size.width * 0.1,
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(30),
                              color: Theme.of(context).primaryColor,
                              image: DecorationImage(
                                  fit: BoxFit.fill,
                                  image: NetworkImage(imageurl)),
                              boxShadow: [
                                BoxShadow(
                                  blurRadius: 25,
                                  color: Colors.black.withOpacity(0.2),
                                  offset: Offset(0, 10),
                                )
                              ],
                            ),
                          ),
                          Container(
                            height: MediaQuery.of(context).size.width * 0.15,
                            width: MediaQuery.of(context).size.width * 0.5,
                            padding: EdgeInsets.symmetric(horizontal: 10),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Text(
                                  name,
                                  style: TextStyle(
                                      fontSize: 15,
                                      color: Colors.lightBlue[900],
                                      fontWeight: FontWeight.bold),
                                ),
                                Text(email),
                                SizedBox(
                                  height: 2,
                                ),
                                Row(
                                  children: [
                                    Icon(
                                      Icons.remove_red_eye_outlined,
                                      size: 12,
                                    ),
                                    Text(
                                      'View Profile',
                                      style: TextStyle(
                                        fontSize: 12,
                                      ),
                                    )
                                  ],
                                )
                              ],
                            ),
                          ),
                        ],
                      )),
                  decoration: BoxDecoration(
                    color: Colors.white,
                  ),
                ),
              ),
                          ],
          ),
        ),
        body: SingleChildScrollView(
          scrollDirection: Axis.vertical,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Container(
                height: MediaQuery.of(context).size.height * 0.35,
                child: Stack(children: [
                  Positioned(
                    height: MediaQuery.of(context).size.height * 0.23,
                    top: 0,
                    child: Padding(
                      padding: EdgeInsets.only(top: 50),
                      child: Container(
                        color: Color(0xff002060),
                        width: MediaQuery.of(context).size.width,
                        height: MediaQuery.of(context).size.height * 0.1,
                        child: Align(
                          alignment: Alignment.topCenter,
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.start,
                            children: [
                              GestureDetector(
                                onTap: () {
                                  _scaffoldkey.currentState.openDrawer();
                                },
                                child: new Container(
                                  child: Icon(
                                    Icons.menu,
                                    color: Colors.white,
                                    size: MediaQuery.of(context).size.height *
                                        0.04,
                                  ),
                                  padding: new EdgeInsets.all(7.0),
                                ),
                              ),
                              SizedBox(
                                width: MediaQuery.of(context).size.width * 0.3,
                              ),
                              Container(
                                height:
                                    MediaQuery.of(context).size.height * 0.07,
                                child: Center(
                                  child: Text(
                                'Profile',
                                style: TextStyle(
                                  color: Colors.white,
                                ),
                              ),
                                ),
                              ),
                              SizedBox(
                                width: MediaQuery.of(context).size.width * 0.3,
                              ),
                              Icon(
                                Icons.search,
                                color: Colors.white,
                                size: MediaQuery.of(context).size.height * 0.04,
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ),
                  Positioned(
                    top: MediaQuery.of(context).size.height * 0.16,
                    left: MediaQuery.of(context).size.width * 0.03,
                    child: Row(
                      children: [
                        Container(
                          width: MediaQuery.of(context).size.height * 0.14,
                          height: MediaQuery.of(context).size.height * 0.14,
                          decoration: ShapeDecoration(
                              shape: CircleBorder(), color: Colors.white),
                          child: Padding(
                            padding: EdgeInsets.all(8.0),
                            child: DecoratedBox(
                              decoration: ShapeDecoration(
                                  shape: CircleBorder(),
                                  image: DecorationImage(
                                      fit: BoxFit.cover,
                                      image: NetworkImage(
                                        'https://thumbor.forbes.com/thumbor/fit-in/416x416/filters%3Aformat%28jpg%29/https%3A%2F%2Fspecials-images.forbesimg.com%2Fimageserve%2F5f4ebe0c87612dab4f12a597%2F0x0.jpg%3Fbackground%3D000000%26cropX1%3D292%26cropX2%3D3684%26cropY1%3D592%26cropY2%3D3987',
                                      ))),
                            ),
                          ),
                        ),
                        SizedBox(
                          width: MediaQuery.of(context).size.width * 0.05,
                        ),
                        Column(
                          children: [
                            Container(
                              height: MediaQuery.of(context).size.height * 0.08,
                              child: Text(
                                'Bill Gates',
                                style: TextStyle(
                                    fontSize: 25,
                                    color: Colors.white,
                                    fontWeight: FontWeight.bold,
                                    fontFamily: 'Calibri'),
                              ),
                            ),
                          ],
                        )
                      ],
                    ),
                  ),
                  Positioned(
                    top: MediaQuery.of(context).size.height * 0.24,
                    left: MediaQuery.of(context).size.height * 0.165,
                    child: FittedBox(
                      fit: BoxFit.fill,
                      child: Container(
                        height: MediaQuery.of(context).size.height * 0.09,
                        width: MediaQuery.of(context).size.width * 0.6,
                        child: Text(
                          'Bill Gates welcomes you. Welcome to Microsoft. It gives me immense pleasure to announce Josh Hazlewood as it\'s new CEO. It is always immense pleasure to work with them. looking foward to have a great time with him.',
                          style: TextStyle(
                              color: Colors.black, fontFamily: 'Calibri'),
                        ),
                      ),
                    ),
                  ),
                ]),
              ),
                ],
              )),
              
            ],
          ),
        ));

}

图片如下:

enter image description here

我希望根据此处输入的信息包装包含“Bill Gates”下方文本的容器。

整个容器应该减少,因为我计划在这个自定义应用栏下方添加小部件,那么有什么办法可以实现吗?

我尝试使用 flexible 但它没有用。有人可以帮我解决这个问题吗?

最佳答案

使用适合的盒子:-

FittedBox(
   fit:BoxFit.fitHeight,
   child:Text("Your text"),
),

关于flutter - 如何根据 flutter 中的文本高度调整容器高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66437238/

相关文章:

Firebase 检查 Flutter 中的项目是否不在数组中

swift - flutter 将 Objective C 项目迁移到 Swift 项目。使用swift插件时出错

flutter - 如何从实例内部引用类的实例

json - 我的 RCP 客户端未返回对象的深拷贝

firebase - 脱机尝试后,Firestore访问中断

dart - AssetImage 和 Image.asset 有什么区别 - Flutter

timer - 如何将 onTab 信号从嵌套的有状态小部件发送到 main.dart

Flutter - 在 dispose() 之后调用 setState

dart - 在 Flutter 中获取选中的 DropdownMenuItem 的值

dart - 空状态页面和导航器问题?