0.0.36 • Published 6 years ago

rox-theme-provider v0.0.36

Weekly downloads
94
License
-
Repository
-
Last release
6 years ago

subtitle: 主题控制器

group: Other

Theme Provider


何时使用

需要全局换肤的时候,可以通过简单修改主题变量,达到换肤的目的。

API

StyleProvider

属性说明类型默认值
style需要替换的主题变量集合obj
androidConfigs安卓 md 相关配置,如{materialDesign:false,rippleEnabled:false}obj
  • style

    style 注入提供了主题换肤能力,使用 style 注入变量后,可以直接替换全局的颜色、大小配置。

    使用 demo:

    import { StyleProvider } from 'nuke-theme-provider';
    
    let orange = {
        Core:{
            [`color-brand1-1`]: '#FFF0E6', // [主品牌色-浅]
            [`color-brand1-6`]: '#FF6A00', // [主品牌色-常规]
            [`color-brand1-9`]: '#E35300'  // [主品牌色-深]
        },
    
    };
    <StyleProvider style={orange}>
         <Button type="primary" style={styles.btn}>主操作</Button>
    </StyleProvider>
  • androidConfigs

    androidConfigs 是为安卓定制,主要用于 MD 开关的开启、关闭。当前开放的 api 为:

    {
        materialDesign:true, // 是否启用 materialDesign 效果
        rippleEnabled:true // 是否开启水波纹特效
    }

    使用 demo:

    import { StyleProvider } from 'nuke-theme-provider';
    
    <StyleProvider androidConfigs={{materialDesign:true,rippleEnabled:true}}>
         <Button type="primary" style={styles.btn}>主操作</Button>
    </StyleProvider>

附常用基础变量

'color-brand1-1' :'#E4F0FD', // [主品牌色-浅]

'color-brand1-6': '#3089DC', // [主品牌色-常规]

'color-Brand1-9' :'#1170BC', // [主品牌色-深]

'color-line1-2' :'#DCDEE3', // [线条-常规]

'color-line1-3' :'#C4C6CF', // [线条-深]

'color-text1-2' :'#999999', // [文字-浅]

'color-text1-3' :'#666666', // [文字-常规]
0.0.36

6 years ago

0.0.35

6 years ago

0.0.39

6 years ago

0.0.34

6 years ago

0.0.33

6 years ago

0.0.32

6 years ago

0.0.31

6 years ago

0.0.30

6 years ago

0.0.29

6 years ago

0.0.28

6 years ago

0.0.27

6 years ago

0.0.26

6 years ago

0.0.25

6 years ago

0.0.22

6 years ago

0.0.21

6 years ago

0.0.20

6 years ago

0.0.19

6 years ago

0.0.18

6 years ago

0.0.17

6 years ago

0.0.16

6 years ago

0.0.15

6 years ago

0.0.14

6 years ago

0.0.2

6 years ago