未大规模的底部钻头颤动

发布于 2025-01-21 18:07:34 字数 1461 浏览 0 评论 0 原文

我创建了一个简单的底部导航栏，（下面我的代码）...

bottomNavigationBar: BottomNavigationBar(
    backgroundColor: COLOR_WHITE,
    items: const [
        BottomNavigationBarItem(
        icon: Icon(Icons.account_circle_rounded),
        label: 'Profile',
        ),
        BottomNavigationBarItem(
        label: 'something', icon: Icon(Icons.star)),
   ],
)

...但是我真的想单击图标，因此我尝试为其Onpresse（）添加一个图标按钮（）方法。

bottomNavigationBar: BottomNavigationBar(
     backgroundColor: COLOR_WHITE,
     items: [
          BottomNavigationBarItem(
              icon: IconButton(
                    icon: const Icon(Icons.account_circle_rounded),
                    onPressed: () {
                      Navigator.of(context).pushReplacement(
                      MaterialPageRoute(builder: (context) => ProfileScreen(userID :widget.userID)),
                    );
                    },
                  ), 
              label: "Profile"
                ),

          BottomNavigationBarItem(
              label: 'something', icon: Icon(Icons.star)),
            ],
),

它变得很丑首位。有人可以帮我解决吗？谢谢！！

原文

I created a simple bottom navigation bar, (my code below)...

bottomNavigationBar: BottomNavigationBar(
    backgroundColor: COLOR_WHITE,
    items: const [
        BottomNavigationBarItem(
        icon: Icon(Icons.account_circle_rounded),
        label: 'Profile',
        ),
        BottomNavigationBarItem(
        label: 'something', icon: Icon(Icons.star)),
   ],
)

...but then I really wanted to click on the icons, so I tried adding an Icon Button for its onPressed() method.

bottomNavigationBar: BottomNavigationBar(
     backgroundColor: COLOR_WHITE,
     items: [
          BottomNavigationBarItem(
              icon: IconButton(
                    icon: const Icon(Icons.account_circle_rounded),
                    onPressed: () {
                      Navigator.of(context).pushReplacement(
                      MaterialPageRoute(builder: (context) => ProfileScreen(userID :widget.userID)),
                    );
                    },
                  ), 
              label: "Profile"
                ),

          BottomNavigationBarItem(
              label: 'something', icon: Icon(Icons.star)),
            ],
),

It gets all ugly, and I wanted the paddings and size all around to remain the same, but since I didn't add code to change those features, I don't get why it happened in the first place. Can someone help me solve it? Thanks!!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

苯莒 2025-01-28 18:07:34

bottomNavigationbar具有 ontap 您可以用来触发回调的方法，因此您不需要Iconbutton。 ontap 为您提供了点击项目的索引，因此您可以将其映射到适当的页面。您还可以更新 currentIndex bottomnavigatorbar 以突出显示适当的项目。

请参阅底部范围的文档，以获取一个很好的示例：

回复收藏 0 原文

千柳 2025-01-28 18:07:34

您犯的错误是在您拥有Iconbutton窗口小部件的第一个底部努力范围内，并且在第二个图标窗口小部件中……默认情况下都具有不同的样式（Flutter Developers给出了填充大小等的默认值）...因此，下面的代码可以正常工作。我也在本地实施并检查了..

BottomNavigationBar(
                backgroundColor: Colors.white,
                items: [
                  BottomNavigationBarItem(
                      icon: IconButton(
                        icon: const Icon(Icons.account_circle_rounded),
                        onPressed: () {
                          Navigator.of(context).pushReplacement(
                      MaterialPageRoute(builder: (context) => 
                      ProfileScreen(userID:widget.userID)),
                    );
                        },[enter image description here][1]
                      ),
                      label: "Profile"
                  ),
                   BottomNavigationBarItem(
                      label: 'something', icon: IconButton(
                    icon: const Icon(Icons.star),
                    onPressed: () {
                    },
                  ),),
                ],
              )

在此处输入图像描述

the mistake you have made was in the first BottomNavigationBarItem you have IconButton Widget and in second Icon widget... both having different styles by default(flutter developers gave default values for padding size etc)... so below code will work. i implemented locally and checked as well..

BottomNavigationBar(
                backgroundColor: Colors.white,
                items: [
                  BottomNavigationBarItem(
                      icon: IconButton(
                        icon: const Icon(Icons.account_circle_rounded),
                        onPressed: () {
                          Navigator.of(context).pushReplacement(
                      MaterialPageRoute(builder: (context) => 
                      ProfileScreen(userID:widget.userID)),
                    );
                        },[enter image description here][1]
                      ),
                      label: "Profile"
                  ),
                   BottomNavigationBarItem(
                      label: 'something', icon: IconButton(
                    icon: const Icon(Icons.star),
                    onPressed: () {
                    },
                  ),),
                ],
              )

enter image description here

回复收藏 0 原文

~没有更多了~