Ответ
Виджет Icon в Flutter используется для отображения векторных иконок в пользовательском интерфейсе. В моих проектах я применяю иконки для:
1. Визуальной коммуникации действий:
FloatingActionButton(
onPressed: () {},
child: Icon(Icons.add), // Чётко обозначает действие "добавить"
)2. Навигации и указания:
AppBar(
leading: IconButton(
icon: Icon(Icons.arrow_back),
onPressed: () => Navigator.pop(context),
),
)3. Отображения статусов:
Row(
children: [
Icon(
task.isCompleted ? Icons.check_circle : Icons.radio_button_unchecked,
color: task.isCompleted ? Colors.green : Colors.grey,
),
Text(task.title),
],
)Доступные наборы иконок:
Icons— Material Design иконки (более 1800 штук)CupertinoIcons— iOS-стиль иконки- Кастомные иконки через
Icon.asset()с SVG или шрифтовыми файлами
Почему именно Icon, а не Image:
- Векторное масштабирование — иконки чётко выглядят на любом разрешении.
- Лёгкая кастомизация — можно менять цвет, размер, тень через параметры.
- Независимость от плотности пикселей — не нужны
1x,2x,3xверсии. - Меньший размер приложения — шрифтовые иконки весят меньше растровых изображений.
В последнем проекте я создал кастомный набор иконок через flutter_icons для брендинга, что позволило сохранить единый стиль во всём приложении.
Ответ 18+ 🔞
А, ну вот, опять про эти иконки! Слушай, виджет Icon в Flutter — это как универсальный солдат, ёпта. Без него интерфейс — просто текстовая простыня, скучища пиздец. Я его юзаю, чтобы пользователь с первого взгляда не охуел от меню, а сразу понял, куда тыкать.
1. Чтобы сразу было ясно, что делать: Вот смотри, кнопка «добавить». Без иконки — просто кнопка с надписью, доверия к ней ебать ноль. А с иконкой — сразу понятно, что будет.
FloatingActionButton(
onPressed: () {},
child: Icon(Icons.add), // Вот этот плюсик — он кричит: «ЖМИ СЮДА, ЧУВАК, БУДЕТ ХИРОСИМА!»
)2. Чтобы не заблудиться, как последний распиздяй: Навигация. Без стрелочки «назад» пользователь будет тыкать во всё подряд, как мартышлюшка, а потом звонить в саппорт. А так — всё интуитивно.
AppBar(
leading: IconButton(
icon: Icon(Icons.arrow_back), // Волшебная палочка, которая возвращает из кроличьей норы
onPressed: () => Navigator.pop(context),
),
)3. Чтобы статус был виден за километр: Не надо читать мелкий текст «задача завершена». Глаз сам зацепится за галочку или кружочек. Удивление пиздец, как это просто работает.
Row(
children: [
Icon(
task.isCompleted ? Icons.check_circle : Icons.radio_button_unchecked, // Зелёная галочка — красота, серая пустышка — делай, блядь!
color: task.isCompleted ? Colors.green : Colors.grey,
),
Text(task.title),
],
)А откуда эти иконки вообще берутся, спросишь?
Icons— это как огромный склад Material Design. Там всего овердохуища, больше 1800 штук. От молотка до ракеты, найдешь всё.CupertinoIcons— это для тех, кто любит яблочный стиль. Чтоб на айфоне смотрелось, будто родное.- Свои, кастомные — вот это уже высший пилотаж. Через
Icon.asset()загружаешь свой логотип или уникальную иконку. Сделал один раз — и вся твоя мартышлюшка в фирменных цветах.
И главный вопрос: а нахуй Icon, если есть Image?
А вот нахуй, слушай сюда:
- Масштабируется без потерь. Увеличил в десять раз — всё чётко, не размылось, не превратилось в пиксельное говно. Это вектор, детка.
- Поменял цвет в одну строку. Захотел синюю иконку вместо чёрной —
color: Colors.blue. С картинкой пришлось бы в фотошопе ебаться. - Не надо таскать три версии картинки для разных экранов. Никаких
icon@2x.png,icon@3x.png. Одна иконка работает везде. - Приложение легче. Шрифт с тысячей иконок весит меньше, чем пачка таких же растровых картинок. А это скорость загрузки и довольные пользователи, которые не будут материться, пока твой апп грузится.
В прошлом проекте я так и сделал — запилил через flutter_icons свой набор фирменных иконок. Теперь приложение выглядит цельно, как отлитый монолит, а не как солянка из того, что нашлось в интернете. Красота, ядрёна вошь!
