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

1. Использование ElevatedButton и BorderRadius:
   Виджет ElevatedButton во Flutter предоставляет простой способ создания кнопки с выпуклым внешним видом. Чтобы сделать его округленным, вы можете использовать свойство BorderRadius. Вот пример:

ElevatedButton(
  onPressed: () {
    // Add your button press logic here
  },
  style: ElevatedButton.styleFrom(
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(10.0),
    ),
  ),
  child: Text('Rounded ElevatedButton'),
)

1. Настройка цветов кнопок.
   Вы можете улучшить внешний вид закругленной приподнятой кнопки, настроив ее цвета. Свойство styleпозволяет вам определить цвет фона, цвет текста и другие визуальные аспекты. Вот пример:

ElevatedButton(
  onPressed: () {
    // Add your button press logic here
  },
  style: ElevatedButton.styleFrom(
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(10.0),
    ),
    primary: Colors.blue, // Background color
    onPrimary: Colors.white, // Text color
  ),
  child: Text('Customized Rounded Button'),
)

1. Добавление значков кнопок.
   Вы можете включить значки в закругленную приподнятую кнопку, чтобы обеспечить дополнительные визуальные подсказки. Для этой цели можно использовать виджет Flutter IconButton. Вот пример:

ElevatedButton.icon(
  onPressed: () {
    // Add your button press logic here
  },
  style: ElevatedButton.styleFrom(
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(10.0),
    ),
  ),
  icon: Icon(Icons.add), // Icon
  label: Text('Button with Icon'), // Text
)

1. Анимация кнопки.
   Flutter предоставляет различные варианты анимации, которые сделают ваш пользовательский интерфейс более привлекательным. Вы можете применить анимацию к закругленной приподнятой кнопке с помощью виджета AnimatedContainerFlutter. Вот пример:

AnimatedContainer(
  duration: Duration(milliseconds: 300),
  curve: Curves.easeInOut,
  decoration: BoxDecoration(
    borderRadius: BorderRadius.circular(10.0),
    color: _isButtonPressed ? Colors.blue : Colors.red,
  ),
  child: ElevatedButton(
    onPressed: () {
      setState(() {
        _isButtonPressed = !_isButtonPressed;
      });
    },
    child: Text('Animated Button'),
  ),
)

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

Не забывайте экспериментировать и комбинировать эти методы для достижения желаемых визуальных эффектов. Flutter предлагает огромную гибкость в настройке кнопок, позволяя создавать уникальные и привлекательные пользовательские интерфейсы.