diff --git a/src/views/BorderlessButton.js b/src/views/BorderlessButton.js
new file mode 100644
index 0000000..bd1578d
--- /dev/null
+++ b/src/views/BorderlessButton.js
@@ -0,0 +1,53 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Animated, Platform } from 'react-native';
+import { BaseButton } from 'react-native-gesture-handler';
+
+const AnimatedBaseButton = Animated.createAnimatedComponent(BaseButton);
+
+export default class BorderlessButton extends React.Component {
+ static propTypes = {
+ ...BaseButton.propTypes,
+ borderless: PropTypes.bool,
+ };
+
+ static defaultProps = {
+ activeOpacity: 0.3,
+ borderless: true,
+ };
+
+ constructor(props) {
+ super(props);
+ this._opacity = new Animated.Value(1);
+ }
+
+ _onActiveStateChange = active => {
+ if (Platform.OS !== 'android') {
+ Animated.spring(this._opacity, {
+ stiffness: 1000,
+ damping: 500,
+ mass: 3,
+ overshootClamping: true,
+ restDisplacementThreshold: 0.01,
+ restSpeedThreshold: 0.01,
+ toValue: active ? this.props.activeOpacity : 1,
+ }).start();
+ }
+
+ this.props.onActiveStateChange && this.props.onActiveStateChange(active);
+ };
+
+ render() {
+ const { children, style, ...rest } = this.props;
+
+ return (
+
+ {children}
+
+ );
+ }
+}
diff --git a/src/views/TouchableItem.js b/src/views/TouchableItem.js
index c7a19b7..eca8f51 100644
--- a/src/views/TouchableItem.js
+++ b/src/views/TouchableItem.js
@@ -15,6 +15,8 @@ import {
View,
} from 'react-native';
+import BorderlessButton from './BorderlessButton';
+
const ANDROID_VERSION_LOLLIPOP = 21;
export default class TouchableItem extends React.Component {
@@ -46,13 +48,27 @@ export default class TouchableItem extends React.Component {
this.props.borderless
)}
>
- {React.Children.only(this.props.children)}
+
+ {React.Children.only(this.props.children)}
+
);
+ } else if (Platform.OS === 'ios') {
+ return (
+
+ {this.props.children}
+
+ );
+ } else {
+ return (
+
+ {this.props.children}
+
+ );
}
-
- return (
- {this.props.children}
- );
}
}