mirror of
https://github.com/status-im/react-native-fast-image.git
synced 2026-08-31 05:41:16 +00:00
Setup example using react-native link.
This commit is contained in:
Dylan Vann
@@ -1,58 +0,0 @@
|
||||
/**
|
||||
* Sample React Native App
|
||||
* https://github.com/facebook/react-native
|
||||
* @flow
|
||||
*/
|
||||
|
||||
import React, { Component } from 'react';
|
||||
import {
|
||||
Platform,
|
||||
StyleSheet,
|
||||
Text,
|
||||
View
|
||||
} from 'react-native';
|
||||
|
||||
const instructions = Platform.select({
|
||||
ios: 'Press Cmd+R to reload,\n' +
|
||||
'Cmd+D or shake for dev menu',
|
||||
android: 'Double tap R on your keyboard to reload,\n' +
|
||||
'Shake or press menu button for dev menu',
|
||||
});
|
||||
|
||||
type Props = {};
|
||||
export default class App extends Component<Props> {
|
||||
render() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Text style={styles.welcome}>
|
||||
Welcome to React Native!
|
||||
</Text>
|
||||
<Text style={styles.instructions}>
|
||||
To get started, edit App.js
|
||||
</Text>
|
||||
<Text style={styles.instructions}>
|
||||
{instructions}
|
||||
</Text>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: '#F5FCFF',
|
||||
},
|
||||
welcome: {
|
||||
fontSize: 20,
|
||||
textAlign: 'center',
|
||||
margin: 10,
|
||||
},
|
||||
instructions: {
|
||||
textAlign: 'center',
|
||||
color: '#333333',
|
||||
marginBottom: 5,
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,32 @@
|
||||
import React from 'react'
|
||||
import { TabNavigator, TabBarBottom } from 'react-navigation'
|
||||
import FastImageExamples from './FastImageExamples'
|
||||
import FastImageGrid from './FastImageGrid'
|
||||
import DefaultImageGrid from './DefaultImageGrid'
|
||||
|
||||
const App = TabNavigator(
|
||||
{
|
||||
fastImageExample: {
|
||||
screen: FastImageExamples,
|
||||
},
|
||||
image: {
|
||||
screen: DefaultImageGrid,
|
||||
},
|
||||
fastImage: {
|
||||
screen: FastImageGrid,
|
||||
},
|
||||
},
|
||||
{
|
||||
tabBarComponent: TabBarBottom,
|
||||
tabBarPosition: 'bottom',
|
||||
swipeEnabled: false,
|
||||
animationEnabled: false,
|
||||
tabBarOptions: {
|
||||
style: {
|
||||
backgroundColor: 'white',
|
||||
},
|
||||
},
|
||||
},
|
||||
)
|
||||
|
||||
export default App
|
||||
@@ -0,0 +1,60 @@
|
||||
import React from 'react'
|
||||
import { StyleSheet, View } from 'react-native'
|
||||
import withCacheBust from './withCacheBust'
|
||||
import SectionFlex from './SectionFlex'
|
||||
import FastImage from 'react-native-fast-image'
|
||||
import Section from './Section'
|
||||
import FeatureText from './FeatureText'
|
||||
|
||||
const IMAGE_URL = 'https://media.giphy.com/media/GEsoqZDGVoisw/giphy.gif'
|
||||
|
||||
const BorderRadiusExample = ({ onPressReload, bust }) => (
|
||||
<View>
|
||||
<Section>
|
||||
<FeatureText text="• Border radius." />
|
||||
</Section>
|
||||
<SectionFlex onPress={onPressReload}>
|
||||
<FastImage
|
||||
style={styles.imageSquare}
|
||||
source={{
|
||||
uri: IMAGE_URL + bust,
|
||||
}}
|
||||
/>
|
||||
<FastImage
|
||||
style={styles.imageRectangular}
|
||||
source={{
|
||||
uri: IMAGE_URL + bust,
|
||||
}}
|
||||
/>
|
||||
</SectionFlex>
|
||||
</View>
|
||||
)
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
imageSquare: {
|
||||
borderRadius: 50,
|
||||
height: 100,
|
||||
backgroundColor: '#ddd',
|
||||
margin: 20,
|
||||
width: 100,
|
||||
flex: 0,
|
||||
},
|
||||
imageRectangular: {
|
||||
borderRadius: 50,
|
||||
borderTopLeftRadius: 10,
|
||||
borderBottomRightRadius: 10,
|
||||
height: 100,
|
||||
backgroundColor: '#ddd',
|
||||
margin: 20,
|
||||
flex: 1,
|
||||
},
|
||||
plus: {
|
||||
width: 30,
|
||||
height: 30,
|
||||
position: 'absolute',
|
||||
bottom: 0,
|
||||
right: 0,
|
||||
},
|
||||
})
|
||||
|
||||
export default withCacheBust(BorderRadiusExample)
|
||||
@@ -0,0 +1,28 @@
|
||||
import React from 'react'
|
||||
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'
|
||||
|
||||
const Button = ({ text, onPress }) => (
|
||||
<TouchableOpacity onPress={onPress}>
|
||||
<View style={styles.button}>
|
||||
<Text style={styles.text}>{text}</Text>
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
)
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
button: {
|
||||
backgroundColor: 'black',
|
||||
margin: 5,
|
||||
height: 44,
|
||||
paddingLeft: 10,
|
||||
paddingRight: 10,
|
||||
borderRadius: 10,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
text: {
|
||||
color: 'white',
|
||||
},
|
||||
})
|
||||
|
||||
export default Button
|
||||
@@ -0,0 +1,16 @@
|
||||
// @flow
|
||||
import React from 'react'
|
||||
import { Image } from 'react-native'
|
||||
import Icon from './Icons/Icon'
|
||||
import ImageGrid from './ImageGrid'
|
||||
|
||||
const DefaultImageGrid = () => <ImageGrid ImageComponent={Image} />
|
||||
|
||||
DefaultImageGrid.navigationOptions = {
|
||||
tabBarLabel: 'Image Grid',
|
||||
tabBarIcon: props => (
|
||||
<Icon name="ios-image-outline" focusedName="ios-image" {...props} />
|
||||
),
|
||||
}
|
||||
|
||||
export default DefaultImageGrid
|
||||
@@ -0,0 +1,81 @@
|
||||
import React from 'react'
|
||||
import { ScrollView, StatusBar, StyleSheet, Text, View } from 'react-native'
|
||||
import Icon from './Icons/Icon'
|
||||
import Section from './Section'
|
||||
import PriorityExample from './PriorityExample'
|
||||
import GifExample from './GifExample'
|
||||
import BorderRadiusExample from './BorderRadiusExample'
|
||||
import FeatureText from './FeatureText'
|
||||
import ProgressExample from './ProgressExample'
|
||||
import PreloadExample from './PreloadExample'
|
||||
import StatusBarUnderlay, { STATUS_BAR_HEIGHT } from './StatusBarUnderlay'
|
||||
|
||||
const FastImageExample = () => (
|
||||
<View style={styles.container}>
|
||||
<StatusBar
|
||||
translucent
|
||||
barStyle="dark-content"
|
||||
backgroundColor="transparent"
|
||||
/>
|
||||
<ScrollView
|
||||
style={styles.scrollContainer}
|
||||
contentContainerStyle={styles.scrollContentContainer}
|
||||
>
|
||||
<View style={styles.contentContainer}>
|
||||
<Section>
|
||||
<Text style={styles.titleText}>🚩 FastImage</Text>
|
||||
<FeatureText text="Tap images to reload examples." />
|
||||
</Section>
|
||||
<PriorityExample />
|
||||
<GifExample />
|
||||
<BorderRadiusExample />
|
||||
<ProgressExample />
|
||||
<PreloadExample />
|
||||
</View>
|
||||
</ScrollView>
|
||||
<StatusBarUnderlay />
|
||||
</View>
|
||||
)
|
||||
|
||||
FastImageExample.navigationOptions = {
|
||||
tabBarLabel: 'FastImage Example',
|
||||
tabBarIcon: props => (
|
||||
<Icon
|
||||
name="ios-information-circle-outline"
|
||||
focusedName="ios-information-circle"
|
||||
{...props}
|
||||
/>
|
||||
),
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
titleText: {
|
||||
fontWeight: '900',
|
||||
marginBottom: 20,
|
||||
color: '#222',
|
||||
},
|
||||
contentContainer: {
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
},
|
||||
image: {
|
||||
flex: 1,
|
||||
height: 100,
|
||||
backgroundColor: '#ddd',
|
||||
margin: 10,
|
||||
},
|
||||
container: {
|
||||
flex: 1,
|
||||
alignItems: 'stretch',
|
||||
backgroundColor: '#fff',
|
||||
},
|
||||
scrollContainer: {
|
||||
marginTop: STATUS_BAR_HEIGHT,
|
||||
},
|
||||
scrollContentContainer: {
|
||||
alignItems: 'stretch',
|
||||
flex: 0,
|
||||
},
|
||||
})
|
||||
|
||||
export default FastImageExample
|
||||
@@ -0,0 +1,15 @@
|
||||
import React from 'react'
|
||||
import FastImage from 'react-native-fast-image'
|
||||
import Icon from './Icons/Icon'
|
||||
import ImageGrid from './ImageGrid'
|
||||
|
||||
const FastImageGrid = () => <ImageGrid ImageComponent={FastImage} />
|
||||
|
||||
FastImageGrid.navigationOptions = {
|
||||
tabBarLabel: 'FastImage Grid',
|
||||
tabBarIcon: props => (
|
||||
<Icon name="ios-photos-outline" focusedName="ios-photos" {...props} />
|
||||
),
|
||||
}
|
||||
|
||||
export default FastImageGrid
|
||||
@@ -0,0 +1,10 @@
|
||||
import React from 'react'
|
||||
import { StyleSheet, Text } from 'react-native'
|
||||
|
||||
export default ({ text }) => <Text style={styles.style}>{text}</Text>
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
style: {
|
||||
color: '#222',
|
||||
},
|
||||
})
|
||||
@@ -0,0 +1,33 @@
|
||||
import React from 'react'
|
||||
import { StyleSheet, View } from 'react-native'
|
||||
import withCacheBust from './withCacheBust'
|
||||
import SectionFlex from './SectionFlex'
|
||||
import FastImage from 'react-native-fast-image'
|
||||
import Section from './Section'
|
||||
import FeatureText from './FeatureText'
|
||||
|
||||
const GIF_URL =
|
||||
'https://cdn-images-1.medium.com/max/1600/1*-CY5bU4OqiJRox7G00sftw.gif'
|
||||
|
||||
const GifExample = ({ onPressReload, bust }) => (
|
||||
<View>
|
||||
<Section>
|
||||
<FeatureText text="• GIF support." />
|
||||
</Section>
|
||||
<SectionFlex onPress={onPressReload}>
|
||||
<FastImage style={styles.image} source={{ uri: GIF_URL + bust }} />
|
||||
</SectionFlex>
|
||||
</View>
|
||||
)
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
image: {
|
||||
backgroundColor: '#ddd',
|
||||
margin: 10,
|
||||
height: 100,
|
||||
width: 100,
|
||||
flex: 0,
|
||||
},
|
||||
})
|
||||
|
||||
export default withCacheBust(GifExample)
|
||||
@@ -0,0 +1,17 @@
|
||||
import React from 'react'
|
||||
import Base from 'react-native-vector-icons/Ionicons'
|
||||
|
||||
const Icon = ({ size, name, focusedName, focused, tintColor }) => (
|
||||
<Base
|
||||
name={focused ? focusedName : name}
|
||||
size={size}
|
||||
style={{ width: size, height: size }}
|
||||
color={tintColor}
|
||||
/>
|
||||
)
|
||||
|
||||
Icon.defaultProps = {
|
||||
size: 26,
|
||||
}
|
||||
|
||||
export default Icon
|
||||
@@ -0,0 +1,125 @@
|
||||
import React, { Component } from 'react'
|
||||
import { FlatList, StyleSheet, Text, View } from 'react-native'
|
||||
import StatusBarUnderlay, { STATUS_BAR_HEIGHT } from './StatusBarUnderlay'
|
||||
|
||||
const getImageUrl = (id, width, height) =>
|
||||
`https://unsplash.it/${width}/${height}?image=${id}`
|
||||
|
||||
class ImageGrid extends Component {
|
||||
constructor(props: Object) {
|
||||
super(props)
|
||||
|
||||
fetch('https://unsplash.it/list')
|
||||
.then(res => res.json())
|
||||
.then(this._onFetchImagesSuccess)
|
||||
.catch(this._onFetchImagesError)
|
||||
}
|
||||
|
||||
state = {
|
||||
images: [],
|
||||
itemHeight: 0,
|
||||
}
|
||||
|
||||
_onLayout = e => {
|
||||
const width = e.nativeEvent.layout.width
|
||||
this.setState({
|
||||
itemHeight: width / 4,
|
||||
})
|
||||
}
|
||||
|
||||
_onFetchImagesError = () => {
|
||||
this.setState({
|
||||
error: true,
|
||||
})
|
||||
}
|
||||
|
||||
_onFetchImagesSuccess = images => {
|
||||
this.setState({
|
||||
images,
|
||||
})
|
||||
}
|
||||
|
||||
_getItemLayout = (data, index) => {
|
||||
const { itemHeight } = this.state
|
||||
return { length: itemHeight, offset: itemHeight * index, index }
|
||||
}
|
||||
|
||||
_renderItem = ({ item }) => {
|
||||
const ImageComponent = this.props.ImageComponent
|
||||
const uri = getImageUrl(item.id, 100, 100)
|
||||
return (
|
||||
<View style={styles.imageContainer}>
|
||||
<ImageComponent source={{ uri }} style={styles.image} />
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
_extractKey = item => {
|
||||
return item.id
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.error) {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Text style={styles.text}>Error fetching images.</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<FlatList
|
||||
onLayout={this._onLayout}
|
||||
style={styles.list}
|
||||
columnWrapperStyle={[
|
||||
styles.columnWrapper,
|
||||
{ height: this.state.itemHeight },
|
||||
]}
|
||||
data={this.state.images}
|
||||
renderItem={this._renderItem}
|
||||
numColumns={4}
|
||||
keyExtractor={this._extractKey}
|
||||
getItemLayout={this._getItemLayout}
|
||||
/>
|
||||
<StatusBarUnderlay />
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const MARGIN = 2
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: '#fff',
|
||||
alignItems: 'stretch',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
text: {
|
||||
textAlign: 'center',
|
||||
},
|
||||
list: {
|
||||
marginTop: STATUS_BAR_HEIGHT,
|
||||
flex: 1,
|
||||
},
|
||||
columnWrapper: {
|
||||
flex: 1,
|
||||
flexDirection: 'row',
|
||||
marginLeft: -MARGIN,
|
||||
marginRight: -MARGIN,
|
||||
},
|
||||
image: {
|
||||
flex: 1,
|
||||
width: null,
|
||||
height: null,
|
||||
margin: MARGIN,
|
||||
backgroundColor: '#eee',
|
||||
},
|
||||
imageContainer: {
|
||||
flex: 1,
|
||||
alignItems: 'stretch',
|
||||
},
|
||||
})
|
||||
|
||||
export default ImageGrid
|
||||
@@ -0,0 +1,84 @@
|
||||
import React, { Component } from 'react'
|
||||
import { StyleSheet, View } from 'react-native'
|
||||
import SectionFlex from './SectionFlex'
|
||||
import FastImage from 'react-native-fast-image'
|
||||
import Section from './Section'
|
||||
import FeatureText from './FeatureText'
|
||||
import uuid from 'uuid/v4'
|
||||
import Button from './Button'
|
||||
import { createImageProgress } from 'react-native-image-progress'
|
||||
|
||||
const IMAGE_URL =
|
||||
'https://cdn-images-1.medium.com/max/1600/1*-CY5bU4OqiJRox7G00sftw.gif'
|
||||
|
||||
const Image = createImageProgress(FastImage)
|
||||
|
||||
class PreloadExample extends Component {
|
||||
state = {
|
||||
show: false,
|
||||
url: IMAGE_URL,
|
||||
}
|
||||
|
||||
bustCache = () => {
|
||||
const key = uuid()
|
||||
const bust = `?bust=${key}`
|
||||
// Preload images. This can be called anywhere.
|
||||
const url = IMAGE_URL + bust
|
||||
this.setState({
|
||||
url,
|
||||
show: false,
|
||||
})
|
||||
}
|
||||
|
||||
preload = () => {
|
||||
FastImage.preload([{ uri: this.state.url }])
|
||||
}
|
||||
|
||||
showImage = () => {
|
||||
this.setState({ show: true })
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View>
|
||||
<Section>
|
||||
<FeatureText text="• Preloading." />
|
||||
<FeatureText text="• Progress indication using react-native-image-progress." />
|
||||
</Section>
|
||||
<SectionFlex style={styles.section} onPress={this.props.onPressReload}>
|
||||
{this.state.show ? (
|
||||
<Image style={styles.image} source={{ uri: this.state.url }} />
|
||||
) : (
|
||||
<View style={styles.image} />
|
||||
)}
|
||||
<View style={{ flexDirection: 'row', marginHorizontal: 10 }}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Button text="Bust" onPress={this.bustCache} />
|
||||
</View>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Button text="Preload" onPress={this.preload} />
|
||||
</View>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Button text="Render" onPress={this.showImage} />
|
||||
</View>
|
||||
</View>
|
||||
</SectionFlex>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
section: {
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
},
|
||||
image: {
|
||||
backgroundColor: '#ddd',
|
||||
margin: 10,
|
||||
height: 100,
|
||||
width: 100,
|
||||
},
|
||||
})
|
||||
|
||||
export default PreloadExample
|
||||
@@ -0,0 +1,59 @@
|
||||
import React from 'react'
|
||||
import { PixelRatio, StyleSheet, View } from 'react-native'
|
||||
import withCacheBust from './withCacheBust'
|
||||
import FastImage from 'react-native-fast-image'
|
||||
import Section from './Section'
|
||||
import SectionFlex from './SectionFlex'
|
||||
import FeatureText from './FeatureText'
|
||||
|
||||
const getImageUrl = (id, width, height) =>
|
||||
`https://source.unsplash.com/${id}/${width}x${height}`
|
||||
const IMAGE_SIZE = 1024
|
||||
const IMAGE_SIZE_PX = PixelRatio.getPixelSizeForLayoutSize(IMAGE_SIZE)
|
||||
const IMAGE_URLS = [
|
||||
getImageUrl('x58soEovG_M', IMAGE_SIZE_PX, IMAGE_SIZE_PX),
|
||||
getImageUrl('yPI7myL5eWY', IMAGE_SIZE_PX, IMAGE_SIZE_PX),
|
||||
getImageUrl('S7VCcp6KCKE', IMAGE_SIZE, IMAGE_SIZE),
|
||||
]
|
||||
|
||||
const PriorityExample = ({ onPressReload, bust }) => (
|
||||
<View>
|
||||
<Section>
|
||||
<FeatureText text="• Prioritize images (low, normal, high)." />
|
||||
</Section>
|
||||
<SectionFlex onPress={onPressReload}>
|
||||
<FastImage
|
||||
style={styles.image}
|
||||
source={{
|
||||
uri: IMAGE_URLS[0] + bust,
|
||||
priority: FastImage.priority.low,
|
||||
}}
|
||||
/>
|
||||
<FastImage
|
||||
style={styles.image}
|
||||
source={{
|
||||
uri: IMAGE_URLS[1] + bust,
|
||||
priority: FastImage.priority.normal,
|
||||
}}
|
||||
/>
|
||||
<FastImage
|
||||
style={styles.image}
|
||||
source={{
|
||||
uri: IMAGE_URLS[2] + bust,
|
||||
priority: FastImage.priority.high,
|
||||
}}
|
||||
/>
|
||||
</SectionFlex>
|
||||
</View>
|
||||
)
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
image: {
|
||||
flex: 1,
|
||||
height: 100,
|
||||
backgroundColor: '#ddd',
|
||||
margin: 10,
|
||||
},
|
||||
})
|
||||
|
||||
export default withCacheBust(PriorityExample)
|
||||
@@ -0,0 +1,49 @@
|
||||
import React from 'react'
|
||||
import { StyleSheet, View } from 'react-native'
|
||||
import withCacheBust from './withCacheBust'
|
||||
import SectionFlex from './SectionFlex'
|
||||
import FastImage from 'react-native-fast-image'
|
||||
import Section from './Section'
|
||||
import FeatureText from './FeatureText'
|
||||
|
||||
const IMAGE_URL = 'https://media.giphy.com/media/GEsoqZDGVoisw/giphy.gif'
|
||||
|
||||
const getTestProgressCallbacks = label => ({
|
||||
onLoadStart: () => console.log(`${label} - onLoadStart`),
|
||||
onProgress: e =>
|
||||
console.log(
|
||||
`${label} - onProgress - ${e.nativeEvent.loaded / e.nativeEvent.total}`,
|
||||
),
|
||||
onLoad: e => console.log(`${label} - onLoad`, e.nativeEvent),
|
||||
onError: () => console.log(`${label} - onError`),
|
||||
onLoadEnd: () => console.log(`${label} - onLoadEnd`),
|
||||
})
|
||||
|
||||
const ProgressExample = ({ onPressReload, bust }) => (
|
||||
<View>
|
||||
<Section>
|
||||
<FeatureText text="• Progress callbacks." />
|
||||
</Section>
|
||||
<SectionFlex onPress={onPressReload}>
|
||||
<FastImage
|
||||
style={styles.image}
|
||||
source={{
|
||||
uri: IMAGE_URL + bust,
|
||||
}}
|
||||
{...getTestProgressCallbacks('ProgressExample')}
|
||||
/>
|
||||
</SectionFlex>
|
||||
</View>
|
||||
)
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
image: {
|
||||
height: 100,
|
||||
backgroundColor: '#ddd',
|
||||
margin: 20,
|
||||
width: 100,
|
||||
flex: 0,
|
||||
},
|
||||
})
|
||||
|
||||
export default withCacheBust(ProgressExample)
|
||||
@@ -0,0 +1,13 @@
|
||||
import React from 'react'
|
||||
import { StyleSheet, View } from 'react-native'
|
||||
|
||||
export default ({ children }) => <View style={styles.section}>{children}</View>
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
section: {
|
||||
marginTop: 10,
|
||||
marginBottom: 10,
|
||||
marginLeft: 40,
|
||||
marginRight: 40,
|
||||
},
|
||||
})
|
||||
@@ -0,0 +1,20 @@
|
||||
import React from 'react'
|
||||
import { StyleSheet, TouchableOpacity } from 'react-native'
|
||||
|
||||
export default ({ children, onPress, style }) => (
|
||||
<TouchableOpacity style={[styles.sectionFlex, style]} onPress={onPress}>
|
||||
{children}
|
||||
</TouchableOpacity>
|
||||
)
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
sectionFlex: {
|
||||
backgroundColor: '#eee',
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'center',
|
||||
marginTop: 10,
|
||||
marginBottom: 10,
|
||||
marginLeft: -10,
|
||||
marginRight: -10,
|
||||
},
|
||||
})
|
||||
@@ -0,0 +1,18 @@
|
||||
import React from 'react'
|
||||
import { Platform, StatusBar, StyleSheet, View } from 'react-native'
|
||||
|
||||
export const STATUS_BAR_HEIGHT =
|
||||
Platform.OS === 'ios' ? 20 : StatusBar.currentHeight
|
||||
|
||||
export default () => <View style={styles.statusBarUnderlay} />
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
statusBarUnderlay: {
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
height: STATUS_BAR_HEIGHT,
|
||||
backgroundColor: 'white',
|
||||
},
|
||||
})
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { Component } from 'react'
|
||||
import uuid from 'uuid/v4'
|
||||
|
||||
export default BaseComponent => {
|
||||
class WithCacheBust extends Component {
|
||||
state = { bust: '?bust' }
|
||||
|
||||
onPressReload = () => {
|
||||
// Force complete re-render and bust image cache.
|
||||
const key = uuid()
|
||||
const bust = `?bust=${key}`
|
||||
this.setState({ bust })
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<BaseComponent
|
||||
bust={this.state.bust}
|
||||
onPressReload={this.onPressReload}
|
||||
/>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
WithCacheBust.displayName = `withCacheBust${BaseComponent.displayName}`
|
||||
|
||||
return WithCacheBust
|
||||
}
|
||||
@@ -137,6 +137,8 @@ android {
|
||||
}
|
||||
|
||||
dependencies {
|
||||
compile project(':react-native-vector-icons')
|
||||
compile project(':react-native-fast-image')
|
||||
compile fileTree(dir: "libs", include: ["*.jar"])
|
||||
compile "com.android.support:appcompat-v7:23.0.1"
|
||||
compile "com.facebook.react:react-native:+" // From node_modules
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
+5
-1
@@ -3,6 +3,8 @@ package com.reactnativefastimageexample;
|
||||
import android.app.Application;
|
||||
|
||||
import com.facebook.react.ReactApplication;
|
||||
import com.oblador.vectoricons.VectorIconsPackage;
|
||||
import com.dylanvann.fastimage.FastImageViewPackage;
|
||||
import com.facebook.react.ReactNativeHost;
|
||||
import com.facebook.react.ReactPackage;
|
||||
import com.facebook.react.shell.MainReactPackage;
|
||||
@@ -22,7 +24,9 @@ public class MainApplication extends Application implements ReactApplication {
|
||||
@Override
|
||||
protected List<ReactPackage> getPackages() {
|
||||
return Arrays.<ReactPackage>asList(
|
||||
new MainReactPackage()
|
||||
new MainReactPackage(),
|
||||
new VectorIconsPackage(),
|
||||
new FastImageViewPackage()
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,3 +1,7 @@
|
||||
rootProject.name = 'ReactNativeFastImageExample'
|
||||
include ':react-native-vector-icons'
|
||||
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
|
||||
include ':react-native-fast-image'
|
||||
project(':react-native-fast-image').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fast-image/android')
|
||||
|
||||
include ':app'
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { AppRegistry } from 'react-native';
|
||||
import App from './App';
|
||||
import { AppRegistry } from 'react-native'
|
||||
import App from './FastImage/App'
|
||||
|
||||
AppRegistry.registerComponent('ReactNativeFastImageExample', () => App);
|
||||
AppRegistry.registerComponent('ReactNativeFastImageExample', () => App)
|
||||
|
||||
+124
-2
@@ -5,7 +5,6 @@
|
||||
};
|
||||
objectVersion = 46;
|
||||
objects = {
|
||||
|
||||
/* Begin PBXBuildFile section */
|
||||
00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; };
|
||||
00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; };
|
||||
@@ -37,6 +36,19 @@
|
||||
5E9157361DD0AC6A00FF2AA8 /* libRCTAnimation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */; };
|
||||
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
|
||||
ADBDB9381DFEBF1600ED6528 /* libRCTBlob.a in Frameworks */ = {isa = PBXBuildFile; fileRef = ADBDB9271DFEBF0700ED6528 /* libRCTBlob.a */; };
|
||||
F3FE2490DB454991A0CF4A5E /* libFastImage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 2CEBD220F74E4232B60A8532 /* libFastImage.a */; };
|
||||
55A6D0D7E5A14DA7A816EEAD /* libRNVectorIcons.a in Frameworks */ = {isa = PBXBuildFile; fileRef = D66D90A1527B4858B6B45720 /* libRNVectorIcons.a */; };
|
||||
440C0EA5B0A644DD813074E8 /* Entypo.ttf in Resources */ = {isa = PBXBuildFile; fileRef = E7E64EA250154C50BB4866A3 /* Entypo.ttf */; };
|
||||
9EEDCB82FFD249ABAC3DA84D /* EvilIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 859B081BAD2342F2A35E8E17 /* EvilIcons.ttf */; };
|
||||
5848590629754F4EBA2A3900 /* Feather.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 7DCFCBBB488D400CA319D2EB /* Feather.ttf */; };
|
||||
406DD35498324BCA8705BF36 /* FontAwesome.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 2F1D89E957BE4DC3B5F12D3F /* FontAwesome.ttf */; };
|
||||
887A09E098BE43C680259567 /* Foundation.ttf in Resources */ = {isa = PBXBuildFile; fileRef = DCB38B0881D84D9D807020B4 /* Foundation.ttf */; };
|
||||
C53FB5F6EDC64639864B6A9E /* Ionicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 64308C10C3D142E9886F32AE /* Ionicons.ttf */; };
|
||||
AB69B73E961F4F748FCF6C77 /* MaterialCommunityIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = BBE014A4E2974DE097C5F82D /* MaterialCommunityIcons.ttf */; };
|
||||
C830F93AFD0E44828407049D /* MaterialIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 4BD56E1000C54038A7679FB3 /* MaterialIcons.ttf */; };
|
||||
4A859EA07E27460E84189E75 /* Octicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 47121FF188B74280ADF44814 /* Octicons.ttf */; };
|
||||
BF76C32406E64C11A8F88839 /* SimpleLineIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = CF84827B3E0B4473A6D98CD8 /* SimpleLineIcons.ttf */; };
|
||||
E144163E63A541BBBC1C9757 /* Zocial.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 89F70D91F3214C9188DA080B /* Zocial.ttf */; };
|
||||
/* End PBXBuildFile section */
|
||||
|
||||
/* Begin PBXContainerItemProxy section */
|
||||
@@ -286,6 +298,21 @@
|
||||
78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = "../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj"; sourceTree = "<group>"; };
|
||||
832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = "../node_modules/react-native/Libraries/Text/RCTText.xcodeproj"; sourceTree = "<group>"; };
|
||||
ADBDB91F1DFEBF0600ED6528 /* RCTBlob.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTBlob.xcodeproj; path = "../node_modules/react-native/Libraries/Blob/RCTBlob.xcodeproj"; sourceTree = "<group>"; };
|
||||
633E06912F184278A517D8FA /* FastImage.xcodeproj */ = {isa = PBXFileReference; name = "FastImage.xcodeproj"; path = "../node_modules/react-native-fast-image/ios/FastImage.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
|
||||
2CEBD220F74E4232B60A8532 /* libFastImage.a */ = {isa = PBXFileReference; name = "libFastImage.a"; path = "libFastImage.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
|
||||
5B07421EB1E941269F1CFF5D /* RNVectorIcons.xcodeproj */ = {isa = PBXFileReference; name = "RNVectorIcons.xcodeproj"; path = "../node_modules/react-native-vector-icons/RNVectorIcons.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
|
||||
D66D90A1527B4858B6B45720 /* libRNVectorIcons.a */ = {isa = PBXFileReference; name = "libRNVectorIcons.a"; path = "libRNVectorIcons.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
|
||||
E7E64EA250154C50BB4866A3 /* Entypo.ttf */ = {isa = PBXFileReference; name = "Entypo.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Entypo.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
859B081BAD2342F2A35E8E17 /* EvilIcons.ttf */ = {isa = PBXFileReference; name = "EvilIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/EvilIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
7DCFCBBB488D400CA319D2EB /* Feather.ttf */ = {isa = PBXFileReference; name = "Feather.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Feather.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
2F1D89E957BE4DC3B5F12D3F /* FontAwesome.ttf */ = {isa = PBXFileReference; name = "FontAwesome.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
DCB38B0881D84D9D807020B4 /* Foundation.ttf */ = {isa = PBXFileReference; name = "Foundation.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Foundation.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
64308C10C3D142E9886F32AE /* Ionicons.ttf */ = {isa = PBXFileReference; name = "Ionicons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Ionicons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
BBE014A4E2974DE097C5F82D /* MaterialCommunityIcons.ttf */ = {isa = PBXFileReference; name = "MaterialCommunityIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/MaterialCommunityIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
4BD56E1000C54038A7679FB3 /* MaterialIcons.ttf */ = {isa = PBXFileReference; name = "MaterialIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/MaterialIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
47121FF188B74280ADF44814 /* Octicons.ttf */ = {isa = PBXFileReference; name = "Octicons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Octicons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
CF84827B3E0B4473A6D98CD8 /* SimpleLineIcons.ttf */ = {isa = PBXFileReference; name = "SimpleLineIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/SimpleLineIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
89F70D91F3214C9188DA080B /* Zocial.ttf */ = {isa = PBXFileReference; name = "Zocial.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Zocial.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
/* End PBXFileReference section */
|
||||
|
||||
/* Begin PBXFrameworksBuildPhase section */
|
||||
@@ -314,6 +341,8 @@
|
||||
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */,
|
||||
00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */,
|
||||
139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */,
|
||||
F3FE2490DB454991A0CF4A5E /* libFastImage.a in Frameworks */,
|
||||
55A6D0D7E5A14DA7A816EEAD /* libRNVectorIcons.a in Frameworks */,
|
||||
);
|
||||
runOnlyForDeploymentPostprocessing = 0;
|
||||
};
|
||||
@@ -491,6 +520,8 @@
|
||||
832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */,
|
||||
00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */,
|
||||
139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */,
|
||||
633E06912F184278A517D8FA /* FastImage.xcodeproj */,
|
||||
5B07421EB1E941269F1CFF5D /* RNVectorIcons.xcodeproj */,
|
||||
);
|
||||
name = Libraries;
|
||||
sourceTree = "<group>";
|
||||
@@ -512,6 +543,7 @@
|
||||
00E356EF1AD99517003FC87E /* ReactNativeFastImageExampleTests */,
|
||||
83CBBA001A601CBA00E9B192 /* Products */,
|
||||
2D16E6871FA4F8E400B85C8A /* Frameworks */,
|
||||
2AE6B21785B145579B8F652E /* Resources */,
|
||||
);
|
||||
indentWidth = 2;
|
||||
sourceTree = "<group>";
|
||||
@@ -538,6 +570,25 @@
|
||||
name = Products;
|
||||
sourceTree = "<group>";
|
||||
};
|
||||
2AE6B21785B145579B8F652E /* Resources */ = {
|
||||
isa = "PBXGroup";
|
||||
children = (
|
||||
E7E64EA250154C50BB4866A3 /* Entypo.ttf */,
|
||||
859B081BAD2342F2A35E8E17 /* EvilIcons.ttf */,
|
||||
7DCFCBBB488D400CA319D2EB /* Feather.ttf */,
|
||||
2F1D89E957BE4DC3B5F12D3F /* FontAwesome.ttf */,
|
||||
DCB38B0881D84D9D807020B4 /* Foundation.ttf */,
|
||||
64308C10C3D142E9886F32AE /* Ionicons.ttf */,
|
||||
BBE014A4E2974DE097C5F82D /* MaterialCommunityIcons.ttf */,
|
||||
4BD56E1000C54038A7679FB3 /* MaterialIcons.ttf */,
|
||||
47121FF188B74280ADF44814 /* Octicons.ttf */,
|
||||
CF84827B3E0B4473A6D98CD8 /* SimpleLineIcons.ttf */,
|
||||
89F70D91F3214C9188DA080B /* Zocial.ttf */,
|
||||
);
|
||||
name = Resources;
|
||||
sourceTree = "<group>";
|
||||
path = "";
|
||||
};
|
||||
/* End PBXGroup section */
|
||||
|
||||
/* Begin PBXNativeTarget section */
|
||||
@@ -619,7 +670,7 @@
|
||||
83CBB9F71A601CBA00E9B192 /* Project object */ = {
|
||||
isa = PBXProject;
|
||||
attributes = {
|
||||
LastUpgradeCheck = 0610;
|
||||
LastUpgradeCheck = 610;
|
||||
ORGANIZATIONNAME = Facebook;
|
||||
TargetAttributes = {
|
||||
00E356ED1AD99517003FC87E = {
|
||||
@@ -928,6 +979,17 @@
|
||||
files = (
|
||||
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
|
||||
13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */,
|
||||
440C0EA5B0A644DD813074E8 /* Entypo.ttf in Resources */,
|
||||
9EEDCB82FFD249ABAC3DA84D /* EvilIcons.ttf in Resources */,
|
||||
5848590629754F4EBA2A3900 /* Feather.ttf in Resources */,
|
||||
406DD35498324BCA8705BF36 /* FontAwesome.ttf in Resources */,
|
||||
887A09E098BE43C680259567 /* Foundation.ttf in Resources */,
|
||||
C53FB5F6EDC64639864B6A9E /* Ionicons.ttf in Resources */,
|
||||
AB69B73E961F4F748FCF6C77 /* MaterialCommunityIcons.ttf in Resources */,
|
||||
C830F93AFD0E44828407049D /* MaterialIcons.ttf in Resources */,
|
||||
4A859EA07E27460E84189E75 /* Octicons.ttf in Resources */,
|
||||
BF76C32406E64C11A8F88839 /* SimpleLineIcons.ttf in Resources */,
|
||||
E144163E63A541BBBC1C9757 /* Zocial.ttf in Resources */,
|
||||
);
|
||||
runOnlyForDeploymentPostprocessing = 0;
|
||||
};
|
||||
@@ -1059,6 +1121,16 @@
|
||||
);
|
||||
PRODUCT_NAME = "$(TARGET_NAME)";
|
||||
TEST_HOST = "$(BUILT_PRODUCTS_DIR)/ReactNativeFastImageExample.app/ReactNativeFastImageExample";
|
||||
LIBRARY_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
);
|
||||
HEADER_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
|
||||
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
|
||||
);
|
||||
};
|
||||
name = Debug;
|
||||
};
|
||||
@@ -1076,6 +1148,16 @@
|
||||
);
|
||||
PRODUCT_NAME = "$(TARGET_NAME)";
|
||||
TEST_HOST = "$(BUILT_PRODUCTS_DIR)/ReactNativeFastImageExample.app/ReactNativeFastImageExample";
|
||||
LIBRARY_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
);
|
||||
HEADER_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
|
||||
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
|
||||
);
|
||||
};
|
||||
name = Release;
|
||||
};
|
||||
@@ -1094,6 +1176,11 @@
|
||||
);
|
||||
PRODUCT_NAME = ReactNativeFastImageExample;
|
||||
VERSIONING_SYSTEM = "apple-generic";
|
||||
HEADER_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
|
||||
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
|
||||
);
|
||||
};
|
||||
name = Debug;
|
||||
};
|
||||
@@ -1111,6 +1198,11 @@
|
||||
);
|
||||
PRODUCT_NAME = ReactNativeFastImageExample;
|
||||
VERSIONING_SYSTEM = "apple-generic";
|
||||
HEADER_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
|
||||
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
|
||||
);
|
||||
};
|
||||
name = Release;
|
||||
};
|
||||
@@ -1137,6 +1229,16 @@
|
||||
SDKROOT = appletvos;
|
||||
TARGETED_DEVICE_FAMILY = 3;
|
||||
TVOS_DEPLOYMENT_TARGET = 9.2;
|
||||
LIBRARY_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
);
|
||||
HEADER_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
|
||||
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
|
||||
);
|
||||
};
|
||||
name = Debug;
|
||||
};
|
||||
@@ -1163,6 +1265,16 @@
|
||||
SDKROOT = appletvos;
|
||||
TARGETED_DEVICE_FAMILY = 3;
|
||||
TVOS_DEPLOYMENT_TARGET = 9.2;
|
||||
LIBRARY_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
);
|
||||
HEADER_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
|
||||
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
|
||||
);
|
||||
};
|
||||
name = Release;
|
||||
};
|
||||
@@ -1184,6 +1296,11 @@
|
||||
SDKROOT = appletvos;
|
||||
TEST_HOST = "$(BUILT_PRODUCTS_DIR)/ReactNativeFastImageExample-tvOS.app/ReactNativeFastImageExample-tvOS";
|
||||
TVOS_DEPLOYMENT_TARGET = 10.1;
|
||||
LIBRARY_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
);
|
||||
};
|
||||
name = Debug;
|
||||
};
|
||||
@@ -1205,6 +1322,11 @@
|
||||
SDKROOT = appletvos;
|
||||
TEST_HOST = "$(BUILT_PRODUCTS_DIR)/ReactNativeFastImageExample-tvOS.app/ReactNativeFastImageExample-tvOS";
|
||||
TVOS_DEPLOYMENT_TARGET = 10.1;
|
||||
LIBRARY_SEARCH_PATHS = (
|
||||
"$(inherited)",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
"\"$(SRCROOT)/$(TARGET_NAME)\"",
|
||||
);
|
||||
};
|
||||
name = Release;
|
||||
};
|
||||
|
||||
@@ -39,9 +39,8 @@
|
||||
<key>UIViewControllerBasedStatusBarAppearance</key>
|
||||
<false/>
|
||||
<key>NSLocationWhenInUseUsageDescription</key>
|
||||
<string></string>
|
||||
<string/>
|
||||
<key>NSAppTransportSecurity</key>
|
||||
<!--See http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/ -->
|
||||
<dict>
|
||||
<key>NSExceptionDomains</key>
|
||||
<dict>
|
||||
@@ -52,5 +51,19 @@
|
||||
</dict>
|
||||
</dict>
|
||||
</dict>
|
||||
<key>UIAppFonts</key>
|
||||
<array>
|
||||
<string>Entypo.ttf</string>
|
||||
<string>EvilIcons.ttf</string>
|
||||
<string>Feather.ttf</string>
|
||||
<string>FontAwesome.ttf</string>
|
||||
<string>Foundation.ttf</string>
|
||||
<string>Ionicons.ttf</string>
|
||||
<string>MaterialCommunityIcons.ttf</string>
|
||||
<string>MaterialIcons.ttf</string>
|
||||
<string>Octicons.ttf</string>
|
||||
<string>SimpleLineIcons.ttf</string>
|
||||
<string>Zocial.ttf</string>
|
||||
</array>
|
||||
</dict>
|
||||
</plist>
|
||||
|
||||
@@ -8,7 +8,13 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^16.3.0-alpha.1",
|
||||
"react-native": "0.54.2"
|
||||
"react-native": "0.54.2",
|
||||
"react-native-fast-image": "../react-native-fast-image-3.0.2.tgz",
|
||||
"react-native-image-progress": "^1.1.0",
|
||||
"react-native-vector-icons": "^4.5.0",
|
||||
"react-navigation": "^1.5.7",
|
||||
"react-timeout": "^1.1.1",
|
||||
"uuid": "^3.2.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-jest": "23.0.0-alpha.0",
|
||||
@@ -19,4 +25,4 @@
|
||||
"jest": {
|
||||
"preset": "react-native"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1457,6 +1457,10 @@ ci-info@^1.0.0:
|
||||
version "1.1.3"
|
||||
resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-1.1.3.tgz#710193264bb05c77b8c90d02f5aaf22216a667b2"
|
||||
|
||||
clamp@^1.0.1:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/clamp/-/clamp-1.0.1.tgz#66a0e64011816e37196828fdc8c8c147312c8634"
|
||||
|
||||
class-utils@^0.3.5:
|
||||
version "0.3.6"
|
||||
resolved "https://registry.yarnpkg.com/class-utils/-/class-utils-0.3.6.tgz#f93369ae8b9a7ce02fd41faad0ca83033190c463"
|
||||
@@ -1633,7 +1637,7 @@ core-util-is@1.0.2, core-util-is@~1.0.0:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
|
||||
|
||||
create-react-class@^15.6.3:
|
||||
create-react-class@^15.5.2, create-react-class@^15.6.3:
|
||||
version "15.6.3"
|
||||
resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036"
|
||||
dependencies:
|
||||
@@ -2462,6 +2466,10 @@ hoek@4.x.x:
|
||||
version "4.2.1"
|
||||
resolved "https://registry.yarnpkg.com/hoek/-/hoek-4.2.1.tgz#9634502aa12c445dd5a7c5734b572bb8738aacbb"
|
||||
|
||||
hoist-non-react-statics@^2.2.0, hoist-non-react-statics@^2.3.1:
|
||||
version "2.5.0"
|
||||
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.0.tgz#d2ca2dfc19c5a91c5a6615ce8e564ef0347e2a40"
|
||||
|
||||
home-or-tmp@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/home-or-tmp/-/home-or-tmp-2.0.0.tgz#e36c3f2d2cae7d746a857e38d18d5f32a7882db8"
|
||||
@@ -3404,7 +3412,7 @@ lodash@^3.5.0:
|
||||
version "3.10.1"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
|
||||
|
||||
lodash@^4.13.1, lodash@^4.14.0, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.6.1:
|
||||
lodash@^4.0.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.6.1:
|
||||
version "4.17.5"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
|
||||
|
||||
@@ -4027,6 +4035,12 @@ path-parse@^1.0.5:
|
||||
version "1.0.5"
|
||||
resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.5.tgz#3c1adf871ea9cd6c9431b6ea2bd74a0ff055c4c1"
|
||||
|
||||
path-to-regexp@^1.7.0:
|
||||
version "1.7.0"
|
||||
resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.7.0.tgz#59fde0f435badacba103a84e9d3bc64e96b9937d"
|
||||
dependencies:
|
||||
isarray "0.0.1"
|
||||
|
||||
path-type@^1.0.0:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/path-type/-/path-type-1.1.0.tgz#59c44f7ee491da704da415da5a4070ba4f8fe441"
|
||||
@@ -4135,7 +4149,7 @@ promise@^7.1.1:
|
||||
dependencies:
|
||||
asap "~2.0.3"
|
||||
|
||||
prop-types@^15.5.8, prop-types@^15.6.0:
|
||||
prop-types@^15.5.10, prop-types@^15.5.8, prop-types@^15.6.0:
|
||||
version "15.6.1"
|
||||
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.1.tgz#36644453564255ddda391191fb3a125cbdf654ca"
|
||||
dependencies:
|
||||
@@ -4198,6 +4212,58 @@ react-devtools-core@3.1.0:
|
||||
shell-quote "^1.6.1"
|
||||
ws "^2.0.3"
|
||||
|
||||
react-lifecycles-compat@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-1.0.2.tgz#551d8b1d156346e5fcf30ffac9b32ce3f78b8850"
|
||||
|
||||
react-native-dismiss-keyboard@1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/react-native-dismiss-keyboard/-/react-native-dismiss-keyboard-1.0.0.tgz#32886242b3f2317e121f3aeb9b0a585e2b879b49"
|
||||
|
||||
react-native-drawer-layout-polyfill@^1.3.2:
|
||||
version "1.3.2"
|
||||
resolved "https://registry.yarnpkg.com/react-native-drawer-layout-polyfill/-/react-native-drawer-layout-polyfill-1.3.2.tgz#192c84d7a5a6b8a6d2be2c7daa5e4164518d0cc7"
|
||||
dependencies:
|
||||
react-native-drawer-layout "1.3.2"
|
||||
|
||||
react-native-drawer-layout@1.3.2:
|
||||
version "1.3.2"
|
||||
resolved "https://registry.yarnpkg.com/react-native-drawer-layout/-/react-native-drawer-layout-1.3.2.tgz#b9740d7663a1dc4f88a61b9c6d93d2d948ea426e"
|
||||
dependencies:
|
||||
react-native-dismiss-keyboard "1.0.0"
|
||||
|
||||
react-native-fast-image@../react-native-fast-image-3.0.2.tgz:
|
||||
version "3.0.2"
|
||||
resolved "../react-native-fast-image-3.0.2.tgz#60d77feda1f52d527f7712e53dbc7f587ed503c2"
|
||||
dependencies:
|
||||
prop-types "^15.5.10"
|
||||
|
||||
react-native-image-progress@^1.1.0:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/react-native-image-progress/-/react-native-image-progress-1.1.0.tgz#737140d699fb3fb107ec70615736dfdc2eef7b35"
|
||||
dependencies:
|
||||
prop-types "^15.5.10"
|
||||
|
||||
react-native-safe-area-view@^0.7.0:
|
||||
version "0.7.0"
|
||||
resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.7.0.tgz#38f5ab9368d6ef9e5d18ab64212938af3ec39421"
|
||||
dependencies:
|
||||
hoist-non-react-statics "^2.3.1"
|
||||
|
||||
react-native-tab-view@^0.0.74:
|
||||
version "0.0.74"
|
||||
resolved "https://registry.yarnpkg.com/react-native-tab-view/-/react-native-tab-view-0.0.74.tgz#62c0c882d9232b461ce181d440d683b4f99d1bd8"
|
||||
dependencies:
|
||||
prop-types "^15.6.0"
|
||||
|
||||
react-native-vector-icons@^4.5.0:
|
||||
version "4.5.0"
|
||||
resolved "https://registry.yarnpkg.com/react-native-vector-icons/-/react-native-vector-icons-4.5.0.tgz#6b95619e64f62f05f579f74a01fe5640df95158b"
|
||||
dependencies:
|
||||
lodash "^4.0.0"
|
||||
prop-types "^15.5.10"
|
||||
yargs "^8.0.2"
|
||||
|
||||
react-native@0.54.2:
|
||||
version "0.54.2"
|
||||
resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.54.2.tgz#73786e7bf3f80b0b060ca0bfe5b192f9c2f253da"
|
||||
@@ -4261,6 +4327,19 @@ react-native@0.54.2:
|
||||
xmldoc "^0.4.0"
|
||||
yargs "^9.0.0"
|
||||
|
||||
react-navigation@^1.5.7:
|
||||
version "1.5.7"
|
||||
resolved "https://registry.yarnpkg.com/react-navigation/-/react-navigation-1.5.7.tgz#157556922f9900a6afc2129abf4853bbd8332a57"
|
||||
dependencies:
|
||||
clamp "^1.0.1"
|
||||
hoist-non-react-statics "^2.2.0"
|
||||
path-to-regexp "^1.7.0"
|
||||
prop-types "^15.5.10"
|
||||
react-lifecycles-compat "^1.0.2"
|
||||
react-native-drawer-layout-polyfill "^1.3.2"
|
||||
react-native-safe-area-view "^0.7.0"
|
||||
react-native-tab-view "^0.0.74"
|
||||
|
||||
react-proxy@^1.1.7:
|
||||
version "1.1.8"
|
||||
resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a"
|
||||
@@ -4276,6 +4355,14 @@ react-test-renderer@^16.3.0-alpha.1:
|
||||
object-assign "^4.1.1"
|
||||
prop-types "^15.6.0"
|
||||
|
||||
react-timeout@^1.1.1:
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/react-timeout/-/react-timeout-1.1.1.tgz#50e49d8c861e4b5745ce230182bdd279b82400ba"
|
||||
dependencies:
|
||||
create-react-class "^15.5.2"
|
||||
hoist-non-react-statics "^2.3.1"
|
||||
object-assign "^4.0.1"
|
||||
|
||||
react-timer-mixin@^0.13.2:
|
||||
version "0.13.3"
|
||||
resolved "https://registry.yarnpkg.com/react-timer-mixin/-/react-timer-mixin-0.13.3.tgz#0da8b9f807ec07dc3e854d082c737c65605b3d22"
|
||||
@@ -5179,7 +5266,7 @@ uuid@3.0.1:
|
||||
version "3.0.1"
|
||||
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.0.1.tgz#6544bba2dfda8c1cf17e629a3a305e2bb1fee6c1"
|
||||
|
||||
uuid@^3.0.0, uuid@^3.1.0:
|
||||
uuid@^3.0.0, uuid@^3.1.0, uuid@^3.2.1:
|
||||
version "3.2.1"
|
||||
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.2.1.tgz#12c528bb9d58d0b9265d9a2f6f0fe8be17ff1f14"
|
||||
|
||||
@@ -5418,6 +5505,24 @@ yargs@^10.0.3:
|
||||
y18n "^3.2.1"
|
||||
yargs-parser "^8.1.0"
|
||||
|
||||
yargs@^8.0.2:
|
||||
version "8.0.2"
|
||||
resolved "https://registry.yarnpkg.com/yargs/-/yargs-8.0.2.tgz#6299a9055b1cefc969ff7e79c1d918dceb22c360"
|
||||
dependencies:
|
||||
camelcase "^4.1.0"
|
||||
cliui "^3.2.0"
|
||||
decamelize "^1.1.1"
|
||||
get-caller-file "^1.0.1"
|
||||
os-locale "^2.0.0"
|
||||
read-pkg-up "^2.0.0"
|
||||
require-directory "^2.1.1"
|
||||
require-main-filename "^1.0.1"
|
||||
set-blocking "^2.0.0"
|
||||
string-width "^2.0.0"
|
||||
which-module "^2.0.0"
|
||||
y18n "^3.2.1"
|
||||
yargs-parser "^7.0.0"
|
||||
|
||||
yargs@^9.0.0:
|
||||
version "9.0.1"
|
||||
resolved "https://registry.yarnpkg.com/yargs/-/yargs-9.0.1.tgz#52acc23feecac34042078ee78c0c007f5085db4c"
|
||||
|
||||
Reference in New Issue
Block a user