status-im
/
react-native
mirror of https://github.com/status-im/react-native.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

[ReactNative][SyncDiff] Add Image Example

This commit is contained in:
Andrei Coman 2015-09-01 14:51:46 -01:00
parent c522e3b16e
commit 9cede03846
1 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
Examples/UIExplorer/ImageExample.js
View File

@ -97,6 +97,7 @@ exports.examples = [
<NetworkImageExample source={{uri: 'http://TYPO_ERROR_facebook.github.io/react/img/logo_og.png'}} /> <NetworkImageExample source={{uri: 'http://TYPO_ERROR_facebook.github.io/react/img/logo_og.png'}} />
); );
}, },
platform: 'ios',
}, },
{ {
title: 'Image Download Progress', title: 'Image Download Progress',
@ -105,6 +106,7 @@ exports.examples = [
<NetworkImageExample source={{uri: 'http://facebook.github.io/origami/public/images/blog-hero.jpg?r=1'}}/> <NetworkImageExample source={{uri: 'http://facebook.github.io/origami/public/images/blog-hero.jpg?r=1'}}/>
); );
}, },
platform: 'ios',
}, },
{ {
title: 'Border Color', title: 'Border Color',
@ -122,6 +124,7 @@ exports.examples = [
</View> </View>
); );
}, },
platform: 'ios',
}, },
{ {
title: 'Border Width', title: 'Border Width',
@ -139,6 +142,7 @@ exports.examples = [
</View> </View>
); );
}, },
platform: 'ios',
}, },
{ {
title: 'Border Radius', title: 'Border Radius',
@ -146,17 +150,12 @@ exports.examples = [
return ( return (
<View style={styles.horizontal}> <View style={styles.horizontal}>
<Image <Image
style={[styles.base, styles.background, {borderRadius: 5}]} style={[styles.base, {borderRadius: 5}]}
source={smallImage} source={fullImage}
/> />
<Image <Image
style={[ style={[styles.base, styles.leftMargin, {borderRadius: 19}]}
styles.base, source={fullImage}
styles.background,
styles.leftMargin,
{borderRadius: 19}
]}
source={smallImage}
/> />
</View> </View>
); );
@ -245,19 +244,19 @@ exports.examples = [
<View style={styles.horizontal}> <View style={styles.horizontal}>
<Image <Image
source={require('image!uie_thumb_normal')} source={require('image!uie_thumb_normal')}
style={[styles.icon, {tintColor: '#5ac8fa' }]} style={[styles.icon, {borderRadius: 5, tintColor: '#5ac8fa' }]}
/> />
<Image <Image
source={require('image!uie_thumb_normal')} source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: '#4cd964' }]} style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#4cd964' }]}
/> />
<Image <Image
source={require('image!uie_thumb_normal')} source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: '#ff2d55' }]} style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#ff2d55' }]}
/> />
<Image <Image
source={require('image!uie_thumb_normal')} source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: '#8e8e93' }]} style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#8e8e93' }]}
/> />
</View> </View>
<Text style={styles.sectionText}> <Text style={styles.sectionText}>
@ -266,19 +265,19 @@ exports.examples = [
<View style={styles.horizontal}> <View style={styles.horizontal}>
<Image <Image
source={smallImage} source={smallImage}
style={[styles.base, {tintColor: '#5ac8fa' }]} style={[styles.base, {borderRadius: 5, tintColor: '#5ac8fa' }]}
/> />
<Image <Image
source={smallImage} source={smallImage}
style={[styles.base, styles.leftMargin, {tintColor: '#4cd964' }]} style={[styles.base, styles.leftMargin, {borderRadius: 5, tintColor: '#4cd964' }]}
/> />
<Image <Image
source={smallImage} source={smallImage}
style={[styles.base, styles.leftMargin, {tintColor: '#ff2d55' }]} style={[styles.base, styles.leftMargin, {borderRadius: 5, tintColor: '#ff2d55' }]}
/> />
<Image <Image
source={smallImage} source={smallImage}
style={[styles.base, styles.leftMargin, {tintColor: '#8e8e93' }]} style={[styles.base, styles.leftMargin, {borderRadius: 5, tintColor: '#8e8e93' }]}
/> />
</View> </View>
</View> </View>
@ -336,6 +335,7 @@ exports.examples = [
render: function() { render: function() {
return <ImageCapInsetsExample />; return <ImageCapInsetsExample />;
}, },
platform: 'ios',
}, },
]; ];