Question

我已经挣扎了两天，使用<StyleProvider>在Native Base上设置组件样式。我想更改标题的背景颜色，并在按钮上添加自定义样式属性。

<Container>
    <Header /> /*change backgroundColor*/
    <Content>
        <Button viewDetail block> /*add 'viewDetail' as custom style property */
            <Text>Button</Text>
        </Button>
    </Content>
</Container>

Answer 1

我想，我对自己的问题有答案。从'native-base-theme / components /'导入所有组件而不是变量。

代码将是这样的

<div id="scanalert" style="display:none;">
  <span class="scanclosebtn" onclick="this.parentElement.style.display='none';">&times;</span>
  <p id="scanalertmsg"> </p>
</div>
<button onclick="setTimeout(function() {scanalertfunction('scanalert'); },5000);">Ready</button>

并添加import getTheme from './native-base-theme/components';，然后添加道具样式<StyleProvider>。

Answer 2

有很多方法可以做到这一点。一种方法是遵循给定here的说明。或者，您可以更改按钮主题文件并添加类似success shown here的样式属性。

Answer 3

我希望这会对你有所帮助，您必须使用NativeBase2

<StyleProvider style={getTheme(commonColor)}>
  <Header>
    <Left>
      <Button transparent>
        <Icon name="arrow-back" onPress={() => this.props.routerActions.pop()} />
      </Button>
    </Left>
    <Body>
      <Title>Profile</Title>
    </Body>
    <Right></Right>
  </Header>
 </StyleProvider>

用于弹出主题，只需打开此链接即可 http://nativebase.io/docs/v2.0.0/customize#themingNativeBaseApp

现在如果您想自定义只需查找

native-base-theme/components/Header.js

native-base-theme/variables/commonColor.js

如何设置标题＆amp; StyleProvider在同一页面上的按钮？

3 个答案: