CODEWITHSUNDEEP
flutterdart
L3odr0id
L3odr0id

Reputation: 180

How to make the onPressed shadow transparent?

Problem

I created buttons with custom shape. When the button is pressed, the shadow appears, but I don't need it.

My solution

I set the elevation to 0 ( elevation: 0), but it didn't disable the "onPress" shadow. I set the highlightColor parameter and the shadow color, but I couldn't remove it completely. Finally, I set the shape to the shape of the child Container, but it doesn't work in all situations, I would like to know how to disable the shadow.

Example Code

I was trying to set some properties in ButtonStyle(), but without success.

ElevatedButton(
        style: ButtonStyle(),
        onPressed: () {},
        child: Image.asset(
          'assets/mypic.png',
        ),
      ),

How it looks like

enter image description here

Question

How do I remove the shadow color in the corners? Can you give me an example of the Button with transparent "onPress" shadow?

Upvotes: 3

Views: 1005

Answers (1)

L3odr0id
L3odr0id

Reputation: 180

Ok, I solved it myself. So I wrote this code:

 TextButton(
      style: ButtonStyle(
        side: MaterialStateProperty.all(BorderSide.none),
        shadowColor: MaterialStateProperty.all(Colors.transparent),
        overlayColor: MaterialStateProperty.all(Colors.transparent),
      ),
      onPressed: onPressed,
      child: Container(/* my child */)
    ),

Setting properties shadowColor and overlayColor to transparent actually solved the issue. It makes the effect of pressing button completely invisible.

So the best option is to make button the same shape as it's child, but my solution is OK when it's hard to work with child.

Upvotes: 4

Related Questions