在 Flutter 中设置容器高度等于宽度

Question

我正在学习 Flutter 开发。我想连续显示一些带有短文本的圆角方形容器。但是，可能的形状是圆形或矩形。所以我决定设置矩形的宽度和高度，使它们相等。以下是我用来创建Container的代码

Container(
      width: double.maxFinite,
      height: 
      decoration: BoxDecoration(
        shape: BoxShape.rectangle,
        color: ThemeProvider.themeOf(context).data.primaryColor,
        borderRadius: BorderRadius.circular(10),
      ),
      child: Text(keyText),
    ),

当我单独在 Box 装饰中设置形状时，Container 会调整为文本的大小。当我设置 Container 的 width 属性时，我能够在容器之间划分屏幕的可用宽度，这确保了屏幕更小或更大时的尺寸灵活性，而不是硬编码。现在我想让高度与宽度完全相同，从而获得一个方形容器。知道我怎么做吗？

编辑：我尝试了以下代码，这就是容器在两种情况下的样子：

Container(
      alignment: Alignment.center,
      width: double.maxFinite,
      height: MediaQuery.of(context).size.width,
      decoration: BoxDecoration(
        shape: BoxShape.rectangle,
        color: ThemeProvider.themeOf(context).data.primaryColor,
        borderRadius: BorderRadius.circular(10),
      ),

Container(
      alignment: Alignment.center,
      width: MediaQuery.of(context).size.width,
      height: MediaQuery.of(context).size.width,
      decoration: BoxDecoration(
        shape: BoxShape.rectangle,
        color: ThemeProvider.themeOf(context).data.primaryColor,
        borderRadius: BorderRadius.circular(10),
      ),

使用 MediaQuery.of(context).size.width 作为 height 属性或两者之后

Answer 1

这是不使用 MediaQuery 的解决方案：

AspectRatio(
  aspectRatio: 1,
  child: Container(
    width: double.infinity,
    child: Text(),
  ),
)