CODEWITHSUNDEEP
node.jsreact-native
Guilherme Garcia da Rosa
Guilherme Garcia da Rosa

Reputation: 1030

How to place menu icon on top-left corner using React Active?

I'm trying to make the usual drawer navigator app by having the Menu icon/button at the top-left corner of the screen, I can get it to the header/top but can't get it to the left, it always get stuck in the middle somehow, here is what it looks like:

enter image description here

Here is the render code:

render() {
        return (
            <Container>
                <Header>
                    <Left>
                        <Icon name='ios-menu' onPress={() =>
                            this.props.navigation.dispatch(DrawerActions.openDrawer())} />
                    </Left>
                </Header>
                <AppTabNavigator/>
            </Container>
        );
    }

I've tried setting some stylesheet properties to alignSelf, anything to center it but could not manage to get it correctly.

Upvotes: 0

Views: 1230

Answers (1)

Foyarash
Foyarash

Reputation: 469

I think you need to have empty Body and Right components inside the Header

Upvotes: 1

Related Questions