Виджет IconButton

Виджет IconButton ставят в AppBar, списки и карточки. Иконку передают в icon, нажатие - в onPressed, размер - в iconSize, подсказку - в tooltip. Варианты filled и outlined, отдельные конструкторы.

Синтаксис

IconButton(
	onPressed: () {},
	icon: Icon(Icons.favorite),
	tooltip: 'abcde',
)

Параметры

Параметр	Описание
`icon`	Виджет иконки внутри кнопки.
`onPressed`	Вызывается при нажатии.
`color`	Цвет иконки.

Методы

Метод	Описание
`filled`	Кнопка с заливкой `Material` `3`.
`outlined`	Создаёт `IconButton` с рамкой.

Пример

Давайте поставим IconButton в AppBar:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				appBar: AppBar(
					actions: [
						IconButton(
							onPressed: () {},
							icon: Icon(Icons.search),
						),
					],
				),
				body: Center(child: Text('abcde')),
			),
		),
	);
}

Справа на панели кнопка с лупой.

Пример

Давайте выведем IconButton по центру:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(
					child: IconButton(
						onPressed: () {},
						icon: Icon(Icons.star),
						color: Colors.orange,
					),
				),
			),
		),
	);
}

Оранжевая звезда реагирует на нажатие.

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

виджет ElevatedButton,
кнопка с текстом и заливкой
виджет CloseButton,
готовая иконка закрытия
виджет BackButton,
стрелка назад в AppBar
виджет Badge,
которым помечают IconButton