React Native View Wont Scroll

benim app.i benim view.i benim metinleri ve ekranın altındaki dipleri var benim view.i kaydırma yapamam ama benim view.is tepki kaydırma olamaz herhangi bir varsayılan kaydırma efekti vermez?React Native View Wont Scroll

render() { 
     if(this.viewCaseData === true){ 
     var caseList = <View > 
      <ListView dataSource={this.state.dataSource} renderRow={this.renderRow.bind(this)}></ListView> 

     </View> 
}else{ 
     var caseList = <ScrollView ref='scrollView' contentContainerStyle={{flex:1}} style={{ 
      marginLeft: 10, 
      marginRight: 10, 
      flex:1 
     }}> 
     <View> 
      <View style={{ 
       marginBottom: 10, 
       flexDirection: 'column' 
      }}> 
       <View> 

       <TextField 
       label={'Search'} 
       highlightColor={'#DA4336'} 
       duration={10} 
       labelColor={'black'} 
       borderColor = {'#DA4336'} 
       onChangeText={(text) => this.setState({searchText: text})} 
       value = {this.state.searchText} 
       dense={true} 
       /> 
       </View> 
       <View > 
        <TouchableOpacity 
        onPress={this.loadCustomerData.bind(this)} 
        style={{ 
         marginLeft: 320, 
         height: 30, 
         width: 30, 
         backgroundColor: '#DA4336' 
        }}> 
         <Text style={{ 
          color: '#fff' 
         }}>Search</Text> 
        </TouchableOpacity> 
       </View> 
      </View> 

      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Customer Category</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 
      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Customer Category Type</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Customer Code Type</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Customer Code</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>BranchLocation</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Title</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Full Name</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Initials</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Lastname</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Preferred Name</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>DateOf Birth</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Gender</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Mother Maiden Name</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Nationality</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Religon</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Marital Status</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Preferred Language</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Mobile01</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Mobile02</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 

      <View style={styles.seperator}/> 
      <View style={styles.textMainView}> 
       <Text style={styles.textLabel}>Email</Text> 
       <Text style={styles.textDetail}>value</Text> 
      </View> 
      </View> 
     </ScrollView> 
     } 

     return (
      <View style={{flex:1}}> 
       <View style={styles.headerView}> 

        <View > 
         <View style={styles.circle}> 
          <Text style={{ 
           fontSize: 40, 
           fontWeight: 'bold', 
           color: '#fff', 
           marginLeft: 18 
          }}>A</Text> 
         </View> 

         <Text style={{ 
          fontSize: 18, 
          color: '#fff', 
          marginLeft: 15, 
          marginTop: 5, 
          marginBottom: 20 
         }}>User Name</Text> 
        </View> 

        <View style={styles.headerButtonMain}> 
         <View style={styles.headerButton}> 
           <TouchableOpacity style={{ 
            marginRight: 25 
           }} 
           onPress={this.loadListData.bind(this)} 
           > 
            <Image style={styles.button} source={require('./img/imgCase.png')}/> 
           </TouchableOpacity> 

           <TouchableOpacity style={{ 
            marginRight: 25 
           }} 
           onPress={this.openCaseView.bind(this)} 
           > 
            <Image style={styles.button} source={require('./img/imgCall.png')}/> 
           </TouchableOpacity> 
           <TouchableOpacity style={{ 
            marginRight: 25 
           }} 
           //onPress={this._onPressButton} 
           > 
            <Image style={styles.button} source={require('./img/imgCase.png')}/> 
           </TouchableOpacity> 
         </View> 
         <Text style={{ 
          fontSize: 18, 
          color: '#fff', 
          marginLeft: 15, 
          marginTop: 38, 
          marginBottom: 20 
         }}>My Cases</Text> 
        </View> 

       </View> 
       <View> 


{caseList} 
       </View> 
       <View> 
        <ColoredFab> 
         <Image pointerEvents="none" source={require('./img/plus_white.png')}/> 
        </ColoredFab> 
       </View> 
      </View> 

     );

kaynak

2016-04-10 kosala

bir rnplay örnek sağlayabilir Sorunum çözün? –

yorum için teşekkürler daniel ben burada bana rehberlik için https://facebook.github.io/react-native/docs/scrollview.html#content .thanks kaydırma görünümü ekleyerek sorunu çözmek. – kosala

Kendi sorunuza cevap verebilecek kadar nazik misiniz? Durumunda bir sonraki kişiye yardımcı olabilir;) –

benim ana görünüm olarak scrollview ekleme

var _scrollView: ScrollView; 

<ScrollView 
      ref={(scrollView) => { _scrollView = scrollView; }} 
      automaticallyAdjustContentInsets={false} 
      onScroll={() => { console.log('onScroll!'); }} 
      scrollEventThrottle={200} 
      style={{height: 300}}> 
..... 

</ScrollView>

kaynak

2016-04-10 17:44:23 kosala

React Native View Wont Scroll

cevap

İlgili konular