Назад к вопросам
Junior
199
questionbank
Какие существуют виды виджетов в Flutter?
Sobes Copilot
Получайте ответы в реальном времени
Ответ от нейросети
sobes.tech AI
В Flutter виджеты делятся на две основные категории:
- StatelessWidget: Виджеты, состояние которых не меняется после первоначальной сборки. Они описывают часть UI, которая не зависит от каких-либо данных в рантайме.
- StatefulWidget: Виджеты с изменяемым состоянием. Они имеют связанный объект
State, который содержит изменяемые данные и обеспечивает механизм для перестройки виджета при изменении состояния.
Кроме того, виджеты можно классифицировать по их назначению:
- Layout виджеты: Управляют расположением других виджетов на экране (например,
Row,Column,Stack). - Material Components / Cupertino виджеты: Предоставляют готовые UI элементы, соответствующие гайдлайнам Material Design (Android) или Cupertino (iOS) (например,
AppBar,Button,TextField). - Input виджеты: Позволяют пользователю взаимодействовать с приложением (например,
TextField,Checkbox,Slider). - Interactive виджеты: Реагируют на пользовательские жесты (например,
GestureDetector,InkWell). - Painting & Effects виджеты: Применяют графические эффекты (например,
Opacity,ClipRRect). - Scrolling виджеты: Обеспечивают прокрутку контента (например,
ListView,GridView).
По способу создания виджеты могут быть:
- Примитивные: Базовые строительные блоки (например,
Container,Text,Icon). - Композитные: Составлены из других виджетов.
// Пример StatefulWidget
class CounterWidget extends StatefulWidget {
@override
_CounterWidgetState createState() => _CounterWidgetState();
}
class _CounterWidgetState extends State<CounterWidget> {
int _counter = 0;
void _incrementCounter() {
setState(() {
// Изменяем состояние и инициируем перерисовку
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('Счетчик:'),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Увеличить',
child: Icon(Icons.add),
),
],
);
}
}
// Пример StatelessWidget
class TitleWidget extends StatelessWidget {
final String title;
TitleWidget({required this.title});
@override
Widget build(BuildContext context) {
return Text(
title,
style: TextStyle(fontSize: 24),
);
}
}