Flutter Inspector — это инструмент, встроенный в Flutter DevTools, который позволяет разработчикам анализировать и отлаживать пользовательский интерфейс. С его помощью можно:
🔴видеть иерархию виджетов
🔴проверять размеры и отступы
🔴изменять свойства виджетов в реальном времени
Что такое Select Widget Mode?
Select Widget Mode (SWM) — это режим, который позволяет вам выбирать виджеты в вашем приложении, чтобы увидеть их свойства и структуру.
Чтобы активировать этот режим:
1️⃣ Запустите ваше приложение
2️⃣ Откройте DevTools
3️⃣ Выберите вкладку Flutter Inspector
4️⃣ Нажмите на кнопку «Select Widget Mode» (в левом верхнем углу)
Как использовать SWM?
Достаточно нажать на любой виджет в приложении, чтобы увидеть его свойства, которые можно изменить. Это ускоряет процесс разработки и тестирования в реальном времени.
Пример исправления отступов:
Объявляю контейнер с паддингом 20 со всех сторон:
Container(
Text: padding: EdgeInsets.all(20.0),
child: Text('Привет, Flutter Friendly!'),
)
Мне нужно убрать вертикальный паддинг и посмотреть, как это будет выглядеть. Для этого использую SWM, выбираю контейнер и изменяю отступ в реальном времени на:
EdgeInsets.symmetric(horizontal: 20.0)
Важно: многие не знают о кнопке сброса, которая находится в левом нижнем углу приложения. Она появляется после первого нажатия на любой виджет в SWM. С ее помощью не нужно каждый раз перезапускать приложение, чтобы выбрать другой элемент на экране.
Документацию по DevTools можно посмотреть здесь