Improve z-index implementation on Android

Summary:
Use `getChildDrawingOrder` instead of reordering views. The old implementation didn't work properly when `removeClippedSubviews` was enabled and this one should have better performance since we don't play with the view hierarchy at all.

This fixes weird bugs with sticky headers in `SectionList` and allows removing the hack that disabled `removeClippedSubviews` when using sticky section headers.

**Test plan**
Tested using the SectionList and ListViewPaging examples that use sticky headers which uses z-index.
Closes https://github.com/facebook/react-native/pull/13105

Reviewed By: sahrens

Differential Revision: D4765869

Pulled By: achen1

fbshipit-source-id: be3c824658a3ce965b6e7324ad95c77cbd8a86ae
This commit is contained in:
Janic Duplessis
2017-04-05 09:07:22 -07:00
committed by Facebook Github Bot
parent af533ac7f1
commit 9a51fa8e15
7 changed files with 149 additions and 53 deletions

View File

@@ -195,6 +195,7 @@ class ListViewPagingExample extends React.Component {
initialListSize={10}
pageSize={4}
scrollRenderAheadDistance={500}
stickySectionHeadersEnabled
/>
);
}

View File

@@ -59,7 +59,7 @@ const VIEWABILITY_CONFIG = {
};
const renderSectionHeader = ({section}) => (
<View>
<View style={styles.header}>
<Text style={styles.headerText}>SECTION HEADER: {section.key}</Text>
<SeparatorComponent />
</View>
@@ -144,6 +144,7 @@ class SectionListExample extends React.PureComponent {
refreshing={false}
renderItem={this._renderItemComponent}
renderSectionHeader={renderSectionHeader}
stickySectionHeadersEnabled
sections={[
{renderItem: renderStackedItem, key: 's1', data: [
{title: 'Item In Header Section', text: 'Section s1', key: '0'},
@@ -186,6 +187,9 @@ class SectionListExample extends React.PureComponent {
}
const styles = StyleSheet.create({
header: {
backgroundColor: '#e9eaed',
},
headerText: {
padding: 4,
},