Изменение цвета и стиля кнопки во Flutter

Question

Я перешел на Flutter 2.0, который сейчас является новой версией. В моем проекте я использовал, но теперь он устарел во Flutter 2.0, и появляется предложение использовать вместо.

Теперь проблема в Flat Buttons есть возможность напрямую установить свойства кнопки, например color, padding etc. но когда я заменил его на Text Buttonесть ошибка в использовании этих свойств. Я проверил документацию и обнаружил, что есть свойство style: ButtonStyle(backgroundcolor: ____________). Но когда я положил Colors.blue в backgroundcolor свойство это дает мне ошибку.

Итак, я хочу знать, как работает Flutter 2.0 и как мы можем style в Buttons?

Здесь находится мой фрагмент кода, в котором я хочу стилизовать кнопку.

      Container(
                  width: 200.0,
                  child: TextButton(
                    style: ButtonStyle(), // I want to style this.
                    onPressed: () => Navigator.pushNamed(context, SignupPage.id),
                    /*color: Colors.blue,
                    padding: const EdgeInsets.all(10.0),*/ //Commented code is deprecated in Flutter 2.0
                    child: Text(
                      'Create Account',
                      style: TextStyle(color: Colors.white, fontSize: 16.0),
                    ),

Answer 1

Buttons now have a state, so you have to define the colors for each state:

• you can define one color for all the states.

  ButtonStyle(backgroundColor: MaterialStateProperty.all(Colors.green),

• you can define a different color for each state.

  ButtonStyle(backgroundColor: MaterialStateProperty.resolveWith((Set states) {if (states.contains(MaterialState.pressed))return Theme.of(context).colorScheme.primary.withOpacity(0.5);return null; // Use the component's default.}, ), ),

Answer 2

ButtonStyleне принимает простые свойства, такие как цвет, отступы и т. д. Он принимает что-то с именем as, которое, если сбивает с толку, существует удобный альтернативный метод под названием , который принимает вышеупомянутые простые параметры и преобразует их внутри вMaterialStateProperty. Вы можете использовать метод, как показано ниже:

      TextButton(
    style: TextButton.styleFrom(
      backgroundColor: const Color(0xff777777)
    ),
    onPressed: () {},
    child: Text("Change The World")
)

Обратитесь к этому, чтобы узнать больше о свойствах, принятыхstyleFormметод: https://api.flutter.dev/flutter/material/TextButton/styleFrom.html

Answer 3

В style аргумент с backgroundcolor способ сделать это, но не требует Color объект, его тип MaterialStateProperty<Color?>? поэтому вы должны предоставить объект этого типа.

документация здесь https://api.flutter.dev/flutter/material/TextButton-class.html
и здесь https://api.flutter.dev/flutter/material/ButtonStyle-class.html