title: Grid view without using FlatList in React native
body: <p>I have just started to learn react native. I want to create grid view. I know I can do it with using <code>FlatList</code>. But I don't want that. I just map the data from the array and make a grid using this. But it didn't worked. Here is my code.</p>
  <pre><code>const ingredientnsViews = INGREDIENTS.map(data =&gt; {
    return (
       &lt;View style={styles.gridIngredients}&gt;
         &lt;Image
           style={styles.ingredientImage}
           resizeMode=&quot;contain&quot;
           source={data.image}
         /&gt;
         &lt;Text style={styles.ingredientsText}&gt;{data.title}&lt;/Text&gt;
       &lt;/View&gt;
    );
  });
  </code></pre>
  <p>This is my style.</p>
  <pre><code>ingredientsText: {
  fontFamily: AppFonts.Primary.Sans.Regular,
  fontStyle: 'normal',
  fontWeight: '400',
  alignSelf: 'center',
  fontSize: 12,
  color: COLORS.black,
  },
  
  gridIngredients: {
  marginTop: 12,
  width: '30%',
  flexDirection: 'row',
  justifyContent: 'center',
  backgroundColor: COLORS.tabBgColor,
  paddingStart: 16,
  paddingEnd: 16,
  paddingTop: 8,
  paddingBottom: 8,
  borderRadius: 8,
  },
  
  ingredientImage: {
  width: 15,
  alignSelf: 'center',
  height: 15,
  },
  </code></pre>
  <p><code>INGREDIENTS</code> is my kind of array. I need grid with <code>4</code> comumns.
  Thanks in advance for help.</p>