How to use

Ripple

function

in

Touchable

_renderRideShareButton() {
  return (
   <View>
    <Touchable
     background={Touchable.Ripple('#ccc')}
     onPress={this._toggleRides}>
     <View style={styles.getRide}>
      <Text style={styles.getRideLabel}>Taking an Uber or Lyft?</Text>
      <Ionicons
       name="ios-arrow-down"
       size={35}
       style={[
        styles.getRideIcon,
        this.state.showRideOptions && styles.flip,
       ]}
      />
     </View>
    </Touchable>
   </View>
  );
 }

render() {
  return (
   <Touchable
    background={Touchable.Ripple('#ccc', false)}
    onPress={this._handlePress}>
    <View style={styles.getDirections}>
     <View style={styles.addressContainer}>
      <Text style={styles.venueName}>The Armory</Text>
      <Text style={styles.venueAddress}>
       128 NW Eleventh Ave.{'\n'}Portland, OR 97209
      </Text>
     </View>
     <View style={styles.directionsIcon}>
      <Image source={Images.directionsIcon} />
      <Text style={styles.directionsLabel}>Directions</Text>
     </View>
    </View>
   </Touchable>
  );
 }

_maybeRenderRideOptions() {
  return (
   <View
    style={[
     styles.rideOptions,
     this.state.showRideOptions && { height: 170 },
    ]}>
    <Touchable
     foreground={Touchable.Ripple('#ccc', false)}
     onPress={this._openLyftAsync}>
     <Image style={styles.rideButton} source={Images.lyftButton} />
    </Touchable>
    <Touchable
     foreground={Touchable.Ripple('#ccc', false)}
     onPress={this._openUberAsync}>
     <Image style={styles.rideButton} source={Images.uberButton} />
    </Touchable>
   </View>
  );
 }

<Touchable
 style={styles.touchable}
 background={Touchable.Ripple('#ccc', false)}
 fallback={TouchableWithoutFeedback}
 onPress={this._handlePressCard}>

subtitle={'Description of each video will appear here. gfvgbhfghfghfghfhfhfghfghfhfghhhfhfghfg'}
style={styles.option}
background={Touchable.Ripple('#ccc', false)}
onPress={() => {
  this.props.navigation.navigate('VideoScreen', {

fallback={TouchableOpacity}
style={styles.dayToggleButton}
background={Touchable.Ripple(Colors.purpleRipple, false)}
onPress={() => onPressDay(0)}
hitSlop={buttonHitSlop}>
style={styles.dayToggleButton}
fallback={TouchableOpacity}
background={Touchable.Ripple(Colors.purpleRipple, false)}
onPress={() => onPressDay(1)}
hitSlop={buttonHitSlop}>

<Touchable
 fallback={TouchableWithoutFeedback}
 background={Touchable.Ripple(Colors.purpleRipple, true)}
 style={styles.tab}
 key={route.key}

<View style={containerStyles}>
 <Touchable
  foreground={Touchable.Ripple('#dadada', true)}
  fallback={TouchableWithoutFeedback}
  onPress={this._handlePressCard}>