react-native-modalize-webview

React Native modal component that brings swipe to dismiss to WebView.

Getting started

$ npm install react-native-modalize-webview --save

Usage

Import ModalizeWebView and use it like the regular Modalize component. Provide WebView props via webViewProps to customize the displayed web page.

import {ModalizeWebView} from 'react-native-modalize-webview'

function MyComponent() {
  const modalizeRef = useRef(null)

  const handleOpen = useCallback(() => {
    if (modalizeRef.current) {
      modalizeRef.current.open()
    }
  }, [])

  return (
    <>
      <TouchableOpacity onPress={handleOpen}>
        <Text>Open the modal</Text>
      </TouchableOpacity>

      <ModalizeWebView
        ref={modalizeRef}
        handlePosition="inside"
        webViewProps={{
          source: {
            uri: 'https://facebook.github.io/react-native/',
          },
        }}
      />
    </>
  )
}

Props

• Inherited Modalize props...

• webViewProps

• anchorOffset

---

Reference

Props

webViewProps

Configures the underlying WebView component.

Type	Required
WebViewProps	Yes

anchorOffset

Specifies extra offset from top on scroll to an anchor link. Defaults to 16.

Type	Required
number	No

License

MIT License © Alka, Inc