From 761ea9e3bb4d709396c91b4020cf1d8fb2fa9a90 Mon Sep 17 00:00:00 2001
From: Janic Duplessis <janicduplessis@gmail.com>
Date: Wed, 22 Jun 2016 04:13:22 -0700
Subject: [PATCH] Add Image resizeMode repeat on iOS

Summary:
This adds a new resize mode for iOS 'repeat' that tiles the image over it's frame. This allow to easily create a view with a repeating background pattern which there is no way to do at the moment without including a bunch of different sized assets.

I'm not 100% sure it should be a resizeMode or a separate prop but I went with resizeMode since it made more sense to me and the are not really any use cases where we'd want to use this with another resizeMode other than 'stretch'.

**Test plan**

Tested mainly by adding a UIExplorer example, also tested that changing the resizeMode prop from and to 'repeat' worked properly.
![screen shot 2016-06-07 at 3 06 17 am](https://cloud.githubusercontent.com/assets/2677334/15848755/d95d8046-2c5c-11e6-9f3d-1ce8a1c9c846.png)

I'd like to implement this on Android too but it is a bit trickier since Fresco's ImageView doesn't support image tiling and would require submitting a PR there too :(
Closes https://github.com/facebook/react-native/pull/7968

Differential Revision: D3469119

Pulled By: javache

fbshipit-source-id: ab9dbfe448a5b0771dbf0c41fcceeb366210f583
---
 UIExplorer/ImageExample.js | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/UIExplorer/ImageExample.js b/UIExplorer/ImageExample.js
index 50809906433..1e6c6de19b4 100644
--- a/UIExplorer/ImageExample.js
+++ b/UIExplorer/ImageExample.js
@@ -505,6 +505,18 @@ exports.examples = [
                     source={image}
                   />
                 </View>
+                { Platform.OS === 'ios' ?
+                  <View style={styles.leftMargin}>
+                    <Text style={[styles.resizeModeText]}>
+                      Repeat
+                    </Text>
+                    <Image
+                      style={styles.resizeMode}
+                      resizeMode={Image.resizeMode.repeat}
+                      source={image}
+                    />
+                  </View>
+                : null }
                 { Platform.OS === 'android' ?
                   <View style={styles.leftMargin}>
                     <Text style={[styles.resizeModeText]}>