对于topTab，tabBarBackgroundColor不起作用响应本机导航Wix

问题描述

限时删除！！

我在这里共享我的代码:-

I am sharing my code here:-

import { Navigation } from 'react-native-navigation';
import Icon from 'react-native-vector-icons/Ionicons';
import SimpleIcon from 'react-native-vector-icons/SimpleLineIcons';
const startTabs = ()=>{

    Promise.all([
        Icon.getImageSource("md-map",30),
        Icon.getImageSource("ios-share-alt",30),
        SimpleIcon.getImageSource("menu",30,'red'),
        SimpleIcon.getImageSource("question",30,'black')
    ]).then(sources =>{
        Navigation.startSingleScreenApp({
            screen: {
                screen: 'prabhuji.CustomPack',

                topTabs: [
                    {
                      screenId: 'prabhuji.FlowerTabOne',
                      title:'Tab 1',
                      icon: sources[1],
                    },
                    {
                      screenId: 'prabhuji.FlowerTabTwo',
                      icon: sources[0],
                      title:'Tab 2'
                    }
                ],
                navigatorButtons: {
                    leftButtons:[
                      {
                        icon:sources[2],
                        title:"Menu",
                        id:"SideDrawerToggle"
                      }
                    ],
                    rightButtons:[
                      {
                        icon:sources[3],
                        title:"Help",
                        id:"Help"
                      }
                    ]
                  },

            },
            appStyle: {
                tabBarBackgroundColor: '#0f2362',
                selectedTabFontSize: 12,
              }


        });
    });



}

export default startTabs;

推荐答案

不要将样式放在navigatorStyle中，只需将所有选项卡属性添加到appStyle，则应将BottomTabs样式添加到AppStyle.

Don't put the styles in navigatorStyle, just add all tab properties to appStyle , you should add BottomTabs styles to AppStyle.

  appStyle: {
    tabBarBackgroundColor: '#0f2362',
    tabBarButtonColor: '#ffffff',
    tabBarHideShadow: true,
    tabBarSelectedButtonColor: '#63d7cc',
    tabBarTranslucent: false,
    tabFontFamily: 'Avenir-Medium',  // existing font family name or asset file without extension which can be '.ttf' or '.otf' (searched only if '.ttf' asset not found)
    tabFontSize: 10,
    selectedTabFontSize: 12,
  },

另一种方式 1.禁用持久样式属性:

Another way 1. Disabling persistent styling properties :

  appStyle: {
    keepStyleAcrossPush: false
  }

2.动态设置样式:

this.props.navigator.setStyle({
  navBarBackgroundColor: 'blue'
});

这篇关于对于topTab，tabBarBackgroundColor不起作用响应本机导航Wix的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

1403页，肝出来的..