Disabled button with padding

[wilav-dev]

I have a form that while is sending data I set disabled and loading for button.
I don't know why, I'm getting a strange padding. I cannot reproduce is a simple example. Any idea?

[lukewalczak]

Hey @wilav-dev, the label in Button component, in MD3, by default have the following styles:

  md3Label: {
    marginVertical: 10,
    marginHorizontal: 24,
  },

You can override them using labelStyle prop.

[wilav-dev]

Thank you but actually i'm forcing to v2 theme. I had tried to replace margins and paddings but still having same issue.

[lukewalczak]

Which library version are you using?

[wilav-dev]

5.10.6

[cicerotcv]

Isn't it an issue with the elevation prop when the elevated container has a semitransparent background?

[wilav-dev]

@cicerotcv yes it is that combination. I use v2 theme.

If I remove alpha from this lines

or elevation from this lines

then it works fine. I'm not sure why elevation is 2 when button is being disabled for a moment while making a post.

Do you know the fix for this issue?

[lukewalczak]

Could you please present how the Button is used in your code in order to reproduce the issue, since I'm not able to observe the problem which you're facing?

[wilav-dev]

@lukewalczak @cicerotcv Here is an example, the bug occurs only in Android. I'm not sure, I can reproduce it sometimes, for example after editing code and tap button again.

https://snack.expo.dev/@yamifr07/react-native-paper-example_v5?platform=android

[lukewalczak]

Actually, I was not able even once to observe the issue, so maybe you can investigate the issue and suggest the solution 🤔

[cicerotcv]

https://snack.expo.dev/@yamifr07/react-native-paper-example_v5?platform=android

I was able to reproduce using this link here

[wilav-dev]

@cicerotcv Thank you for your message. I'm not able to find the fix. Any idea?

[cicerotcv]

@cicerotcv Thank you for your message. I'm not able to find the fix. Any idea?

Sorry for the late reply. I'll take a look as soon as I can. I have never experienced it myself with react-native-paper. My guess is that elevation is not being set to zero when disabled is true

[felipeemoreno]

Any resolution for this problem?