Работает нормально. (У)

ользую библиотеку реактив-native-router-flux v4.0 для отображения панели навигации в реактивном режиме.

Здесь я создал пользовательскую панель навигации.

Вот мой код:

 _renderLeft() {
    return (
        <TouchableOpacity
            style={{justifyContent: 'flex-start', alignItems: 'flex-start', alignSelf: 'flex-start'}}
        onPress={Actions.pop}>
            <Image
                style={{width: 24, height: 24}}
                resizeMode="contain"
                source={require('../../assets/images/ico_swipe.png')}></Image>
        </TouchableOpacity>
    )
}

_renderMiddle() {
    return (
        <View style={[styles.navBarTitleView]}>
            <Text style={[styles.navBarTitle]}>{this.props.title}</Text>
        </View>
    )
}

_renderRight() {
    return (
        <TouchableOpacity
            style={{justifyContent: 'flex-start', alignItems: 'flex-start', alignSelf: 'flex-start'}}
            onPress={Actions.pop}>
            <Image
                style={{width: 24, height: 24}}
                resizeMode="contain"
                source={require('../../assets/images/ico_home.png')}></Image>
        </TouchableOpacity>
    )
}

render() {
    StatusBar.setBarStyle('light-content', true);
    return (
        <Header style={[styles.container]}>
            <Left style={{flex: 1}}>
                {this._renderLeft()}
            </Left>
            <Body style={{flex: 3}}>
            <Title style={styles.navBarTitle}>{this.props.title}</Title>
            </Body>
            <Right style={{flex: 1}}>
                {this._renderRight()}
            </Right>
        </Header>
    )
}

Вот мой стиль:

const styles = StyleSheet.create({
container: {
    backgroundColor: AppColors.colorToolBar,
    elevation:0
},
navBarTitleView: {
    flex: 2,
},
navBarTitle: {
    fontSize: 20,
    fontFamily: AppStyles.fontFamilyMedium,
    color: AppColors.white,
    alignSelf: 'center'
},
menuItem:{
    flex: 1, flexDirection: 'row', padding: 20
},
menuTitle:{flex: 20, justifyContent: 'flex-start', alignItems: 'center',
    alignSelf: 'flex-start'},
menuNextArrow:{flex: 1}

});

Здесь я использовал это:

<Stack key="Key"  hideTabBar>
                <Scene key="Key"
                       navBar={MyCustomNavBarLocation}
                       component={myFileLocation}
                       title="Round 1"
                       onLeft={Actions.pop}
                       BackHandler={Actions.pop}
                       back
                />
            </Stack>

Я получаю это правильно в Android, как:

Но в Iphone это не подходит:

Здесь Если вы видите второе изображение, вы видели одну серую линию между панелью навигации и представлением TimeRemaining, я хочу удалить это.

Спасибо

 Anooj Krishnan G14 дек. 2017 г., 07:58
Та же проблема здесь. Я попытался shadowOpacity: 0 и высота: 0 для удаления тени. Но это не работает.

Ответы на вопрос(2)

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

<Router
      navigationBarStyle={{ ...Platform.select({
        ios: {
          //  marginTop: StatusBar.currentHeight
          elevation: 0,
          shadowOpacity: 0,
          borderBottomWidth: 0,
        }
      })
    }}
 >
 kiran malvi18 авг. 2018 г., 08:40
Работает нормально. (У)
Решение Вопроса

Проблема в компоненте заголовкаNativeBase Эта нижняя граница происходит из стиля заголовка. Таким образом, в соответствии с поднятой проблемойВотиспользовать,

<Header noShadow={true} hasTabs={true} 

для решения этой проблемы.

 Sandeep Mishra15 дек. 2017 г., 08:05
спасибо Это работает для меня

Ваш ответ на вопрос