即使宽度设置为 50，容器也会占用整个宽度答案

【问题标题】：Container takes entire width even though the width is set to 50即使宽度设置为 50，容器也会占用整个宽度
【发布时间】：2021-09-26 08:41:13
【问题描述】：

我观察到一种非常奇怪的行为。我已将Container 的width 设置为50，即使它占用了整个屏幕的width。

import 'package:flutter/material.dart';

class AppDrawerNew extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 50,
      color: Colors.green,
    );
  }
}

我也尝试将Container 包装在SizedBox 中。即使这样，它也占据了整个屏幕的width。

class AppDrawerNew extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 50.0,
      child: Container(
        color: Colors.green,
      ),
    );
  }
}

我不确定我到底做错了什么。接下来我可以尝试什么？

【问题讨论】：

尝试将宽度加倍无穷
你能分享你在哪里使用AppDrawerNew ，我想用Row 换行并给Container width

标签： java android flutter dart flutter-layout

【解决方案1】：

import 'package:flutter/material.dart';

void main() {
  runApp(AppDrawerNew());
}
class AppDrawerNew extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          body: Container(
            width: 50.0,
            height: 100.0,
            color: Colors.green,
          ),
      ),
    );
  }
}

容器必须是 MaterialApp 和 Scaffold 的子容器

【讨论】：

【解决方案2】：

试一试?

Container(
      constraints: BoxConstraints(minWidth: 50, maxWidth: 50),
      color: Colors.green,
)

【讨论】：

【解决方案3】：

研究约束概念，更重要！

在文档中是最好的： https://flutter.dev/docs/development/ui/layout/constraints

【讨论】：