Skip to content

Instantly share code, notes, and snippets.

@328
Created March 28, 2018 06:07
Show Gist options
  • Save 328/d7c505191531b14fbdca3b46f302f6e1 to your computer and use it in GitHub Desktop.
Save 328/d7c505191531b14fbdca3b46f302f6e1 to your computer and use it in GitHub Desktop.
react nativeでwindow sizeを取得して画面いっぱいまで画像を拡大表示する
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
var Dimensions = require('Dimensions');
var { width, height, scale } = Dimensions.get('window'); //get window size
import React, { Component } from 'react';
import {
Platform,
StyleSheet,
Text,
View,
ImageBackground
} from 'react-native';
type Props = {};
export default class App extends Component<Props> {
render() {
return (
<View>
<ImageBackground style={{width: width, height: height}} source={require('./images/wallpaper.jpg')}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
</ImageBackground>
</View>
);
}
}
const styles = StyleSheet.create({
welcome: {
fontSize: 20,
textAlign: 'center',
color: '#FFFFFF',
margin: 10,
},
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment