В мире Flutter виджеты — это строительные блоки вашего пользовательского интерфейса. Они позволяют вам создавать потрясающие интерактивные интерфейсы для ваших мобильных и веб-приложений. Одним из ключевых аспектов разработки пользовательского интерфейса является условный рендеринг, при котором вы показываете или скрываете виджет в зависимости от определенного условия. В этой статье блога мы рассмотрим различные методы условного рендеринга во Flutter, используя разговорный язык и примеры кода, которые помогут вам легко понять концепции.

1. Инструкция if-else:
   Самый простой способ условного отрисовки виджета — использование инструкции if-else. Допустим, у вас есть логическая переменная с именем showWidget. Вы можете обернуть виджет, который хотите показать или скрыть, внутри блока if-else следующим образом:

if (showWidget) {
  return MyWidget();
} else {
  return Container(); // or any other widget you want to render
}

2. Трнарный оператор.
   Трнарный оператор — это краткий способ достижения условного рендеринга. Это позволяет вам писать однострочный блок вместо блока if-else. Вот пример:

return showWidget ? MyWidget() : Container();

3. Виджет видимости:
   Flutter предоставляет встроенный виджет под названием Visibility, который можно использовать для условного рендеринга. Он принимает свойство visible, которое определяет, должен ли дочерний виджет быть видимым или нет. Вот как вы можете его использовать:

return Visibility(
  visible: showWidget,
  child: MyWidget(),
);

4. AnimatedSwitcher:
   Если вы хотите добавить анимацию при показе или скрытии виджета, вы можете использовать виджет AnimatedSwitcher. Он автоматически анимирует переход между различными виджетами. Вот пример:

return AnimatedSwitcher(
  duration: Duration(milliseconds: 500),
  child: showWidget ? MyWidget() : Container(),
);

5. StreamBuilder:
   Если условие отображения или скрытия виджета основано на каких-либо асинхронных данных, вы можете использовать виджет StreamBuilder. Он прослушивает поток и перестраивает пользовательский интерфейс всякий раз, когда поступают новые данные. Вот как вы можете его использовать:

return StreamBuilder<bool>(
  stream: myStream,
  builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
    if (snapshot.hasData && snapshot.data) {
      return MyWidget();
    } else {
      return Container();
    }
  },
);

Условный рендеринг — это жизненно важный навык в разработке Flutter, позволяющий создавать динамичные и отзывчивые пользовательские интерфейсы. В этой статье мы рассмотрели несколько методов, включая операторы if-else, тернарные операторы, виджет «Видимость», AnimatedSwitcher и StreamBuilder. Каждый метод имеет свои преимущества и варианты использования, поэтому выберите тот, который соответствует вашим конкретным потребностям. Имея в своем распоряжении эти методы, вы сможете создавать привлекательные пользовательские интерфейсы, которые легко адаптируются к меняющимся условиям.