Если вы разработчик Flutter, вы, должно быть, сталкивались с терминами «виджеты с сохранением состояния» и «без сохранения состояния». Эти два типа виджетов играют решающую роль в создании пользовательских интерфейсов во Flutter. В этой статье мы углубимся в понимание того, что такое виджеты с сохранением состояния и без сохранения состояния, их различия и то, как они используются при разработке приложений Flutter. Итак, начнем!
Виджеты без сохранения состояния.
Начнем с виджетов без сохранения состояния. Как следует из названия, эти виджеты не поддерживают никакого внутреннего состояния. Другими словами, они неизменны и не меняются со временем. После создания виджет без сохранения состояния остается неизменным до тех пор, пока он не будет перестроен с использованием новых данных. Виджеты без сохранения состояния обычно используются для создания компонентов пользовательского интерфейса, которые не требуют какого-либо динамического поведения или манипулирования данными.
Вот пример виджета без сохранения состояния во Flutter:
class MyButton extends StatelessWidget {
final String text;
MyButton(this.text);
@override
Widget build(BuildContext context) {
return RaisedButton(
child: Text(text),
onPressed: () {
// Perform an action
},
);
}
}
В приведенном выше примере виджет MyButtonне имеет состояния, поскольку он принимает параметр textв своем конструкторе, но не меняет свой внешний вид или поведение в зависимости от каких-либо изменений. внутреннее состояние. Кнопка всегда будет отображать один и тот же текст и выполнять одно и то же действие при нажатии.
Виджеты с отслеживанием состояния.
С другой стороны, виджеты с отслеживанием состояния являются изменяемыми и могут со временем изменять свое внутреннее состояние. Эти виджеты используются, когда пользовательский интерфейс должен динамически обновляться в зависимости от взаимодействия с пользователем, изменений данных или любых других триггеров. Виджеты с отслеживанием состояния состоят из двух частей: класса виджета с отслеживанием состояния и сопутствующего класса состояния, который содержит изменяемое состояние.
Вот пример виджета с сохранением состояния во Flutter:
class MyCounter extends StatefulWidget {
@override
_MyCounterState createState() => _MyCounterState();
}
class _MyCounterState extends State<MyCounter> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Column(
children: [
Text('Counter: $_counter'),
RaisedButton(
child: Text('Increment'),
onPressed: _incrementCounter,
),
],
);
}
}
В приведенном выше примере виджет MyCounterимеет состояние, поскольку он поддерживает внутреннюю переменную состояния _counter. При каждом нажатии кнопки вызывается функция _incrementCounter, которая обновляет переменную _counterи запускает перестройку пользовательского интерфейса с помощью метода setState(). В результате значение счетчика, отображаемое на экране, обновляется динамически.
С сохранением состояния и без сохранения состояния: когда какой использовать?
Теперь, когда мы понимаем разницу между виджетами с сохранением состояния и без сохранения состояния, давайте обсудим, когда использовать каждый из них.
Виджеты без сохранения состояния отлично подходят для компонентов пользовательского интерфейса, которые не требуют какого-либо внутреннего управления состоянием. Эти виджеты более производительны, поскольку им не нужно перестраиваться при каждом изменении. Используйте виджеты без сохранения состояния для статических элементов пользовательского интерфейса, таких как кнопки, значки, метки или любые другие компоненты пользовательского интерфейса, которые не меняют свой внешний вид на основе динамических данных.
С другой стороны, виджеты с отслеживанием состояния необходимы, когда вам нужно управлять внутренним состоянием и обновлять его. Используйте виджеты с сохранением состояния при создании форм, интерактивных элементов, таких как ползунки или флажки, а также любого компонента пользовательского интерфейса, требующего динамического манипулирования данными.
Виджеты с сохранением и без сохранения состояния являются строительными блоками разработки пользовательского интерфейса Flutter. Виджеты без сохранения состояния являются неизменяемыми и не поддерживают внутреннее состояние, тогда как виджеты с сохранением состояния являются изменяемыми и могут со временем изменять свое внутреннее состояние. Понимая различия и варианты использования этих виджетов, вы можете создавать надежные и динамичные пользовательские интерфейсы во Flutter.
Помните: используйте виджеты без сохранения состояния для статических элементов пользовательского интерфейса и виджеты с сохранением состояния для динамических компонентов пользовательского интерфейса, требующих управления состоянием. Обладая этими знаниями в своем наборе инструментов, вы будете хорошо подготовлены к разработке красивых и адаптивных приложений Flutter!