我正在尝试为客户创建购物应用,并且我想将滚动属性添加到应用的购物车页面,因此我使用了
`scrollview`
属性,我立即添加了scrollview
并重新加载了所有分散的应用程序。
这里是没有scrollveiw
的原始页面
这是带有scrollview
的页面
我经过研究后通过将contentContainerStyle={{flex:1}}
添加到scrollview
来解决此问题,此后我在页面上添加了更多内容,但没有滚动,我不知道为什么,也许我可能正在做某事错误的是此页的代码
<ScrollView contentContainerStyle={{flex:1}}>
<View style={styles.page}>
<Cartheader gotocart={gotocart} gotohome={gotohome} />
<View style={{justifyContent:'space-between', alignItems:'center'}}>
<View style = {styles.up}>
<TouchableOpacity style={styles.back} onPress={gtoback}>
<Image style={styles.arrowb} source={require('../resources/arrowback.png')} />
</TouchableOpacity>
<View style={styles.overall}>
<View style = {styles.title}><Text style={{fontSize:RFPercentage(5),fontWeight:'bold',marginLeft: '4%',}}>Cart</Text></View>
<View style = {styles.cartitems}>
<View style ={styles.details}>
<View style={styles.details1}><Text style={{fontWeight:'bold',fontSize:RFPercentage(1.8)}}>Item</Text></View>
<View style={styles.details2}><Text style={{fontWeight:'bold',fontSize:RFPercentage(1.8)}}>Quantity</Text></View>
<View style={styles.details3}><Text style={{fontWeight:'bold',fontSize:RFPercentage(1.8)}}>Item Total</Text></View>
<View style={styles.details4}><Text style={{fontWeight:'bold',fontSize:RFPercentage(1.8)}}>Remove</Text></View>
</View>
<View style ={styles.real}>
<View style={styles.real1}>
<Image style={styles.dem} source={require('../resources/comfortable-seats-in-empty-corporate-meeting-office-for-presentation-JCC1N0.jpg')} />
<View style={styles.descrip}>
<View><Text style={{fontWeight:'bold',fontSize:RFPercentage(2.5)}}>A/c Chairs</Text></View>
<View><Text style={{fontSize:RFPercentage(1.25), color:'#40b9e9'}}>N 400.00 NGN</Text></View>
</View>
</View>
<View style={styles.real2}>
<View style={{width:'50%',height:'60%',justifyContent:'space-around',alignItems:'center'}}><Text style = {{fontSize:RFPercentage(2.5)}}>2</Text></View>
<View style={{width:'50%',height:'60%',justifyContent:'space-between'}}>
<TouchableOpacity>
<Image style={styles.arrowc} source={require('../resources/arrowback.png')} />
</TouchableOpacity>
<TouchableOpacity >
<Image style={styles.arrowd} source={require('../resources/arrowback.png')} />
</TouchableOpacity>
</View>
</View>
<View style={styles.real3}><Text style={{color:'#40b9e9',fontSize:RFPercentage(1.5)}}>N 800.00 NGN</Text></View>
<View style={styles.real4}>
<TouchableOpacity style={styles.x}>
<Text style={{color:'#fff',fontSize:RFPercentage(2.5),marginTop:-2}}>x</Text>
</TouchableOpacity>
</View>
</View>
</View>
{/* ///////////////////////////////////// */}
<View style={styles.payment}>
<View style={{justifyContent:'space-around',height:'100%',width:'57%'}}>
<View style={styles.pay}><Image style={styles.radio} source={require('../resources/radio.png')} />
<Text style={{marginLeft:5,fontWeight:'bold',fontSize:RFPercentage(1.8)}}>Pay On Delivery</Text></View>
<View style={styles.pay}><Image style={styles.radio} source={require('../resources/radio.png')} />
<Text style={{marginLeft:5,fontWeight:'bold',fontSize:RFPercentage(1.8)}}>Paystack(subscription)</Text></View>
<View style={styles.pay}><Image style={styles.radio} source={require('../resources/radio.png')} />
<Text style={{marginLeft:5,fontWeight:'bold',fontSize:RFPercentage(1.8)}}>Qucikteller(Master Card/Verve)</Text></View>
</View>
<View style={{justifyContent:'space-around',height:'100%',width:'41%'}}>
<View style = {styles.total}><Text style={styles.bold}>Sub Total: </Text><Text style={{color:'#40b9e9',fontSize:RFPercentage(1.8)}}>N 7400.00</Text></View>
<View style = {styles.total}><Text style={styles.bold}>Shipping: </Text><Text style={{color:'#40b9e9',fontSize:RFPercentage(1.8)}}>N 0.00</Text></View>
<View style = {styles.total}><Text style={styles.bold}>Garnd Total: </Text><Text style={{color:'#40b9e9',fontSize:RFPercentage(1.8)}}>N 7400.00</Text></View>
</View>
</View>
<View style={styles.terms}>
<Image style={styles.checkbox} source={require('../resources/check.png')} />
<Text style= {{fontSize:RFPercentage(1.8)}}>I Have Read And i Agree To The Terms & Conditions</Text>
</View>
<View style={styles.buttons}>
<TouchableOpacity style={{width:'70%',height:'40%',backgroundColor:'darkblue',justifyContent:'space-around',alignItems:'center',}}>
<Text style={{color:'#fff',textAlign:'center',fontSize:RFPercentage(3.2), fontWeight:'bold'}}>Proceed To Checkout</Text>
</TouchableOpacity>
<TouchableOpacity style={{width:'70%',height:'40%',}}>
<Text style={{color:'darkblue',textAlign:'center',fontSize:RFPercentage(3.2), fontWeight:'bold'}} onPress={gotohome}>Back To Shop</Text>
</TouchableOpacity>
</View>
<View style={{width:'30%',backgroundColor:'red'}}></View>
</View>
</View>
</View>
</View></ScrollView>
提前感谢!