javascript - React Native Paper 深色主题
问题描述
如何在 React Native Paper 中将主题设置为深色主题?在我所有的屏幕中,所有的<View>
's 仍然有白色背景。
const theme = {
...DarkTheme,
colors: {
...DarkTheme.colors,
primary: '#2d3436',
accent: '#1C1C1C',
background : '#636e72'
}
};
render() {
return(
<PaperProvider theme={theme}>
<App />
</PaperProvider>
);
}
解决方案
应用主题和提供者级别不会更改所有视图。导出时您必须使用“withTheme”,这将提供可用于访问颜色的主题道具。
import { withTheme } from 'react-native-paper';
const Test = ({ theme,children }) => {
const { colors } = theme;
return (
<View style={{ backgroundColor: colors.background }}>
{children}
</View>
);
};
export default withTheme(Test);
如果您想为所有视图使用相同的主题,请创建一个自定义包装器组件,该组件设置颜色,如上
推荐阅读
- mapbox-android - 如何将 Mapbox 的 Expression.get() 的结果转换为适合 fillColor() 的颜色?
- .net - 使用 '.NETFramework,Version=v4.6.1' 而不是项目目标框架'
- talend - 在 Talend 或其他工具中处理奇怪的分隔数据格式?
- postgresql - 使用主键和外键构建 ltree
- sql-server - SQL Server 功能优化(耗时过长)
- flask - 将自定义 CLI 命令移动到另一个文件
- apache - Apache mod_ssl 日志客户端证书
- html - 改变元素的高度
- python - 使用 Zip 函数在 CSV 中创建具有不同数据长度的列
- wpf - 数据库优先 ORM