android init

Author: alimek

Example/index.android.js

@@ -0,0 +1,56 @@
+/**
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ * @flow
+ */
+
+import React, { Component } from 'react';
+import {
+  AppRegistry,
+  Text,
+  View
+} from 'react-native';
+
+import ReactNativeTooltipMenu from 'react-native-tooltip-menu';
+
+class Example extends Component {
+  state = {
+    counter: 0,
+  };
+
+  render() {
+    return (
+      <View style={{ flex: 1, flexDirection: 'column', justifyContent: 'center', padding: 25 }}>
+        <View>
+          <Text style={{ textAlign: 'center' }}>This is example of react-native-tooltip-menu</Text>
+          <Text style={{ textAlign: 'center' }}>Clicked: {this.state.counter}</Text>
+        </View>
+        <ReactNativeTooltipMenu
+          buttonComponent={
+            <View
+              style={{
+                backgroundColor: 'purple',
+                padding: 10,
+                borderRadius: 25
+              }}
+            >
+              <Text style={{ color: 'white', flex: 1 }}>Click me to show tooltip!</Text>
+            </View>
+          }
+          items={[
+            {
+              label: 'Label #1',
+              onPress: () => this.setState({ counter: (this.state.counter + 1) })
+            },
+            {
+              label: 'Label #2',
+              onPress: () => this.setState({ counter: (this.state.counter + 1) }),
+            },
+          ]}
+        />
+      </View>
+    )
+  }
+}
+
+AppRegistry.registerComponent('Example', () => Example);

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-tooltip-menu",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "ReactNative component showing tooltip with menu items.",
   "main": "src/index.js",
   "scripts": {

src/index.js

@@ -91,7 +91,7 @@ class Tooltip extends React.Component {
       labelContainerStyle,
       labelStyle,
     } = this.props;
-    const { isModalOpen } = this.state;
+    const { isModalOpen, onRequestClose } = this.state;
     const widthStyle = mapWight(widthType);
 
     return (
@@ -104,7 +104,11 @@ class Tooltip extends React.Component {
             {buttonComponent}
           </TouchableOpacity>
         </View>
-        <Modal visible={isModalOpen} transparent>
+        <Modal
+          visible={isModalOpen}
+          transparent
+          onRequestClose={onRequestClose}
+        >
           <View style={[styles.overlay, overlayStyle]}>
             <TouchableOpacity activeOpacity={1} focusedOpacity={1} style={{ flex: 1 }} onPress={isModalOpen ? this.hideModal : this.openModal}>
               <View style={[styles.component]}>
@@ -167,10 +171,12 @@ Tooltip.propTypes = {
     'half',
     'full',
   ]),
+  onRequestClose: React.PropTypes.func,
 };
 
 Tooltip.defaultProps = {
   widthType: 'half',
+  onRequestClose: () => {},
 };
 
 export default Tooltip;