首页 > 代码库 > [Flexbox] Use Flex to Scale Background Image

[Flexbox] Use Flex to Scale Background Image

In this lesson we will use Flexbox to scale a background image to fit on the screen of our React Native application.

 

import React, { Component } from react;import {AppRegistry, StyleSheet, Text, View, Image} from react-native;export default class general extends Component {  render() {    return (      <Image source={require("./cat.jpg")} style={styles.container}>        <Text>A good looking cat</Text>      </Image>    );  }}const styles = StyleSheet.create({  container: {    flex: 1,    width: null,    height: null,    alignItems: "center",    justifyContent: "center"  }})AppRegistry.registerComponent(general, () => general);

 

[Flexbox] Use Flex to Scale Background Image