question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Change backdrop color with theme prop on Dialog not working

See original GitHub issue

Current behaviour

If I try to use the theme prop on a Dialog to change the color of the backdrop, nothing happens. If I do the same with a FAB.Group everything works as expected.

Expected behaviour

The backdrop color should change to the one I pass into the theme prop.

Code sample

Snack with Dialog showing it is not working: https://snack.expo.dev/@fyranollfyra/dialog---backdrop

Snack with FAB.Group showing it is working: https://snack.expo.dev/@fyranollfyra/fab-group---backdrop

In both examples I try to change the backdrop color to transparent.

What have you tried

It should just work when I pass a different color. It works for other components that use a backdrop.

Your Environment

software version
electron 19.0.7
react-native 0.67.6
react-native-paper 4.12.2
react-native-web 0.17.7
node 16.13.1
yarn 1.22.17
expo sdk 45

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
lukewalczakcommented, Jul 17, 2022

Fix released in 4.12.3.

0reactions
micahltcommented, Jul 20, 2022

Awesome, thanks!

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to target backdrop color property of Material UI Dialog ...
I'm looking to change the color of the backdrop of the Dialog component of Material UI using styled-components.
Read more >
Backdrop API - Material UI - MUI
Name Type Default open * bool false children node classes object
Read more >
Modal - Ant Design
Modal dialogs. ... The dialog will change to loading state after clicking the submit button, ... Open Modal with customized button props.
Read more >
Dialog | Quasar Framework
Do not mistake “position” prop with the show/hide animation. If you want a custom animation, you should use transition-show and transition-hide which can...
Read more >
Theming · React Native Paper
You can change the theme prop dynamically and all the components will automatically update to reflect the new theme. A theme usually contains...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found