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

Методы и примеры:

1. Использование тернарного оператора.
   Тернарный оператор обеспечивает краткий способ условного отображения виджетов. Синтаксис соответствует: condition ? widget1 : widget2. Вот пример:

Widget build(BuildContext context) {
  bool isLoggedIn = true;
  return isLoggedIn ? Text('Welcome back!') : Text('Please log in');
}

2. Использование оператора if-else.
   Инструкция if-else является фундаментальной конструкцией программирования. При использовании внутри метода сборки виджета он позволяет создавать более сложные условия. Рассмотрим этот пример:

Widget build(BuildContext context) {
  bool isDataLoaded = true;
  if (isDataLoaded) {
    return Text('Data loaded successfully');
  } else {
    return CircularProgressIndicator();
  }
}

3. Реализация условного выражения.
   Условное выражение можно использовать, когда вам нужно отобразить несколько виджетов на основе одного условия. Вот пример:

Widget build(BuildContext context) {
  bool isDarkMode = true;
  return Column(
    children: [
      Text('Welcome to the app!'),
      if (isDarkMode) Text('You are in dark mode'),
    ],
  );
}

4. Использование виджета «Видимость».
   Виджет «Видимость» позволяет управлять видимостью виджета в зависимости от условия. Он принимает свойство visible, которое определяет, следует ли отображать или скрывать дочерний виджет. Рассмотрим этот пример:

Widget build(BuildContext context) {
  bool showImage = true;
  return Column(
    children: [
      Text('Some content'),
      Visibility(
        visible: showImage,
        child: Image.asset('assets/image.png'),
      ),
    ],
  );
}

5. Использование виджета LayoutBuilder.
   Виджет LayoutBuilder можно использовать для условной визуализации виджетов на основе доступных ограничений макета. В следующем примере в зависимости от доступной ширины отображается другой виджет:

Widget build(BuildContext context) {
  return LayoutBuilder(
    builder: (BuildContext context, BoxConstraints constraints) {
      if (constraints.maxWidth > 600) {
        return Text('Wide layout');
      } else {
        return Text('Narrow layout');
      }
    },
  );
}

В этой статье мы рассмотрели несколько методов реализации операторов if внутри виджетов Flutter. Используя такие методы, как тернарный оператор, операторы if-else, условные выражения, виджет «Видимость» и виджет LayoutBuilder, вы можете динамически отображать виджеты на основе различных условий. Имея в своем распоряжении эти инструменты, вы сможете создавать более интерактивные и отзывчивые приложения Flutter.