2017-10-28 7 views
1

Ich kann nicht herausfinden, warum ein Bildschirm in meiner Android App im Android-Emulator überhaupt nicht scrollt. Hier ist mein Code:reactive-native scrollview scrollt nicht

import React, { Component } from 'react'; 
import Dimensions from 'Dimensions'; 

import { 
    Text, 
    ScrollView, 
    View, 
    TouchableHighlight, 
    StyleSheet 
} from 'react-native'; 


const win = Dimensions.get('window'); 

class DeficiencyItem extends Component { 

    render() { 
     const touchable = { 
       width:win.width/2-20, 
       height:230, 
       backgroundColor:'red', 
       }; 
     return (
      <TouchableHighlight style={touchable}> 
       <View> 
        <Text>Item Here</Text> 
       </View> 
      </TouchableHighlight> 
     ); 
    } 
} 

export default class Items extends Component { 
    static navigationOptions = {title:'hey'}; 

    constructor(props) 
    { 
     super(props); 
    } 

    render() { 

     let deficiencies = []; 
     for(let x = 0; x<12;x++) 
     { 
      let row = <DeficiencyItem key={x} />; 
      deficiencies.push(row); 
     } 
     return (
      <View style={{flex:1}}> 
       <ScrollView style={{ 
       margin:5, 
       flexWrap: 'wrap', 
       flexDirection:'row', 
       }}> 
       {deficiencies} 
       </ScrollView> 
      </View> 
     ); 
    } 
} 

Es gibt Elemente, die die untere Grenze des View-Ports überschreiten. Aber Touch ziehen, um im Emulator zu scrollen, tut nichts. Was habe ich falsch gemacht?

+0

Sag mir, wie kann ich installieren auch reagieren nativen –

Antwort

2

Wenn es keine Ansicht außerhalb von scrollview gibt, entfernen Sie Element anzeigen und fügen Sie flex: 1 zu scrollview hinzu.

Scrollgeordneten Ansicht sein sollte,

<ScrollView style={styles.container}> 
    <View style={{flex:1}}> 
    {deficiencies} 
    </View> 
</ScrollView> 

container: { 
    flex: 1, 
    }