render() { const height = Math.abs(this.props.end-this.props.start) if (this.props.overlay.confirmation) { return <TouchableWithoutFeedback onPress={()=>this.props.actions.overlay.setConfirmationMessage(null)}> <Animated.View style={[styles.box, {height, bottom: this.state.bottom}]}> <Text style={[css.text, styles.text]}>{this.props.overlay.confirmation}</Text> </Animated.View> </TouchableWithoutFeedback>; } return null; }
render() { const { item: { text }, onLongPress, onPressOut, style, width } = this.props return ( <TouchableOpacity onLongPress={onLongPress} onPressOut={onPressOut} delayLongPress={200}> <Animated.View style={[s.item, style, { width }]}> <Text style={s.text}>{text}</Text> </Animated.View> </TouchableOpacity> ) }
export default function Header({ positionY, miniPos }) { const opacity = positionY.interpolate({ inputRange: [0, 50, miniPos], outputRange: [1, 0, 0] }) return ( <Animated.View style={{ ...styles.container, opacity }}> <ChevronDown style={styles.chevron} /> <Options style={styles.options} /> </Animated.View> ) }
render() { const { move } = this.state return ( <View style={styles.container}> {/* Combine the styles with move. Call getLayout() to convert x and y to screen coords */} <Animated.View style={[styles.box, move.getLayout()]}> <Text style={styles.title}>Animated 2</Text> <Text>Animation moves up using spring.</Text> </Animated.View> </View> ); }
render () { return ( <Animated.View style={Styles.container}> <TouchableOpacity style={Styles.leftButton} onPress={NavigationActions.pop}> <Icon name='ios-arrow-back' size={34} color={Colors.snow} /> </TouchableOpacity> <Image style={Styles.logo} source={Images.clearLogo} /> <View style={Styles.rightButton} /> </Animated.View> ) }
render () { return ( <Animated.View style={Styles.container}> <TouchableOpacity style={Styles.leftButton} onPress={NavigationActions.pop}> <Icon name='ios-arrow-back' size={34} color={Colors.snow} /> </TouchableOpacity> <Image style={Styles.logo} source={Images.clearLogo} /> <View style={Styles.rightButton} /> </Animated.View> ) }