颤振有界高度在容器中不起作用答案

【问题标题】：Flutter bounded height not working in container颤振有界高度在容器中不起作用
【发布时间】：2021-10-29 07:14:06
【问题描述】：

我想显示资产文件中的图标。我在通知卡上的容器上给出了一个特定的高度，想要在这个高度内变形，但图标显示的比我给定的高度大。下面我附上了我的输出和我的预期输出图片，

输出：

预期输出：

我的代码：

Container(
    height: 48,
    width: 48,
    decoration: BoxDecoration(
      color: whiteColor,
      borderRadius: BorderRadius.circular(10),
    ),
    child: Container(
        height: 24,
        width: 24,
        child: Image.asset("assets/icons/bell.png"))))

谁能告诉我问题出在哪里？我该如何解决？

【问题讨论】：

将 Image.asset 包裹在 padding 中
不要让容器成为另一个容器的孩子，而是使用堆栈。

标签： flutter flutter-layout flutter-widget

【解决方案1】：

试试下面的代码希望它对你有帮助，只需用你的图片名称替换我的图片名称，我也使用了 TextFormField

      Row(
              children: [
                Expanded(
                  child: Container(
                    padding: EdgeInsets.all(8),
                    margin: EdgeInsets.all(10),
                    height: 48,
                    width: 350,
                    decoration: BoxDecoration(
                      border: Border.all(color: Colors.grey),
                      //color: Colors.red,
                      borderRadius: BorderRadius.circular(10),
                    ),
                    child: TextFormField(
                      decoration: InputDecoration(
                        border: InputBorder.none,
                        hintText: 'What You are Lokking For',
                        prefixIcon: Icon(
                          Icons.search,
                        ),
                      ),
                    ),
                  ),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  child: Image.asset(
                    "assets/images/1.png",
                    width: 40,
                    height: 40,
                  ),
                ),
              ],
            ),

结果屏幕如

【讨论】：

【解决方案2】：

我想，原因是——这两个小部件有不同的父小部件，子小部件的大小是根据父小部件计算的。

您可以尝试将 TextField 与 PrefixIcon 和 SuffixIcon/ 一起使用并尝试一下。

这里是一些如何使用它的材料：

Youtube Video Link

最好不要自己造轮子，尽量使用带有预建选项的TextField。

【讨论】：