This Responsive Grid (for React Native) corrects the mental model for Grid based layout in that it eliminates the decoherence that results from using both an absolute column count together with relative sizing (!) by letting the developer specify the width of each grid column as a percentage of screen size and then specify the width of a given column in their layout as a multiple of that percentage.
In addition to allowing the developer to think of everything in terms of percentages (i.e. only x:100 ratios, as opposed to x:N for the column width and x:100 for everything else), the developer won’t have to know the screen size in pixels and guess N for the number of grid columns they need to have in order to get the width they desire per grid column (an indirect route.) T
hey can instead use visual intuition about relative sizes to define the column width as a percentage of the current screen width, and derive the rest from there.
yarn add react-native-responsive-grid
$ npm install react-native-responsive-grid
Live Demo: View The Demo
Download Link: Download The Source Code
Official Website: https://github.com/idibidiart/react-native-responsive-grid