滚动视图不显示



我正在处理我的代码,突然ScrollView决定消失。

出于某种原因,ScrollView在字符栏视图中"正常"工作但当它在基础视图内时,它就不在那里了。

export default class CharacterSheet extends Component {
render() {
return ( 
<View style={{flex:1}}>
<View style={styles.TopBar}>
<View>              
</View>        
</View>
<View style={{flex:1}}>          
<View style={styles.CharacterBar}>
</View><View style={styles.Base}>
<ScrollView style={styles.scroll}>              
<View style={{paddingTop:72}}>
<View style={styles.spellsBox}>
<Text>Hi</Text>
</View>
<View style={styles.spellsBox}>
<Text>e</Text>
</View>
<View style={styles.spellsBox}>
<Text>a</Text>
</View>
<View style={styles.spellsBox}>
<Text>Hi</Text>
</View>
<View style={styles.spellsBox}>
<Text>Hi</Text>
</View>
<View style={styles.spellsBox}>
<Text>Hi</Text>
</View>
</View>            
</ScrollView>
</View>          
<Animated.View style={styles.CharacterStatsBar}>
</Animated.View>          
</View>   
</View>
);
}
}
const styles = StyleSheet.create({
CharacterBar:{
height:72,
backgroundColor:'#242527'
},
CharacterStatsBar:{
position:'absolute',
top: 72,
left: 0,
right: 0,
height:72,
backgroundColor:'#404040',
borderBottomWidth:2,
borderBottomColor:'#c53131',
borderTopWidth:1,
borderTopColor:'#838383',
},
Base:{
flex:1,
backgroundColor:'#fff',
},
scroll:{
width:'95%',
alignSelf:'center'
},
spellsBox:{
height:80,  
marginTop:10,  
paddingVertical:10,
borderColor:'#777',
borderWidth:3,
justifyContent:'center'
}
});

我正试图在安卓设备中运行这个

这个问题很烦人,让我有点紧张。

试着这样,不要将ScrollView包装在多个视图中。

<View style={{flex:1}}>
<View style={styles.TopBar}>
<View>              
</View>        
</View>      
<ScrollView style={styles.scroll}>              
<View style={{paddingTop:72}}>
<View style={styles.spellsBox}>
<Text>Hi</Text>
</View>
<View style={styles.spellsBox}>
<Text>e</Text>
</View>
<View style={styles.spellsBox}>
<Text>a</Text>
</View>
<View style={styles.spellsBox}>
<Text>Hi</Text>
</View>
<View style={styles.spellsBox}>
<Text>Hi</Text>
</View>
<View style={styles.spellsBox}>
<Text>byee</Text>
</View>
</View>            
</ScrollView>         
</View>

相关内容

  • 没有找到相关文章

最新更新