如何在反应导航标题下隐藏阴影?
他们看起来像这样。
如何在反应导航标题下隐藏阴影?
回答
将以下内容添加到navigationOptions标题样式中。
const AppNavigation = (
StackNavigator({
'The First Screen!': { screen: FirstScreen },
}, {
navigationOptions: {
header: {
style: {
elevation: 0, //remove shadow on Android
shadowOpacity: 0, //remove shadow on iOS
}
}
}
}
)
)
的文档不是很大,但你可以了解在React Navigation Docs navigationOptions。
这个工作对我来说:
export const AppNavigator = StackNavigator(
{
Login: { screen: LoginScreen },
Main: { screen: MainScreen },
Profile: { screen: ProfileScreen },
},
navigationOptions: {
headerStyle: {
elevation: 0,
shadowOpacity: 0,
}
}
);
或
export const AppNavigator = StackNavigator(
{
Login: { screen: LoginScreen },
Main: { screen: MainScreen },
Profile: { screen: ProfileScreen },
},
header: {
style: {
elevation: 0, //remove shadow on Android
shadowOpacity: 0, //remove shadow on iOS
}
}
);
不适用于我。 –
@GregBenner尝试添加内部组件的代码,例如'Login.navigationOptions = { headerStyle:{ 海拔:0, shadowOpacity:0, } }' – zarcode
常量stackNavigatorLoggedInConfig = { cardStyle:{则shadowColor: '透明'} , headerStyle:{height:0,padding:'0',border:'none'}, } –
尝试通过cardStyle: { shadowColor: 'transparent' }
export const AppNavigator = StackNavigator(
{
Login: { screen: LoginScreen },
Main: { screen: MainScreen },
Profile: { screen: ProfileScreen },
},
cardStyle: { shadowColor: 'transparent' }
按这个问题React Navigation Stack Navigator default shadow styling
的followi ng适合我,因为原始样式表使用"borderBottomWidth" on iOS:
const navigator = StackNavigator(screens, {
navigationOptions: {
headerStyle: {
elevation: 0,
shadowOpacity: 0,
borderBottomWidth: 0,
}
}
});
您可以试试这个,它对我很有用!
export const SignedOut = StackNavigator({
SignIn: {
screen: SignInScreen,
navigationOptions: {
title: "SignIn",
headerStyle: {
shadowOpacity: 0, // This is for ios
elevation: 0 // This is for android
}
}
}
});
这给了我错误:ExceptionsManager.js:63对象作为React子项(找到:具有keys {style}的对象)无效。如果您想渲染一组儿童,请改用数组。 在视图中(在CardStack.js:391)''' – zarcode