如何使 createMaterialTopTabNavigator tabBar 背景颜色为线性渐变

Question

我想使用 backgroundcolor 作为线性渐变，但是当我使用 react-native-linear-gradient 时，它没有显示为白色背景

我想将标签栏的蓝色更改为线性渐变色。

像这样：

<LinearGradient colors={['#ef7f1a','#fbb040']} start={{ x: 0, y: 0 }}
          // end={{ x: 1, y: 1 }}/>

const AppNavigationContainer = createAppContainer(

    createMaterialTopTabNavigator({
        All: {
            screen: AllData
        },
        Solar: {
            screen: Solar
        },
        Interior:{
            screen: InteriorData
        }
    },{
      tabBarOptions:{
        style:{
          // backgroundColor:<LinearGradient colors={['#ef7f1a','#fbb040']} start={{ x: 0, y: 0 }}
          // end={{ x: 1, y: 1 }}/>
        }
      }
  })
);

Answer 1

你可以试试tabBarComponent

示例

import React, {Fragment} from 'react';
import { createMaterialTopTabNavigator, MaterialTopTabBar } from "react-navigation"
...
tabBarComponent: props => return (
        <Fragment>
            <LinearGradient colors={['#ef7f1a','#fbb040']} start={{ x: 0, y: 0 }}
           end={{ x: 1, y: 1 }}/>
            <MaterialTopTabBar/>
        </Fragment>

    )