1

I am new on react native but need to fix some changes in react native app :P I am trying to change background image but don't know why its not changing.

Code

return (

 <StatusBar translucent={true} backgroundColor="transparent" /> <View> <ImageBackground style={{ height: '100%', width: '100%', resizeMode: 'cover', opacity: 1 }} source={require('./../../../public/images/order_place.png')} > <ImageBackground style={{ height: '100%', width: '100%', resizeMode: 'cover', opacity: 1 }} source={require('./../../../public/images/empty_order_place.png')} > <View style={{ justifyContent: 'center', alignItems: 'center', marginTop: 'auto', }}> <Image source={require('../../../public/icons/success.png')} // style={styles.iconStyle} /> <Text style={styles.orderPlaceText}> Order Placed </Text> <Text style={{ fontSize: 16, fontWeight: "bold", color: "white" }}> Order# {route.params.orderNumber} </Text> <Text style={styles.heading}> {route.params.brandName}, {route.params.branchLocation.Address} </Text> <Text style={styles.description}> {route.params.description} </Text> <Text style={styles.thanks}> Thank you ! </Text> </View> <View style={{ justifyContent: 'center', alignItems: 'center', marginTop: 'auto', marginBottom: 40 }}> <TouchableOpacity style={{ backgroundColor: '#ff8955', borderRadius: 8, alignItems: 'center', justifyContent: 'center', width: 300, height: 50, }} onPress={() => { navigation.dispatch( StackActions.popToTop() ); navigation.navigate('Orders'); }} > <Text style={{ color: 'white', fontSize: 14, fontWeight: 'bold', lineHeight: 23.5 }}> TRACK MY ORDER </Text> </TouchableOpacity> <TouchableOpacity onPress={() => navigation.navigate('Home')} style={{ width: 300, height: 50, borderWidth: 1.5, borderColor: 'white', borderRadius: 8, marginTop: 16, alignItems: 'center', justifyContent: 'center' }} > <Text style={{ fontSize: 15, color: 'white' }}>Back to Home</Text> </TouchableOpacity> </View> </ImageBackground> </ImageBackground> </View> </View> 

)

Try to change the path also but the Background image isn't showing not showing any error in the node. In the previous build, the image is showing but after don't know why whats the issue is not showing.

1
  • you have written ImageBackground twice. remove one of them. Commented Mar 10, 2021 at 13:16

1 Answer 1

0

try style in ImageBackground like this:-

style={{ position:"absolute",top:0,left:0, bottom:0,right:0 }} 
Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.