Виджет NavigationDestination

Виджет NavigationDestination передают в destinations у NavigationBar. Иконка - icon, подпись - label, выбранная иконка - selectedIcon.

Синтаксис

NavigationDestination(
	icon: Icon(Icons.home_outlined),
	selectedIcon: Icon(Icons.home),
	label: 'abcde',
)

Параметры

Параметр	Описание
`icon`	Иконка неактивной вкладки.
`label`	Текст под иконкой.
`selectedIcon`	Иконка активной вкладки.

Пример

Давайте соберём NavigationBar:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(child: Text('abcde')),
				bottomNavigationBar: NavigationBar(
					selectedIndex: 0,
					onDestinationSelected: (i) {},
					destinations: [
						NavigationDestination(icon: Icon(Icons.home), label: '12345'),
						NavigationDestination(icon: Icon(Icons.person), label: 'abcde'),
					],
				),
			),
		),
	);
}

Внизу две вкладки с подписями.

Пример

Давайте выберем вторую вкладку:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				bottomNavigationBar: NavigationBar(
					selectedIndex: 1,
					onDestinationSelected: (i) {},
					destinations: [
						NavigationDestination(icon: Icon(Icons.mail), label: 'abcde'),
						NavigationDestination(icon: Icon(Icons.star), label: '12345'),
					],
				),
			),
		),
	);
}

Подсвечена вкладка со звездой.

Смотрите также

виджет NavigationBar,
куда входят destinations
класс BottomNavigationBarItem,
аналог в Material 2
виджет NavigationDrawerDestination,
пункт бокового drawer
виджет Scaffold,
каркас с bottomNavigationBar