Флаттер - после щелчка по нижнему значку меню навигации => выбранный цвет значка и цвет текста не меняются - PullRequest
Новая
       25

Флаттер - после щелчка по нижнему значку меню навигации => выбранный цвет значка и цвет текста не меняются

0 голосов
/ 03 октября 2019

Я новичок в трепетании. Помогите мне выйти из этой проблемы,

Проблема -> После нажатия любого значка меню цвет не меняется

При запуске приложения,цвета значков установлены правильно, значок «Домой» используется по умолчанию, если я нажимаю кнопку «Сканировать» или «значок настроек», зеленый цвет не настраивается для значка и текста,

Я пробовал активную иконку BottomNavigationBarItem, которая все еще не работает

Вот мой код, 

  class TabNavigationState extends State<ScaffoldTest> {
 int currentTabIndex = 1;
 var tabs = [Home(), Camera(), Settings()];

 onTabbed(index) => {
    setState(() {
      currentTabIndex = index;
    })
  };

@override
 Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    backgroundColor: Colors.teal,
    leading: IconButton(
        icon: Icon(
          Icons.search,
          color: Colors.white,
        ),
        onPressed: null),
    centerTitle: false,
    actions: <Widget>[
      IconButton(
          icon: Icon(
            Icons.info_outline,
            color: Colors.white,
          ),
          color: Colors.white,
          onPressed: () => debugPrint("Icon tabbed")),
      IconButton(
          icon: Icon(
            Icons.save,
            color: Colors.white,
          ),
          color: Colors.white,
          onPressed: () => debugPrint("Icon tabbed")),
    ],
    title: Text(
      "Test",
      style: TextStyle(color: Colors.white),
    ),
  ),
  backgroundColor: Colors.white,
  body: tabs[currentTabIndex],
  floatingActionButton: FloatingActionButton(
    onPressed: null,
    child: IconButton(
      icon: Icon(
        Icons.camera,
        color: Colors.white,
      ),
    ),
  ),
  bottomNavigationBar: BottomNavigationBar(
    // backgroundColor: Colors.blueAccent.shade100,
    selectedItemColor: Colors.green,
    unselectedItemColor: Colors.grey,
      showSelectedLabels: true,
    items: [
      BottomNavigationBarItem(
          icon: Icon(Icons.home),
          title: Text(
            "Home",
            textDirection: TextDirection.ltr,
          )),
      BottomNavigationBarItem(
          icon: Icon(Icons.camera),
          title: Text(
            "Scan",
            textDirection: TextDirection.ltr,
          )),
      BottomNavigationBarItem(
          icon: Icon(Icons.settings),
          title: Text(
            "Settings",
            textDirection: TextDirection.ltr,
          ))
    ],
    onTap: onTabbed,
    ),
  );
}

https://i.stack.imgur.com/aGJqG.png

1 Ответ

1 голос
/ 03 октября 2019

BottomNavigationBar имеет атрибут currentIndex для определения текущей активной вкладки. Вам нужно установить его в вашем onTabbed методе, таком как 

int _selectedIndex = 0;

void onTabbed(int index) {
  setState(() {
    _selectedIndex = index;
    ...
  });
  ....
}
// And use _selectedIndex in BottomNavigationBar
Widget build(BuildContext context) {
  return Scaffold(
    ...
    bottomNavigationBar: BottomNavigationBar(
      currentIndex: _selectedIndex,
    ),
    ...
  );
}
...