react native 修改安卓Switch颜色样式

来源：互联网发布：乎字的意义和用法编辑：程序博客网时间：2024/05/29 15:07

最近在使用Switch控件的时候。官方文档是这样的

<Switch          value={(this.state && this.state.switchValue) || false}          onValueChange={(value) => {            this.setState({switchValue: value})          }}          // Color props are iOS-only          // thumbTintColor={'white'} // Removes shadow        />

重要的是其中的 Color props are iOS-only.. 就这尴尬了。

费了几分钟看了源码，发现Switch是封装的原生组件，安卓里对应的是SwitchCompat控件。所以，要修改颜色，最简单的就是添加Theme.

首先添加style

    <style name="Color1SwitchStyle">        <item name="colorControlActivated">@color/white</item>        <!-- Inactive thumb color switch关闭时的拇指按钮的颜色 -->        <item name="colorSwitchThumbNormal">@color/tink_color</item>        <!-- Inactive track color(30% transparency) switch关闭时的轨迹的颜色  30%这个颜色 -->        <item name="android:colorForeground">@color/tink_color</item>    </style>

然后在setContentView之前setTheme就ok了。

   setTheme(R.style.Color1SwitchStyle);   setContentView(R.layout.activity_apps_detail_for_react);

这里我是将ReactRootView直接添加到activity_apps_detail_for_react这个布局中的。

然后It work!

2 0