openOnPress property

ActionButton.js

@@ -209,10 +209,13 @@ export default class ActionButton extends Component {
             this.props.fixNativeFeedbackRadius
           )}
           activeOpacity={this.props.activeOpacity}
-          onLongPress={this.props.onLongPress}
+          onLongPress={() => {
+            this.props.onLongPress();
+            if (this.props.children && !this.props.openOnPress) this.animateButton();
+          }}
           onPress={() => {
             this.props.onPress();
-            if (this.props.children) this.animateButton();
+            if (this.props.children && (this.state.active || this.props.openOnPress)) this.animateButton();
           }}
           onPressIn={this.props.onPressIn}
           onPressOut={this.props.onPressOut}
@@ -337,7 +340,7 @@ export default class ActionButton extends Component {
 
     setTimeout(() => {
       if (this.mounted) {
-        this.setState({ active: false, resetToken: this.state.resetToken });  
+        this.setState({ active: false, resetToken: this.state.resetToken });
       }
     }, 250);
   }
@@ -376,6 +379,8 @@ ActionButton.propTypes = {
   onPress: PropTypes.func,
   onPressIn: PropTypes.func,
   onPressOut: PropTypes.func,
+  onLongPress: PropTypes.func,
+  openOnPress: PropTypes.bool,
   backdrop: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),
   degrees: PropTypes.number,
   verticalOrientation: PropTypes.oneOf(["up", "down"]),
@@ -405,6 +410,8 @@ ActionButton.defaultProps = {
   onPress: () => {},
   onPressIn: () => {},
   onPressOn: () => {},
+  onLongPress: () => {},
+  openOnPress: true,
   backdrop: false,
   degrees: 45,
   position: "right",

README.md

@@ -115,6 +115,7 @@ Take a look at [this gist](https://gist.github.com/mmazzarolo/cfd467436f9d110e94
 | onPressIn     | function      | null                | fires, before ActionButton is released
 | onPressOut    | function      | null                | fires, after ActionButton is released
 | onLongPress   | function      | null                | fires, when ActionButton is long pressed
+| openOnPress   | boolean       | true                | if true action buttons will open on press, if false they will open only on long press
 | renderIcon    | function      | null                | Function to render the component for ActionButton Icon. It is passed a boolean, `active`, which is true if the FAB has been expanded, and false if it is collapsed, allowing you to show a different icon when the ActionButton Items are expanded.
 | icon          | Component     | +                   | **Deprecated, use `renderIcon`** Custom component for ActionButton Icon
 | backdrop      | Component     | false               | Custom component for use as Backdrop (i.e. [BlurView](https://github.com/react-native-fellowship/react-native-blur#blur-view), [VibrancyView](https://github.com/react-native-fellowship/react-native-blur#vibrancy-view))

index.d.ts

@@ -28,6 +28,8 @@ export interface ActionButtonProperties extends ViewProperties {
   size?: number,
   autoInactive?: boolean,
   onPress?: () => void,
+  onLongPress?: () => void,
+  openOnPress?: boolean,
   renderIcon?: (active: boolean) => React.ReactElement<any>,
   backdrop?: boolean | object,
   degrees?: number,