Замените устаревшую кнопку с повышением на кнопку с повышением

#flutter #dart #button #deprecation-warning

Вопрос:

Я использовал RaisedButton этот способ:

 RaisedButton(shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(24.0)),
                        onPressed: null,
                        padding: EdgeInsets.all(12.0),
                        color: Colors.blue,
                        child: Text("Button", style: TextStyle(color: Colors.white)))
 

Они решили сделать RaisedButton устаревшими и ElevatedButton должны использоваться вместо этого. Однако padding и shape свойства отсутствуют. Как получить тот же эффект ElevatedButton ?

Ответ №1:

Вы можете использовать style свойство в ElevatedButton , а затем вы можете использовать ElevatedButton.styleFrom , и там вы найдете такие свойства, как заполнение и форма.

Вот пример:

 ElevatedButton(
    style: ElevatedButton.styleFrom(
        primary: Colors.blue,
        elevation: 5,
        padding: const EdgeInsets.all(12.0),
        shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(30.0),
        ),
    ),
    onPressed: () {},
    child: Text(
        "Button",
        style: TextStyle(color: Colors.white),
    ),
),          
 

Ответ №2:

Попробуйте этот код, надеюсь, он вам поможет, он похож на кнопку RaisedButton

     ElevatedButton(
        onPressed: () {},
        style: ElevatedButton.styleFrom(
          fixedSize: Size(90, 15),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.all(
              Radius.circular(24.0),
            ),
          ),
        ),
        child: Text("ok"),
      ),
 

Ваш экран результатов-> введите описание изображения здесь

Ответ №3:

Давайте попробуем с этим и покажем бок о бок

 Column(
              children: [
                RaisedButton(
                    shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(24.0)),
                    onPressed: null,
                    padding: EdgeInsets.all(12.0),
                    color: Colors.blue,
                    child:
                        Text("Button", style: TextStyle(color: Colors.white))),
                SizedBox(
                  height: 10,
                ),
                ElevatedButton(
                    style: ElevatedButton.styleFrom(
                        onPrimary: Colors.blue,
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(24.0),
                        )),
                    onPressed: () {},
                    child: Container(
                      padding: const EdgeInsets.symmetric(horizontal: 12.0),
                      child:
                          Text("Button", style: TextStyle(color: Colors.white)),
                    )),
              ],
            ),
 

выход:
введите описание изображения здесь

Ответ №4:

Просто замените свой код следующим

 ElevatedButton(
style: ElevatedButton.styleFrom(
  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(24.0)),
  padding: const EdgeInsets.all(12.0),
  primary: Colors.blue,
),
onPressed: null,
child: const Text('Button', style: TextStyle(color: Colors.white))),