ScrollView не отображается - PullRequest
Новая
       14

ScrollView не отображается

1 голос
/ 27 февраля 2020

Я возился с моим кодом, и внезапно 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'
  }
});

Я пытаюсь запустить это на android устройстве

, эта проблема довольно раздражает и немного напрягает меня.

1 Ответ

0 голосов
/ 27 февраля 2020

Попробуйте вот так, не заворачивайте 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>
...