react-native : full screen background image example

render

render() {
  return (
    <ImageBackground
       style={styles.bgimg}
       source={require('./res/img/wcs.png')}>
      <View style={styles.fgcontainer}>
        <Text style={styles.qa}>
           WCS WCS WCS
        </Text>
      </View>
    </ImageBackground>
  );
}

Style

const styles = StyleSheet.create({
  bgimg: {
    flex: 1
  },
  fgcontainer: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center'
  },
  qa: {
    fontSize: 30,
    fontWeight: 'bold'
  }
});

No Image, No Truth

wcsfullscreen

No comments:

Post a Comment

@qzl/typed-i18n — Our Open-Source Typed i18n Project is Gaining Traction

 Hello everyone! 👋 We are excited to share an update about one of our open-source projects , @qzl/typed-i18n , created by the QZ-L.com team...