В Flutter виджет «Контейнер» — это универсальный и часто используемый виджет, который позволяет создавать собственные элементы пользовательского интерфейса. Добавление границ к контейнеру является распространенным требованием при разработке пользовательских интерфейсов. В этой статье мы рассмотрим различные методы добавления границ к контейнеру во Flutter, а также приведем примеры кода.

Метод 1: использование класса BoxDecoration
Класс BoxDecoration позволяет украсить контейнер различными свойствами, включая границы. Вот пример добавления сплошной границы к контейнеру:

Container(
  decoration: BoxDecoration(
    border: Border.all(
      color: Colors.black,
      width: 2.0,
    ),
  ),
  child: // Your child widget here
)

Метод 2: непосредственное использование свойства border
Другой способ добавить рамку к контейнеру — напрямую использовать свойство border. Вот пример:

Container(
  border: Border.all(
    color: Colors.black,
    width: 2.0,
  ),
  child: // Your child widget here
)

Метод 3: добавление определенной стороны границы
Если вы хотите добавить границу к определенной стороне контейнера, вы можете использовать класс Borderи указать нужную сторону. Вот пример добавления границы вверху:

Container(
  decoration: BoxDecoration(
    border: Border(
      top: BorderSide(
        color: Colors.black,
        width: 2.0,
      ),
    ),
  ),
  child: // Your child widget here
)

Метод 4: использование BoxDecoration с borderRadius
Вы также можете комбинировать границы со скругленными углами, используя свойство borderRadiusкласса BoxDecoration. Вот пример:

Container(
  decoration: BoxDecoration(
    border: Border.all(
      color: Colors.black,
      width: 2.0,
    ),
    borderRadius: BorderRadius.circular(8.0),
  ),
  child: // Your child widget here
)

Метод 5: применение произвольной формы границы
Помимо прямоугольных границ, Flutter позволяет создавать собственные формы границ. Этого можно добиться с помощью класса ShapeBorder. Вот пример использования RoundedRectangleBorder:

Container(
  decoration: BoxDecoration(
    border: Border(
      top: BorderSide(
        color: Colors.black,
        width: 2.0,
      ),
      left: BorderSide(
        color: Colors.black,
        width: 2.0,
      ),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(8.0),
      ),
    ),
  ),
  child: // Your child widget here
)

В этой статье мы рассмотрели различные методы добавления границ к контейнеру во Flutter. Мы рассмотрели использование класса BoxDecoration, свойства border, указание определенных сторон границы, добавление закругленных углов и применение пользовательских форм границ. Используя эти методы, вы можете создавать визуально привлекательные элементы пользовательского интерфейса с границами в своих приложениях Flutter.