0

Sou novo ai no React Native e estou com um problema. Tenho um APP que usa o Drawer para montar o menu. Esta funcionando ok porem tenho o seguinte problema.

Como tenho Telas que abrem de jeitos diferentes, nao consigo acesso ao Header das telas. Segue o Código.

    const AppDrawerNavigator = createDrawerNavigator({
    Home: {
        screen: Home,
        name: 'Home',
    },
    Login,
    Agenda,
    CentroCusto,
    ContaBancaria,
    Pagamento,
    PlanoConta,
    Recebimento,
    Receita,
    Transferencia
    },    {
        contentComponent: (props) => <SideBar {...props} />,
        drawerWidth: 250,
        initialRouteName: 'Home',
    });


const RootStack = createStackNavigator(
    {
        Main: {
            screen: AppDrawerNavigator,
        },
        Configuracoes,
        MeusDados,
        AlterarSenha,
        CentroCustoForm,
        ContaBancariaForm,
        PagamentoForm,
        PlanoContaForm,
        RecebimentoForm,
        ReceitaForm,
        TransferenciaForm
    },
    {
        mode: 'modal',
        headerMode: 'none',
    }
);

const FloatStack = createStackNavigator(
    {
        Main: {
            screen: RootStack,
        },
        ListaSelecao
    },
    {
        mode: 'float',
        headerMode: 'none',
    }
);
export default FloatStack

const AppContainer = createAppContainer(Navigator);
AppRegistry.registerComponent(appName, () => AppContainer);

Esse são os Navigatons mais não consigo acessar o Header pra colocar os titulos ou alterar os botoes. Só consigo fazer isso no ListaSelecao porque é o ultimo incluso.

Ja alterei a ordem, mais sempre da um problema novo.

O que devo mudar?

1 Resposta 1

0

como você definiu o headerMode para none ele não vai listar. O que você poderia fazer seria deixar em aberto e setar o header para null quando não tiver o header na tela.

Ex:

const FloatStack = createStackNavigator(
    {
        Main: {
            screen: RootStack,
        },
        ListaSelecao
    },
    {
        mode: 'float',
    }
);
export default FloatStack

Na tela que você não deseja o Header

class ClasseQueNaoTeraHeader extends Component {

  static navigationOptions = {
    header: null
  }
 ... 
}

caso seja um Stateless component

const MeuStatelessComponent = ({ navigation, dispatch }) => (
  ...
)
MeuStatelessComponent.navigationOptions = ({ navigation }) => {
  return {
    title: 'Titulo' ,
 }
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .