mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2025-10-16 12:05:41 +00:00
* add 'sketch' and 'vr' as platforms to react-primitives * Update index.d.ts * fixed lint warnings * added test
91 lines
2.2 KiB
TypeScript
91 lines
2.2 KiB
TypeScript
import * as React from 'react';
|
|
import {
|
|
Animated,
|
|
Dimensions,
|
|
Easing,
|
|
Image,
|
|
PixelRatio,
|
|
Platform,
|
|
Text,
|
|
Touchable,
|
|
View,
|
|
StyleSheet
|
|
} from 'react-primitives';
|
|
|
|
const { Image: AnimatedImage } = Animated;
|
|
|
|
const { width, height } = Dimensions.get('window');
|
|
const { width: screenWidth, height: screenHeight } = Dimensions.get('screen');
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
height: screenHeight
|
|
},
|
|
nav: {
|
|
width: screenWidth,
|
|
height: 20
|
|
},
|
|
image: {
|
|
width,
|
|
height: 100
|
|
},
|
|
text: {
|
|
fontSize: 14 * PixelRatio.get()
|
|
}
|
|
});
|
|
|
|
interface State {
|
|
opacity: Animated.Value;
|
|
}
|
|
|
|
export default class Component extends React.Component<{}, State> {
|
|
state: State = {
|
|
opacity: new Animated.Value(0)
|
|
};
|
|
|
|
componentDidMount() {
|
|
Animated.timing(this.state.opacity, {
|
|
toValue: 1,
|
|
duration: 10000,
|
|
easing: Easing.cubic
|
|
}).start();
|
|
if (Platform.OS === 'sketch') {
|
|
console.log('The Platform is sketch');
|
|
}
|
|
}
|
|
|
|
render() {
|
|
const {
|
|
state: { opacity }
|
|
} = this;
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<View style={styles.nav}>
|
|
<Text>My Awesome App!</Text>
|
|
</View>
|
|
<AnimatedImage
|
|
style={[styles.image, { opacity }]}
|
|
source={{ uri: 'source' }}
|
|
/>
|
|
<Image style={styles.image} source={{ uri: 'source' }} />
|
|
<Text style={styles.text}>Hii</Text>
|
|
{Platform.OS === 'ios' && (
|
|
<View>
|
|
<Text>IOS Specific Text!</Text>
|
|
</View>
|
|
)}
|
|
<Touchable onPress={() => undefined}>
|
|
<Text>Touch me!</Text>
|
|
</Touchable>
|
|
<View>
|
|
<Text>Helloooooo</Text>
|
|
<Touchable>
|
|
<Text>Touch me too!</Text>
|
|
</Touchable>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
}
|