New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Theming is not working #3847
Comments
It also looks like background is not set in dark mode, with this : const theme = createTheme({
mode: "dark",
});
function App(): JSX.Element {
return (
<ThemeProvider theme={theme}>
<Text>Test</Text>
</ThemeProvider>
);
}
export default App; The text is white, but the background is also white (version 4.0.0-rc.8, react-native: 0.72.7) |
@ratheesh-vr In order to give background colour, you need to pass background colour on buttonStyle object like this |
Hey @ratheesh-vr, does the above suggestion by @JaweedVenturedive work for you? If yes, please feel free to close the issue. |
@khushal87 I face the same question, and @JaweedVenturedive 's solution didn't work for me. Problem DescriptionIn my Same as @ratheesh-vr, I try to set Button & Dialog global style. But its not working. Tested only in android. The current situation is that:
EnvironmentReact Native: "0.73.4", (latest version currently) SettingsHere is my settings: ThemeUtils.js import {createTheme} from '@rneui/themed';
const theme = createTheme({
lightColors: {
primary: '#e7e7e8',
},
darkColors: {
primary: '#000',
},
mode: 'dark',
components: {
Button: {
titleStyle: {
color: 'red',
backgroundColor: 'black',
},
},
Dialog: {
overlayStyle: {
backgroundColor: 'blue',
},
},
},
});
export default theme; And App.tsx: import {ThemeProvider} from '@rneui/themed';
import theme from './src/utils/ThemeUtils';
// other imports
function App(): React.JSX.Element {
return (
<SafeAreaProvider>
<ThemeProvider theme={theme}>
<AppContent key={key} />
</ThemeProvider>
</SafeAreaProvider>
);
} Maybe it's a bug? |
Sorry for my mistake, theming is working. It's not a bug. By read the source from packages/themed/src/config/withTheme.tsx, I found that the style was merged in the I mistook the import: import { Button, Divider, Dialog } from '@rneui/base'; // wrong, through it can run without errors the component from '@rneui/themed' take the custom styles while the component from '@rneui/base' take the default themes |
Is there an existing issue for this?
Explain what you did
I tried to them a Button. But its not working. Tested only in ios.
@rneui/base: "^4.0.0-rc.7",
@rneui/themed: "^4.0.0-rc.8",
react": "18.2.0
react-native": "0.72.5
Expected behavior
Button should have red background and yellow title color
Describe the bug
There is no effect of theming, Button appear with default background color and text color
Steps To Reproduce
Screenshots
No response
Your Environment
`npx @rneui/envinfo`
The text was updated successfully, but these errors were encountered: