title: How to make a space between images in React Native Project?
body: <p>Now I am creating a mobile app with React Native and Expo.</p>
  
  <p>I set ScrollView and View, Image, Text inside ScrollView.
  I would like to make some space between each images but I couldn't.</p>
  
  <p>Of course I tried to use Padding and Margin in styleSheet but these are not working.</p>
  
  <p>This is my code.</p>
  
  <pre><code>  renderShopList() {
      return shopLists.map((value, index) =&gt; {
       return (
        &lt;View
         key={index}
         style={styles.shopListBox}
        &gt;
         &lt;Image
          source={value.image}
          style={styles.shopListImage}
        /&gt;
         &lt;View style={styles.shopListTextBox}&gt;
          &lt;Text style={styles.shopListText}&gt;
            {value.genre}
          &lt;/Text&gt;
        &lt;/View&gt;
      &lt;/View&gt;
     );
   });
  }
  </code></pre>
  
  <p>This is my StyleSheet below.</p>
  
  <pre><code>const styles = StyleSheet.create({
   container: {
    flex: 0.2,
   },
   shopListBox: {
    width: 140,
    height: 105,
    marginTop: '8%',
   },
   shopListImage: {
    width: 140,
    height: 105,
    marginLeft: '12%',
    borderRadius: 4,
   },
   shopListTextBox: {
    position: 'absolute',
    top: '26%',
    left: '12%',
    width: 140,
    paddingTop: '2%',
    paddingBottom: '2%',
    backgroundColor: 'rgba(111,111,111,0.8)',
   },
   shopListText: {
    fontSize: 25,
    fontWeight: '900',
    color: '#fff',
    paddingLeft: '28%',
   },
   });
  </code></pre>