style right react navigationoptions left headerstyle javascript reactjs react-native react-navigation

javascript - right - react native navigation header button



Color de fondo de transiciĆ³n en React Navigation (2)

Mire en AppDelegate.m:

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation moduleName:@"Example" initialProperties:nil launchOptions:launchOptions]; rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];

¡Intenta modificar el backgroundColor en la vista de raíz! Eso puede ayudarte a lograr tu objetivo.

Al pasar de una pantalla a otra (ya sea mediante tarjeta o modo modal), hay un fondo blanco que transita su alfa de 0 o 1, durante la animación de pantalla a pantalla.

Me gustaría saber cómo cambiar el color, si es posible.

Ambiente

  • Versión de React Native Navigation: 1.0.0-beta.11
  • React versión nativa: 0.45.1
  • Plataforma: iOS y Android
  • Dispositivo: iOS 10.3, iPhone 6

Algún código que uso para crear StackNavigation

Nota: El color de fondo modal se resolvió mediante la respuesta de @Jason Gaare https://stackoverflow.com/a/45065542/976655 , el problema ahora persiste en StackNavigation

let navOptions = { headerMode: ''screen'', navigationOptions: ({navigation}) => ({ headerTintColor: ''#fff'', headerStyle: { backgroundColor: ''#1A1A1A'', }, headerTitleStyle: { color: ''#fff'', fontFamily: ''my-font'' }, headerLeft: (<ImageBtn buttonStyle={{ .. }} buttonHighlightStyle={{}} source={ myImage } imageStyle={{ ... }} callback={navigation.goBack.bind(this, null)} />) }) }; const MyTab = StackNavigator({ MyScreen1: {screen: MyScreen1}, MyScreen2: {screen: MyScreen2}, MyScreen3: {screen: MyScreen3}, MyScreen4: {screen: MyScreen4}, }, navOptions);


El problema al que se refiere ( # 563 ) se cerró en abril de 2015 al actualizar el color de transición predeterminado de #555555 a transparente. Se puede aplicar un color de transición configurando un estilo de fondo en el navegador de la siguiente manera:

<Navigator style={{flex: 1}} // style for the navigator container transitionerStyle={{backgroundColor: ''black''}} // style applied to the scenes container ...

Es insospechable que no estuvieras al tanto de esta corrección; Alguien (''alvaromb'') comentó el problema resuelto más de un año después, en mayo de 2016, comentando "¿No debería documentarse esto?" así que evidentemente los usuarios no están conscientes de esto.

Aparentemente, se corrigió un problema de color de fondo similar (y otros problemas) en la versión 4 de react-native-router-flux (lanzado el 8 de julio de 2017), presumiblemente mediante la misma actualización de código similar.