No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Curso de React Native CLI

Curso de React Native CLI

Alejandro Sanabria

Alejandro Sanabria

Creando nuestra sección de favoritos

16/22
Recursos

Aportes 5

Preguntas 2

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

Para evitar duplicar el estilo del Stack.Navigator en cada Stack, cree un componente y le proyecto los componentes que se pongan dentro de este:

export default function AppStackNavigator(props) {
  return (
    <Stack.Navigator
      screenOptions={{
        headerStyle: {
          backgroundColor: COLORS.header,
          shadowOpacity: 0,
        },
        headerTintColor: COLORS.background,
        headerBackTitleVisible: false,
      }}>
      {props.children}
    </Stack.Navigator>
  );
}

Y lo uso de la siguiente manera:

export default function FavoritesStack() {
  return (
    <AppStackNavigator>
      <Stack.Screen name="Favorites" component={FavoritesPage} />
    </AppStackNavigator>
  );
}

wow, increíble que se pueda hacer una tabbed page así de rápido!

Si les sale doble Header title pueden poner lo sgte:

Codigo de esta clase
FavoritesStack.js

import React from 'react';
import {createStackNavigator} from '@react-navigation/stack';
import FavoritesScreen from './FavoritesScreen';
import Colors from '../../res/colors';

const Stack = createStackNavigator();

const FavoritesStack = () => {
  return (
    <Stack.Navigator>
      <Stack.Screen name="Favorites" component={FavoritesScreen} />
    </Stack.Navigator>
  );
};

export default FavoritesStack;

FavoritesScreen

import React from 'react';
import {View, FlatList, StyleSheet} from 'react-native';

import FavoritesEmptyState from './FavoritesEmptyState';
import Colors from '../../res/colors';

function FavoritesScreen() {
  

  return (
    <View style={styles.container}>
      <FavoritesEmptyState />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    backgroundColor: Colors.charade,
    flex: 1,
  },
});

export default FavoritesScreen;

FavoritesEmptyState

import React from 'react';
import {View, Text, StyleSheet} from 'react-native';

const FavoritesEmptyState = () => {
  return (
    <View style={styles.container}>
      <Text style={styles.text}>Aún no tienes favoritoos</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignContent: 'center',
    justifyContent: 'center',
  },
  text: {
    color: '#fff',
    fontWeight: 'bold',
    fontSize: 18,
    alignSelf: 'center',
  },
});

export default FavoritesEmptyState;

desde la clase pasada estoy intentando ver los iconos y no me aparercen poar mas que reviso el codigo comparandolo con su git profesor no me funcionan, es decir los tabs estan bien pero las imagnes de los iconos por nada del mundo me salen