oblador / react-native-collapsible

Animated collapsible component for React Native, good for accordions, toggles etc
MIT License
2.46k stars 452 forks source link

Unable to scroll using <ScrollView> inside <Accordion>. #106

Closed abdulkhaliquem9 closed 7 years ago

abdulkhaliquem9 commented 7 years ago

I have a lengthy list of radio buttons with yes/no options. But, the problem here is I am unable to scroll down to the list , so, Is there any way that I can insert ScrollView at the begin and end of the list of radio buttons ScrollView Radio/ Radio / . . . . Radio / /ScrollView

abdulkhaliquem9 commented 7 years ago

I wrapped complete radio list rendering component inside ScrollView component of react-native, but it doesn't scrolls.

abdulkhaliquem9 commented 7 years ago

Solved: Able to scroll inside the accordion after making the height of the wrapper View smaller than the height of ScrollView.

`

<`View style={{flex:1, height:height *0.6 }}>

     <Text>{'HEADING 1'}</Text>
    <ScrollView style={{ height:height *0.7 }}>
    <Accordion
    style={{borderColor:'gray', borderWidth:2}}
      sections={this.SECTION}
      renderHeader={this.renderHeader}
      renderContent={this.renderContent}
    />
    </ScrollView> 

  </View>

`

harishlalwani commented 6 years ago

@abdulkhaliquem9 thanks your solution worked.

saurav-bhagat commented 3 years ago

Solved: Able to scroll inside the accordion after making the height of the wrapper View smaller than the height of ScrollView.

`

<`View style={{flex:1, height:height *0.6 }}>

     <Text>{'HEADING 1'}</Text>
    <ScrollView style={{ height:height *0.7 }}>
    <Accordion
    style={{borderColor:'gray', borderWidth:2}}
      sections={this.SECTION}
      renderHeader={this.renderHeader}
      renderContent={this.renderContent}
    />
    </ScrollView> 

  </View>

`

What is the height variable here?

welsdarte commented 3 years ago

VirtualizedLists should never be nested inside plain ScrollViews with the same orientation because it can break windowing and other functionality - use another VirtualizedList-backed container instead. I get this error when I apply your method.