kylefang/react-native-super-grid
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native-super-grid.git synced 2026-04-29 12:55:18 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #45 from andersonaddo/master

Browse Source 
Addressing indexing problem from issue #44
This commit is contained in:
Saleel
2018-06-08 01:58:59 +04:00
committed by GitHub
parent d988a8fd23 ad36660512
commit 62154a76ae
2 changed files with 16 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
SuperGridSectionList.js
View File

@@ -62,6 +62,7 @@ class SuperGridSectionList extends Component {
};
}
//In this method, item is acutally representing a row of items
renderHorizontalRow({item, index, section, separators}) {
const { itemDimension, containerDimension, spacing, fixed, sections, itemsPerRow } = this.state;
const rowStyle = {
@@ -86,6 +87,7 @@ class SuperGridSectionList extends Component {
};
}
//Going through the row and rendering each item in that row dividually (all wrapped in a single view element)
return (
<View style={rowStyle}>
{(item || []).map((itemObject, i) => (
@@ -106,13 +108,16 @@ class SuperGridSectionList extends Component {
//Deep copy, so that re-renders and chunkArray functions don't affect the actual items object
let sectionsCopy = JSON.parse(JSON.stringify(sections));
//Going through all the sections in sectionsCopy, and dividing their 'data' fields into smaller 'chunked' arrays to represent rows
for (sectionsPair of sectionsCopy){
const chunked = chunkArray(sectionsPair.data, itemsPerRow);
//Going through all the sections in sectionsCopy, and dividing their 'data' fields into smaller 'chunked' arrays to represent rows
const chunked = chunkArray(sectionsPair.data, itemsPerRow);
//Now adding metadata to these rows
const rows = chunked.map((r, i) => {
const keydRow = [...r];
keydRow.key = `row_${i}`;
keydRow.rowNumber = i;
keydRow.rowNumber = i; //Assigning a row number to each row to allow proper indexing later (row numbers local to section, not whole list)
keydRow.isLast = (chunked.length - 1 === i);
return keydRow;
});

13
index.js
View File

@@ -59,7 +59,7 @@ class SuperGrid extends Component {
}
renderVerticalRow(data) {
const { itemDimension, spacing, containerDimension, fixed } = this.state;
const { itemDimension, spacing, containerDimension, fixed, itemsPerRow } = this.state;
const rowStyle = {
flexDirection: 'column',
paddingTop: spacing,
@@ -87,7 +87,7 @@ class SuperGrid extends Component {
{(data || []).map((item, i) => (
<View key={`${data.key}_${i}`} style={itemContainerStyle}>
<View style={itemStyle}>
{this.props.renderItem(item, i)}
{this.props.renderItem(item, i + (data.rowNumber * itemsPerRow))}
</View>
</View>
))}
@@ -96,7 +96,7 @@ class SuperGrid extends Component {
}
renderHorizontalRow(data) {
const { itemDimension, containerDimension, spacing, fixed } = this.state;
const { itemDimension, containerDimension, spacing, fixed, itemsPerRow } = this.state;
const rowStyle = {
flexDirection: 'row',
paddingLeft: spacing,
@@ -124,7 +124,7 @@ class SuperGrid extends Component {
{(data || []).map((item, i) => (
<View key={`${data.key}_${i}`} style={itemContainerStyle}>
<View style={itemStyle}>
{this.props.renderItem(item, i)}
{this.props.renderItem(item, i + (data.rowNumber * itemsPerRow))}
</View>
</View>
))}
@@ -145,10 +145,13 @@ class SuperGrid extends Component {
horizontal, ...props } = this.props;
const { itemsPerRow } = this.state;
const chunked = chunkArray(items, itemsPerRow);
const chunked = chunkArray(items, itemsPerRow); //Splitting the data into rows
//Adding metadata to these rows
const rows = chunked.map((r, i) => {
const keydRow = [...r];
keydRow.key = `row_${i}`;
keydRow.rowNumber = i; //Assigning a row number to each row to allow proper indexing later
keydRow.isLast = (chunked.length - 1 === i);
return keydRow;
});