Flutter 在换行小部件内垂直对齐文本

roe*_*ias 2 dart flutter

我正在编写一个颤振应用程序,该应用程序应该有一行包含图标和文本的行,但由于某种原因,我无法将文本与图标垂直放在同一行。我的意思是我想要一个图标,而不是在同一行中有一个文本,但文本比图标高一点。有人知道我该如何解决它吗?(我需要有一行,因为我想在行中放入更多的东西)。

我的代码:

              Column(
                children: [
                  Container(
                    height: size.height * .04,
                    color: NotificationColor,
                    child: Row(
                      children: [
                        Wrap(
                          spacing: size.width * .040,
                          children: [
                            const Icon(CupertinoIcons.bell),
                            Text(
                              "Notification", // this is the text that is higher then the icon
                              style: TextStyle(
                                fontSize: size.width * .035,
                              ),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ),
                  SizedBox(height: size.height * .01),
                  Container(),
                  SizedBox(height: size.height * .01),
                  Container(),
                ],
              ),
Run Code Online (Sandbox Code Playgroud)

the*_*n96 5

您是否尝试过使用 Row 的以下属性?

CrossAxisAlignment.center
Run Code Online (Sandbox Code Playgroud)

这应该垂直对齐该行的所有子项。

让我知道它是否有效!


更新

尝试下面的代码,它应该可以正常工作。

Column(
    children: [
      Container(
        height: MediaQuery.of(context).size.height * .04,
        color: Colors.red,
        child: Row(
          children: [
            Wrap(
              crossAxisAlignment: WrapCrossAlignment.center,
              spacing: MediaQuery.of(context).size.width * .040,
              children: [
                const Icon(CupertinoIcons.bell),
                Text(
                  "Notification", // now the text is vertically aligned with the icon
                  style: TextStyle(
                    fontSize: MediaQuery.of(context).size.width * .035,
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
      SizedBox(height: MediaQuery.of(context).size.height * .01),
      Container(),
      SizedBox(height: MediaQuery.of(context).size.height * .01),
      Container(),
    ],
  ),
Run Code Online (Sandbox Code Playgroud)