# Radio theme demo

* order: 0

主题配置

---

```js
/** @jsx createElement */
import { createElement, Component, render } from 'rax';
import View from 'nuke-view';
import Text from 'nuke-text';
import Radio from 'nuke-radio';
import Page from 'nuke-page';
import { StyleProvider } from 'nuke-theme-provider';

const theme = {
  Radio: {
    'dot-border-color': 'red',
    'dot-checked-border-color': 'red',
    'dot-bg-color-selected': 'red',
  },
};

let App = class NukeDemoIndex extends Component {
  constructor() {
    super();
  }

  render() {
    return (
      <Page title="Radio">
        <Page.Intro sub="theme inject" />
        <View style={styles.demo_item}>
          <StyleProvider style={theme}>
            <Radio size="small" type="dot" />
            <Text>浙江省</Text>
          </StyleProvider>
        </View>
      </Page>
    );
  }
};
const styles = {
  demo_item: {
    height: 104,
    marginBottom: 30,
    backgroundColor: '#ffffff',
    flexDirection: 'row',
    alignItems: 'center',
    paddingLeft: 12,
  },
  demo_result: {
    backgroundColor: '#ffffff',
    paddingLeft: 32,
    height: 60,
    justifyContent: 'center',
    color: '#666666',
  },
};
render(<App />);
```