方法
#添加自定义颜色(新定制颜色)
将新颜色添加到全局颜色对象中,该对象可通过redux在组件中访问store.config.styles.colors
. 如果使用现有颜色名称添加新颜色(例如:successColor),这将覆盖现有颜色的值。
参数:
名称 | 类型 | 描述 |
---|---|---|
新定制颜色 |
对象。 |
具有新颜色的对象 |
实例
//在自定义代码/index.js中。。。export const applyCustomCode=externalCodeSetup=>{externalCodeSetup.cssApi.addCustomColors({“courseNewColor”:“#800000”});}//下面演示了如何在custom_code/components/StyleComponent.js中使用新添加的全局样式:/。。。从“@src/styles/global”导入{globalStyle}”;const StyleComponent=(props)=>{const globalStyles=useSelector((state)=>globalStyle(state.config.styles))const{colors,global}=globalStyles;returnMargin 10 }导出默认样式组件
#addGlobalStyle(样式名称、样式、替换)
将新样式添加到全局样式对象中。注意:具有相同名称的样式将由合并Object.assign
.
参数:
名称 | 类型 | 描述 |
---|---|---|
样式名 |
一串 | 样式名称/句柄 |
风格 |
RNStyleValue | |
代替 |
布尔值 | 如果 |
实例
//在自定义代码/index.js中。。。export const applyCustomCode=externalCodeSetup=>{externalCodeSetup.cssApi.addGlobalStyle(“coursesNewStyle”,{margin:10},false);}//下面演示了如何在custom_code/components/StyleComponent.js中使用新添加的全局样式:/。。。从“@src/styles/global”导入{globalStyle}”;const StyleComponent=(props)=>{const globalStyles=useSelector((state)=>globalStyle(state.config.styles))const{colors,global}=globalStyles;returnMargin 10 }导出默认样式组件
#setFilterContentCss(filterContentCss)
设置回调函数过滤内容
这可以更改在post内容Web视图上使用的CSS。这也将为HTML Gutenberg块提供样式。注意:若Gutenberg未被使用,那个么应用程序将退回到WebView以显示内容
参数:
名称 | 类型 | 描述 |
---|---|---|
过滤内容 |
CssToCssCallback |
实例
externalCodeSetup.cssApi.setFilterContentCss((HTMLContentSS,排版)=>(`body,p{font family:${typography.bodyText.family});字体大小:100px;}`);