React Primitives
Tyson Cadenhead
React Primitives
"Learn Once. Build Anywhere."
React Web
React Native
React Sketch
...
React Primitives
<View>
<Text>
<Touchable>
import * as React from 'react';
import { Touchable, View, Text } from 'react-primitives';
const Button = (props) => (
<Touchable onPress={props.onPress}>
<View>
<Text>{props.children}</Text>
</View>
</Touchable>
);
<Image>
import * as React from 'react';
import { Image } from 'react-primitives';
const MyImage = () => (
<Image source={{
uri: 'http://facetheforce.today/random/400?r=1'
}} />
);
<StyleSheet>
import * as React from 'react';
import { StyleSheet, View } from 'react-primitives';
const MyImage = () => (
<View style={styles.blueSquare} />
);
const styles = StyleSheet.create({
blueSquare: {
backgroundColor: 'blue',
width: 400,
height: 400
}
});
<Animated>
class MyClass {
constructor (props) {
super(props);
this.state = {
anim: new Animated.Value(0);
};
}
componentDidMount () {
Animated.timing(this.state.anim, {
toValue: 100
}).start();
}
render () {
return (
<Animated.View style={{
left: this.state.anim,
width: 200,
height: 200,
backgroundColor: '#CCCCCC'
}}>
</Animated.View>
);
}
}
<End>
@tysoncadenhead
React Primitives
By tysoncadenhead
React Primitives
Create sharable components.
- 1,051