Last active
December 17, 2021 00:22
-
-
Save rickyalmeidadev/e35b1607e2be9f1c69b0733214babb34 to your computer and use it in GitHub Desktop.
React Native GridList using FlatList
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import * as React from 'react' | |
import {FlatList, useWindowDimensions, View} from 'react-native' | |
const GridList = ({numColumns, renderItem, spacing, ...props}) => { | |
const dimensions = useWindowDimensions() | |
return ( | |
<FlatList | |
numColumns={numColumns ?? 2} | |
renderItem={(...args) => ( | |
<View style={{padding: spacing ?? 8, width: dimensions.width / (numColumns ?? 2)}}> | |
{renderItem(...args)} | |
</View> | |
)} | |
{...props} | |
/> | |
) | |
} | |
export default GridList |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment