React-Native歡迎屏幕混亂與背景圖像

由於某種原因，我想設置一個大背景，並將其適應移動屏幕，我的意思是寬度將是100％，高度將是動態的。React-Native歡迎屏幕混亂與背景圖像

另外我有一個更大的標誌，我想適合它的屏幕，所以我給它的寬度&高度，但它看起來切..我做錯了什麼？只是想要一個漂亮的「預加載程序」屏幕指的是在中間的一個背景和標誌..

import React, { Component } from 'react'; 
 
import { AppRegistry, StyleSheet, Text, View, Image } from 'react-native'; 
 

 
export default class Preload extends Component { 
 
    render() { 
 
    return (
 
     <View style={styles.mainBox}> 
 
      <Image source={require('../app_images/preload/bg.jpg')} style={styles.bgImage} /> 
 
      <View><Image source={require('../app_images/preload/logo.png')} style={styles.logoImage} /></View> 
 
     </View> 
 
    ); 
 
    } 
 
} 
 

 
const styles = StyleSheet.create({ 
 
    mainBox:{ 
 
     flex: 1, 
 
     alignItems:'center', 
 
     justifyContent:'center', 
 
     width: null, 
 
     height: null 
 
    },bgImage: { 
 
     position:'absolute', 
 
     top: 0, 
 
     left: 0, 
 
     alignSelf: 'stretch' 
 
    },logoImage: { 
 
     width: 100, 
 
     height: 150 
 
    } 
 
}); 
 

 
AppRegistry.registerComponent('Preload',() => Preload);

謝謝！

來源

2017-04-20 John

你嘗試改變形象的'resizeMode'財產？ 'cover'，'contain' – Cherniv

對於徽標，您應該使用contain resizeMode。

logoImage: { 
     width: 100, 
     height: 150, 
     resizeMode: 'contain' 
}

對於後臺模式，我認爲你可以使用cover並保持view它上面透明

來源

2017-04-20 21:38:37

React-Native歡迎屏幕混亂與背景圖像

回答

相關問題