Установить цвет активного элемента в BottomNavigationBarType.fixed

Question

У меня есть фиксированный BottomNavigationBar с 4 элементами, как описано ниже.

Как мне установить цвет выбранного элемента?

Я пробовал с: fixedColor и selectedItemColor, но это будетне работает

BottomNavigationBar(
            type: BottomNavigationBarType.fixed,
            fixedColor: Colors.blue,
            //selectedItemColor: Colors.blue,
            currentIndex: snapshot.data.index,
            onTap: _bottomNavBarBloc.pickItem,
            items: [
              BottomNavigationBarItem(
                icon: Icon(
                  Icons.access_time,
                  color: Colors.black,
                ),
              ),
              BottomNavigationBarItem(...),
              BottomNavigationBarItem(...),
              BottomNavigationBarItem(...),
            ]);

Answer 1

Вы можете предоставить другой значок для Активного и Обычного нижнего элемента навигации.

BottomNavigationBarItem _getNavigationItem(IconData icon, String title) {
    return BottomNavigationBarItem(
        backgroundColor: Colors.white,
        activeIcon: Icon(
          icon,
          color: Colors.teal,
        ),
        icon: Icon(icon, color: Colors.grey),
        title: Text(title),
    );
}

Answer 2

Доступны два типа. фиксированный или смещающийся. Если мы добавим фиксированный тип, кнопки внутри нижней навигации не будут иметь никакого эффекта, когда вы нажимаете определенную кнопку. Он просто фиксируется в нижней части навигации. Если мы добавим смещение, при нажатии определенной кнопки будет отображаться какая-то классная анимация.

Проверьте это здесь

Обходной путь, возможно, будет выглядеть примерно так:

import 'package:flutter/material.dart';

void main() {
  runApp(new MaterialApp(
    home: new MyHomePage(),
  ));
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int currentIndex = 0;

  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: Text("StackoverFlow"),
      ),
      body: Container(),
      bottomNavigationBar: BottomNavigationBar(
          type: BottomNavigationBarType.fixed,
          currentIndex: currentIndex,
          onTap: (index) {
            setState(() {
              currentIndex = index;
            });
          },
          items: [
            BottomNavigationBarItem(
              icon: Icon(
                Icons.access_time,
                color: currentIndex == 0? Colors.blue:Colors.black,
              ),
              title: Container(),
            ),
            BottomNavigationBarItem(
              icon: Icon(
                Icons.access_time,
                color: currentIndex == 1? Colors.blue:Colors.black,
              ),
              title: Container(),
            ),
          ]),
    );
  }
}