代码之家 › 专栏 › 技术社区 › LaurenTsai

如何在Flatter中的BottomAppBar中的图标下方创建文本?

flutter-layout dart flutter ios android

LaurenTsai · 技术社区 · 1 年前

bottomNavigationBar: BottomAppBar(
    shape: CircularNotchedRectangle(),
    notchMargin: 4.0,
    child: new Row(
      // mainAxisSize: MainAxisSize.max,
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
        Wrap(
          direction: Axis.vertical,
            children: [
          IconButton(
              icon: Icon(
                Icons.home_outlined,
                color: Colors.grey,
              ),
              onPressed: () => screenIndex(0)),
          Text("Home")
        ]),
        IconButton(
            icon: Icon(
              Icons.history,
              color: Colors.grey,
            ),
            onPressed: () => screenIndex(1)),
        SizedBox(width: 10),
        IconButton(
            icon: Icon(
              Icons.message,
              color: Colors.grey,
            ),
            onPressed: () => screenIndex(3)),
        IconButton(
            icon: Icon(
              Icons.person_outline,
              color: Colors.grey,
            ),
            onPressed: () => screenIndex(4)),
      ],
    ),
  ),

这是它当前显示的内容:

我想把文字放在图标的正下方

2 回复 | 直到 1 年前

Jungwon 1 年前

按如下所示更改图标按钮小部件

 Wrap(
              crossAxisAlignment: WrapCrossAlignment.center,
                direction: Axis.vertical,
                children: [
                  IconButton(
                      icon: Icon(
                        Icons.home_outlined,
                        color: Colors.grey,
                      ),
                      padding: EdgeInsets.zero,
                      constraints: BoxConstraints(),
                      onPressed: () => screenIndex(0)),
                  Text("Home")
                ]),

Kaushik Chandru 1 年前

InkWell(
onTap: () => screenIndex(0),
Column(
 mainAxisSize: MainAxisSize.min,
  children:[
     Icon(Icons.home_outlined, color: Colors.grey),
     Text("Home")
  ]
 )
)

推荐文章

swastij · 如何在颤振中创建垂直线性梯度?

1 年前

Jaimin Modi · 从Flutter中的Head呼叫响应中获取特定Header值

1 年前

Andrii Havryliak · 如何仅对需要状态的数组对象求和(true)

1 年前

IshikiHIkaru · 颤振:替换“.jpg”后面的特定字符串

1 年前

Tindona · 在flatter中有没有办法将响应体转换为XML?

1 年前

swapnil mane · 当我在颤振中向下滚动时,额定值变为零

1 年前

Aneesh A · 如何在flatter/dart中删除字符串中的空格,并将每个单词的第一个字母大写

1 年前

Irfan Ganatra · 颤振:如何在导航时知道参数是否传递

1 年前

Nikita · 如果有不好的状态还有些别的东西

1 年前

Tindona · 在flatter中更新小部件之间的值

1 年前