Remove the drop shadow from a RaisedButton in Flutter

user_2191890 0
Viewed 11035

Is there a way to completely remove the drop shadow under the RaisedButton? I've set elevation: 0 to that very RaisedButton but the drop shadow still appears when tapping it.

flutter-layout flutter
4 Answers

RaisedButton has four different elevation parameters. Just set them all to 0.

elevation: 0,
hoverElevation: 0,
focusElevation: 0,
highlightElevation: 0,
user_21918900

Since raised button is deprecated.

ElevatedButton(
                style: ElevatedButton.styleFrom(
                  elevation: 0.0,
                  shadowColor: Colors.transparent,
               
                ),),

This should be the solution. It will remove the elevation and the shadows.

user_132416510

Since the RaisedButton is deprecated and ElevatedButton should be used insted, the solution for this problem is also simple.

elevation: MaterialStateProperty.all<double>(0)
user_120856970

You can find the answer here: https://api.flutter.dev/flutter/material/ButtonStyle-class.html

You have to use:

.copyWith(elevation:ButtonStyleButton.allOrNull(0.0))


//Example

ElevatedButton(
        child: Text("Your Text"),
        onPressed: onPressed,
        style: ElevatedButton.styleFrom(
          backgroundColor: Color.fromRGBO(255, 255, 255, 1),
          foregroundColor: Colors.black54,
          shadowColor: Colors.transparent,
          elevation: 0.0,
        ).copyWith(elevation:ButtonStyleButton.allOrNull(0.0))
user_155709670
Related