2017-03-10 21 views

Odpowiedz

7

Dodaj następujące elementy do stylu nagłówka navigationOptions.

const AppNavigation = (
    StackNavigator({ 
     'The First Screen!': { screen: FirstScreen }, 
    }, { 
      navigationOptions: { 
       header: { 
        style: { 
         elevation: 0,  //remove shadow on Android 
         shadowOpacity: 0, //remove shadow on iOS 
        } 
       } 
      } 
     } 
    ) 
) 

Dokumentacja nie jest wielki jeszcze, ale można dowiedzieć się o navigationOptions w React Navigation Docs.

+1

Daje mi to błąd: '' 'ExceptionsManager.js: 63 Obiekty nie są poprawne jako React child (znaleziono: object with keys {style}). Jeśli chcesz renderować kolekcję dzieci, użyj zamiast niej tablicy. w widoku (przy CardStack.js: 391) '' ' – zarcode

3

Działa to dla mnie:

export const AppNavigator = StackNavigator(
    { 
     Login: { screen: LoginScreen }, 
     Main: { screen: MainScreen }, 
     Profile: { screen: ProfileScreen }, 
    }, 
    navigationOptions: { 
     headerStyle: { 
      elevation: 0, 
      shadowOpacity: 0, 
     } 
    } 
); 

lub

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 
     } 
    } 
); 
+0

Nie działa dla mnie. –

+0

@GregBenner próby dodanie kodu wewnątrz komponentów przykład 'Login.navigationOptions = { headerStyle { wzniesienie: 0, shadowOpacity: 0, } }' – zarcode

+0

const stackNavigatorLoggedInConfig = { cardStyle {shadowColor: 'przezroczysty'} , headerStyle: {height: 0, padding: '0', border: 'none'}, } –

0

Spróbuj przejściu cardStyle: { shadowColor: 'transparent' }

export const AppNavigator = StackNavigator(
{ 
    Login: { screen: LoginScreen }, 
    Main: { screen: MainScreen }, 
    Profile: { screen: ProfileScreen }, 
}, 
cardStyle: { shadowColor: 'transparent' } 

Jak na to pytanie React Navigation Stack Navigator default shadow styling

2

followi ng działa na mnie jak oryginał arkusza stylów używa "borderBottomWidth" on iOS:

const navigator = StackNavigator(screens, { 
    navigationOptions: { 
    headerStyle: { 
     elevation: 0, 
     shadowOpacity: 0, 
     borderBottomWidth: 0, 
    } 
    } 
}); 
0

Można spróbować to i to działało na mnie!

export const SignedOut = StackNavigator({ 
    SignIn: { 
    screen: SignInScreen, 
    navigationOptions: { 
     title: "SignIn", 
     headerStyle: { 
     shadowOpacity: 0, // This is for ios 
     elevation: 0 // This is for android 
     } 
    } 
    } 
}); 
Powiązane problemy