Cómo usar el ícono de imagen (de los activos) en lugar de IconData y la parte inferior de paginaciónNavigationBar en Flutter

Solución:

A continuación, le mostramos cómo puede utilizar un icono de los activos.

ImageIcon(
     AssetImage("images/icon_more.png"),
     color: Color(0xFF3A5A98),
),

Pruebe este ejemplo para hacer clic en BottomNavBar

Entonces, lo que desea reemplazar es BottomNavigationBarItem

 new BottomNavigationBarItem(
           icon: Icon(Icons.home),
           title: Text('Home'),
         ),

para

 new BottomNavigationBarItem(
           icon: ImageIcon(
               AssetImage("images/icon_more.png"),
                    color: Color(0xFF3A5A98),
               ),
           title: Text('Home'),
         ),

Puedes aprender sobre la navegación en el artículo que compartí.

ACTUALIZAR
Aquí hay un ejemplo que solicitó.

Entonces, aquí, la variable _children contiene la lista de páginas por las que desea navegar según la selección de BottomNavBarItem.

La forma en que navegamos es cuando presionamos un elemento de pestaña, establecemos su índice usando la función onTabTapped. Cuando el índice cambia, la vista se cambia en consecuencia, como hemos indicado al cuerpo, muestra el índice actual de los niños.

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

class _MyHomePageState extends State<MyHomePage> {
  int _currentIndex = 0;
  final List<Widget> _children = [
    Container(
      color: Colors.red,
    ),
    Container(
      color: Colors.blue,
    ),
    Container(
      color: Colors.green,
    )
  ];

  void onTabTapped(int index) {
    setState(() {
      _currentIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _children[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        onTap: onTabTapped, // new
        currentIndex: _currentIndex, // new
        items: [
          new BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('Home'),
          ),
          new BottomNavigationBarItem(
            icon: Icon(Icons.mail),
            title: Text('Messages'),
          ),
          new BottomNavigationBarItem(
              icon: Icon(Icons.person), title: Text('Profile'))
        ],
      ),
    );
  }
}

---

---

Utiliza Nuestro Buscador