React Native createBottomTabNavigator Добавить настроенный цвет из констант - PullRequest
Новая
       21

React Native createBottomTabNavigator Добавить настроенный цвет из констант

0 голосов
/ 31 августа 2018

Я работаю над реализацией createBottomTabNavigator . Я добавил tabBarIcon и хотел бы использовать глобальный цвет, который я определил в const в файле глобальных стилей, как показано ниже:

global.style.js 

import { StyleSheet } from "react-native";

export const Colors = {
 ...
  orange: "#F59200",
 ...
};

Router.js 

import React, { Component } from "react";
...

import { StackNavigator } from "react-navigation";
import { createBottomTabNavigator, BottomTabBar } from "react-navigation-tabs";
import Icon from "react-native-vector-icons/FontAwesome";
import Colors from "MyApp/app/config/global.style";
...
import HomeScreen from "../screens/HomeScreen";
...

export const Tabs = createBottomTabNavigator({
  HomeScreen: {
    screen: HomeScreen,
    navigationOptions: () => ({
      tabBarLabel: "My Home Screen",
      tabBarIcon: ({ tintColor }) => (
        // color={Colors.orange} does not work here 
        <Icon name="rocket" color={Colors.orange} size={24} />
      )
    })
  },
...

Я нашел несколько примеров, которые показывают, как добавить цвет напрямую, что работает: 

HomeScreen: {
        screen: HomeScreen,
        navigationOptions: () => ({
          tabBarLabel: "My Home Screen",
          tabBarIcon: ({ tintColor }) => (
            <Icon name="rocket" color="#F59200" size={24} />
          )
        })
      }

Но я хотел бы знать, есть ли способ передать значение const Colors .

Есть идеи?

Заранее спасибо!

1 Ответ

0 голосов
/ 20 апреля 2019

Попробуйте добавить к навигации или выполните реагировать на навигацию 

tabBarOptions: {
  activeTintColor: 'green',
  inactiveTintColor: 'white',
  inactiveBackgroundColor:'green'
},
...