首页 > 解决方案 > 如何在 react-navigation-material-bottom-tabs 中添加标签栏的阴影?

问题描述

我在 react-native 中使用 react-navigation 和 react-navigation-material-bottom-tabs 来创建底部标签栏。我正在尝试为底部标签栏添加阴影效果。

我生成阴影的代码是:

    const screen1 = createMaterialBottomTabNavigator(
        {
            Home: HomeScreen,
            About: AboutScreen,
            Scan: ScanScreen,
            Fav: AllScreen
        },
        {
            initialRouteName: "Home",
            activeColor: 'red',
            inactiveColor: 'blue',

            barStyle: {
                borderWidth: 0.5,
                borderBottomWidth: 1,
                backgroundColor: 'white',
                borderBottomLeftRadius: 0,
                borderBottomRightRadius: 0,
                borderTopLeftRadius: 15,
                borderTopRightRadius: 15,
                borderTopColor: '#000',
                borderBottomColor: '#000',
                borderLeftColor: '#000',
                borderRightColor: '#000',
                shadowColor: "#000000",
                shadowOpacity: 1,
                shadowRadius: 30,
                shadowOffset: {
                    height: 10,
                    width: 10
                },
                elevation: 5
            },
        }
    );

但是IOS和Android都没有显示阴影效果。

标签: androidiosreact-nativereact-navigation

解决方案


推荐阅读