Виджет Icon

Виджет Icon принимает icon типа IconData, обычно из Icons. Размер задают size, цвет - color. Параметр semanticLabel нужен для доступности.

Синтаксис

Icon(
	Icons.home,
	size: 24,
	color: Colors.blue,
)

Параметры

Параметр	Описание
`icon`	Код иконки. Обязательный параметр.
`size`	Сторона квадрата символа в логических пикселях.
`color`	Цвет заливки глифа.
`semanticLabel`	Текст для озвучивания, если иконка несёт смысл.
`textDirection`	Направление письма для зеркальных иконок.

Пример

Давайте поставим иконку домой рядом с подписью:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(
					child: Row(
						mainAxisSize: MainAxisSize.min,
						children: [
							const Icon(Icons.home, size: 28, color: Colors.indigo),
							const SizedBox(width: 8),
							const Text('abcde'),
						],
					),
				),
			),
		),
	);
}

На экране слева от текста 'abcde' появится фиолетовая иконка Icons.home.

Пример

Давайте покажем две иконки разного размера:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(
					child: Row(
						mainAxisSize: MainAxisSize.min,
						children: [
							Icon(Icons.search, size: 20, color: Colors.grey),
							const SizedBox(width: 16),
							Icon(Icons.settings, size: 32, color: Colors.black),
						],
					),
				),
			),
		),
	);
}

На экране слева будет маленькая лупа, справа - крупная шестерёнка.

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

класс Icons,
который хранит готовые коды Material-иконок
класс IconData,
который описывает один символ шрифта
виджет ImageIcon,
который рисует растровую иконку
виджет FlutterLogo,
который показывает логотип Flutter