add example with menu inside the flatlist

examples/Demo.js

@@ -14,6 +14,7 @@ import TouchableExample from './TouchableExample';
 import MenuMethodsExample from './MenuMethodsExample';
 import CloseOnBackExample from './CloseOnBackExample';
 import FlatListExample from './FlatListExample';
+import InFlatListExample from './InFlatListExample';
 import PopoverExample from './PopoverExample';
 
 const demos = [
@@ -30,6 +31,7 @@ const demos = [
   // { Component: NavigatorExample, name: 'Example with react-native-router-flux' },
   { Component: CloseOnBackExample, name: 'Close on back button press example' },
   { Component: FlatListExample, name: 'Using FlatList' },
+  { Component: InFlatListExample, name: 'Menu in FlatList' },
   { Component: PopoverExample, name: 'Popover renderer' },
 ];
 

examples/InFlatListExample.js

@@ -0,0 +1,43 @@
+import React, { Component } from 'react';
+import { FlatList, Alert, StyleSheet } from 'react-native';
+import {
+  MenuProvider,
+  Menu,
+  MenuTrigger,
+  MenuOptions,
+  MenuOption,
+} from 'react-native-popup-menu';
+
+const data = new Array(100)
+  .fill(0)
+  .map((a, i) => ({ key: '' + i, value: 'item' + i }));
+
+export default class App extends Component {
+  render() {
+    return (
+      <MenuProvider style={styles.container}>
+        <FlatList
+          data={data}
+          renderItem={({ item }) => (
+            <Menu onSelect={value => Alert.alert(value)}>
+              <MenuTrigger text={'Select option ' + item.value} />
+              <MenuOptions>
+                <MenuOption value="A" text="A" />
+                <MenuOption value="B" text="B" />
+                <MenuOption value="C" text="C" />
+            </MenuOptions>
+          </Menu>
+          )}
+          style={{ height: 200 }}
+        />
+      </MenuProvider>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    paddingTop: 20,
+  },
+});