diff --git a/docs/next/toastandroid.html b/docs/next/toastandroid.html index 6b4cad3d224..fe5a076de77 100644 --- a/docs/next/toastandroid.html +++ b/docs/next/toastandroid.html @@ -41,7 +41,9 @@

There is also a function showWithGravity to specify the layout gravity. May be ToastAndroid.TOP, ToastAndroid.BOTTOM, ToastAndroid.CENTER.

The 'showWithGravityAndOffset' function adds on the ability to specify offset These offset values will translate to pixels.

Basic usage:

-
ToastAndroid.show('A pikachu appeared nearby !', ToastAndroid.SHORT);
+
import { ToastAndroid } from 'react-native'; 
+
+ToastAndroid.show('A pikachu appeared nearby !', ToastAndroid.SHORT);
 ToastAndroid.showWithGravity(
   'All Your Base Are Belong To Us',
   ToastAndroid.SHORT,
@@ -55,6 +57,66 @@ ToastAndroid.showWithGravityAndOffset(
   50
 );
 

+
Advanced usage:

+
The ToastAndroid API is imperative and this might present itself as an issue, but there is actually a way(hack)
+to expose a declarative component from it. See an example below:

+
import React, { Component } from 'react';
+import {
+  View,
+  Button,
+  ToastAndroid,
+} from 'react-native';
+
+// a component that calls the imperative ToastAndroid API
+const Toast = (props) => {
+  if (props.visible) {
+    ToastAndroid.showWithGravityAndOffset(
+      props.message,
+      ToastAndroid.LONG,
+      ToastAndroid.BOTTOM,
+      25,
+      50
+    );
+    return null;
+  }
+  return null;
+};
+
+class App extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      visible: false,
+    };
+  }
+
+  handleButtonPress = () => {
+    this.setState({
+        visible: true,
+    }, () => {
+      this.hideToast();
+    });
+  };
+
+  hideToast = () => {
+    this.setState({
+      visible: false
+    })
+  }
+
+  render() {
+    return (
+      <View style={styles.container}>
+        <Toast
+          visible={this.state.visible}
+          message="Example"
+        />
+        <Button title="Toggle Modal" onPress={this.handleButtonPress} />
+      </View>
+    );
+  }
+}
+

 
Methods