[react-packager] change all but one `ix` to `require`

This commit is contained in:
Amjad Masad 2015-03-20 15:51:11 -07:00
parent 258a81388e
commit f1746ac83e
8 changed files with 19 additions and 48 deletions

View File

@ -11,7 +11,6 @@ var {
StyleSheet, StyleSheet,
Text, Text,
View, View,
ix,
} = React; } = React;
var ImageCapInsetsExample = React.createClass({ var ImageCapInsetsExample = React.createClass({
@ -23,7 +22,7 @@ var ImageCapInsetsExample = React.createClass({
capInsets: none capInsets: none
</Text> </Text>
<Image <Image
source={ix('story-background')} source={require('image!story-background')}
style={styles.storyBackground} style={styles.storyBackground}
capInsets={{left: 0, right: 0, bottom: 0, top: 0}} capInsets={{left: 0, right: 0, bottom: 0, top: 0}}
/> />
@ -33,7 +32,7 @@ var ImageCapInsetsExample = React.createClass({
capInsets: 15 capInsets: 15
</Text> </Text>
<Image <Image
source={ix('story-background')} source={require('image!story-background')}
style={styles.storyBackground} style={styles.storyBackground}
capInsets={{left: 15, right: 15, bottom: 15, top: 15}} capInsets={{left: 15, right: 15, bottom: 15, top: 15}}
/> />

View File

@ -9,7 +9,6 @@ var {
StyleSheet, StyleSheet,
Text, Text,
View, View,
ix,
} = React; } = React;
var ImageCapInsetsExample = require('./ImageCapInsetsExample'); var ImageCapInsetsExample = require('./ImageCapInsetsExample');
@ -34,15 +33,15 @@ exports.examples = [
}, },
{ {
title: 'Plain Static Image', title: 'Plain Static Image',
description: 'Static assets must be referenced with the `ix` wrapper and ' + description: 'Static assets should be required by prefixing with `image!` ' +
'located in the app bundle.', 'and are located in the app bundle.',
render: function() { render: function() {
return ( return (
<View style={styles.horizontal}> <View style={styles.horizontal}>
<Image source={ix('uie_thumb_normal')} style={styles.icon} /> <Image source={require('image!uie_thumb_normal')} style={styles.icon} />
<Image source={ix('uie_thumb_selected')} style={styles.icon} /> <Image source={require('image!uie_thumb_selected')} style={styles.icon} />
<Image source={ix('uie_comment_normal')} style={styles.icon} /> <Image source={require('image!uie_comment_normal')} style={styles.icon} />
<Image source={ix('uie_comment_highlighted')} style={styles.icon} /> <Image source={require('image!uie_comment_highlighted')} style={styles.icon} />
</View> </View>
); );
}, },
@ -184,19 +183,19 @@ exports.examples = [
return ( return (
<View style={styles.horizontal}> <View style={styles.horizontal}>
<Image <Image
source={ix('uie_thumb_normal')} source={require('image!uie_thumb_normal')}
style={[styles.icon, {tintColor: 'blue' }]} style={[styles.icon, {tintColor: 'blue' }]}
/> />
<Image <Image
source={ix('uie_thumb_normal')} source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: 'green' }]} style={[styles.icon, styles.leftMargin, {tintColor: 'green' }]}
/> />
<Image <Image
source={ix('uie_thumb_normal')} source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: 'red' }]} style={[styles.icon, styles.leftMargin, {tintColor: 'red' }]}
/> />
<Image <Image
source={ix('uie_thumb_normal')} source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: 'black' }]} style={[styles.icon, styles.leftMargin, {tintColor: 'black' }]}
/> />
</View> </View>

View File

@ -10,7 +10,6 @@ var StyleSheet = require('StyleSheet');
var Text = require('Text'); var Text = require('Text');
var View = require('View'); var View = require('View');
var ix = require('ix');
var TabBarExample = React.createClass({ var TabBarExample = React.createClass({
@ -42,7 +41,7 @@ var TabBarExample = React.createClass({
selectedTab={this.state.selectedTab}> selectedTab={this.state.selectedTab}>
<TabBarItemIOS <TabBarItemIOS
name="blueTab" name="blueTab"
icon={ix('favorites')} icon={require('image!favorites')}
accessibilityLabel="Blue Tab" accessibilityLabel="Blue Tab"
selected={this.state.selectedTab === 'blueTab'} selected={this.state.selectedTab === 'blueTab'}
onPress={() => { onPress={() => {
@ -55,7 +54,7 @@ var TabBarExample = React.createClass({
<TabBarItemIOS <TabBarItemIOS
accessibilityLabel="Red Tab" accessibilityLabel="Red Tab"
name="redTab" name="redTab"
icon={ix('history')} icon={require('image!history')}
badgeValue={this.state.notifCount ? String(this.state.notifCount) : null} badgeValue={this.state.notifCount ? String(this.state.notifCount) : null}
selected={this.state.selectedTab === 'redTab'} selected={this.state.selectedTab === 'redTab'}
onPress={() => { onPress={() => {
@ -68,7 +67,7 @@ var TabBarExample = React.createClass({
</TabBarItemIOS> </TabBarItemIOS>
<TabBarItemIOS <TabBarItemIOS
name="greenTab" name="greenTab"
icon={ix('more')} icon={require('image!more')}
accessibilityLabel="Green Tab" accessibilityLabel="Green Tab"
selected={this.state.selectedTab === 'greenTab'} selected={this.state.selectedTab === 'greenTab'}
onPress={() => { onPress={() => {

View File

@ -41,7 +41,7 @@ var DEFAULT_PROPS = {
* <TouchableHighlight onPress={this._onPressButton}> * <TouchableHighlight onPress={this._onPressButton}>
* <Image * <Image
* style={styles.button} * style={styles.button}
* source={ix('myButton')} * source={require('image!myButton')}
* /> * />
* </View> * </View>
* ); * );

View File

@ -30,7 +30,7 @@ var onlyChild = require('onlyChild');
* <TouchableOpacity onPress={this._onPressButton}> * <TouchableOpacity onPress={this._onPressButton}>
* <Image * <Image
* style={styles.button} * style={styles.button}
* source={ix('myButton')} * source={require('image!myButton')}
* /> * />
* </View> * </View>
* ); * );

View File

@ -36,7 +36,7 @@ var warning = require('warning');
* <View> * <View>
* <Image * <Image
* style={styles.icon} * style={styles.icon}
* source={ix('myIcon')} * source={require('image!myIcon')}
* /> * />
* <Image * <Image
* style={styles.logo} * style={styles.logo}

View File

@ -1,26 +0,0 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
*
* @providesModule ix
*/
'use strict';
/**
* This function is used to mark string literals that are image paths. The
* return value is a blob of data that core image components understand how to
* render.
*
* The arguments to ix() must be string literals so that they can be parsed
* statically.
*
* @param string Image path to render
* @return object Data blob to be used by core UI components
*/
function ix(path) {
return {
uri: path,
isStatic: true,
};
}
module.exports = ix;

View File

@ -45,7 +45,7 @@ var ReactNative = {
TimerMixin: require('TimerMixin'), TimerMixin: require('TimerMixin'),
VibrationIOS: require('VibrationIOS'), VibrationIOS: require('VibrationIOS'),
ix: require('ix'), invariant: require('invariant'),
}; };
module.exports = ReactNative; module.exports = ReactNative;