Content not visible native-base
Multi tool use
Content not visible native-base
I have simple anatomy with header, content and footer inside container, But only header is visible and nothing visible in content (with header and content only)
<Header>....</Header>
<Content><Text>Some content</Text></Content>
But, if I place all ie. header, content and footer. Then footer replaces header and only footer is visible.
Content is not at all visible in any case. native-base -v 2.3.1
2 Answers
2
You should wrap everything in a View, with a style set like so:
<View style={styles.container}>
<Header>...</Header>
<Content>
<Text>Some content</Text>
</Content>
<Footer>...</Footer>
</View>
And then in your stylesheet:
const styles = StyleSheet.create({
container: {
flex: 1, // You should only need this
height: '100%', // But these wouldn't hurt.
width: '100%'
}
})
Does it just not show up or are there errors
– Noah Allen
yesterday
no errors, just doesn't show up
– Pram
yesterday
try upgrading to latest version of native-base(current version is 2.6.1)
import React, { Component } from 'react';
import { Container, Header, Title, Content, Footer, FooterTab, Button, Left, Right, Body, Icon, Text } from 'native-base';
export default class App extends Component {
render() {
return (
<Container>
<Header>
<Left>
<Button transparent>
<Icon name='menu' />
</Button>
</Left>
<Body>
<Title>Header</Title>
</Body>
<Right />
</Header>
<Content>
<Text>
This is Content Section
</Text>
</Content>
<Footer>
<FooterTab>
<Button full>
<Text>Footer</Text>
</Button>
</FooterTab>
</Footer>
</Container>
);
}
}
i tried with latest initially, But with latest version i was not able to see any thing. So i switched to 2.3.1
– Pram
yesterday
@pram if you have not applied any styles the above code should work. Try setting 'marginTop:100' to Text. Also try adding more components to the content component.
– akhil xavier
yesterday
Nope, not working. I tried adding 'marginTop:100'
– Pram
yesterday
Content tag is not at all showing up. if i add header,content and footer, i see only footer on top
– Pram
yesterday
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
Didn't work for me
– Pram
yesterday