Rendering HTML Webview solution for both IOS and Android

How to / Third Party Tooling
1

This is a post of links and code snippets to create a Webview that works for IOS and Android. The problem is that testing Webviews locally work, but once you get into a production setting, it crashes on the Android platform. After days trying to figure out a solution for our in-house problem, I got something to work. I hope this helps out.

This following are sites I used:

ActivityIndicator is part of react-natve.
Markdown is part of 'react-native-markdown-renderer.

I’m requiring two different files, one for ios and one, with markdown, for android. You need to add in special indicators for the text to render as it would be for html.

render() {
    if (Platform.OS === 'ios) {
      return (
        <SafeAreaView style={{ flex: 1, overflow: 'hidden' }}>
          <WebView
            style={{ flexDirection: 'column', opacity: 0.99 }}
            originWhitelist={['*']}
            source={iosPolicy}
            startInLoadingState
            renderLoading={() => {
              return (
                <ActivityIndicator
                  color="black"
                  size="large"
                  style={{ position: 'absolute', left: 0, right: 0, bottom: 0, top: 0 }}
                />
              );
            }}
          />
        </SafeAreaView>
      );
    }

    return (
      <ScrollView>
        <Markdown>{this.state.androidPolicy}</Markdown>
      </ScrollView>
    );
  }

I hope this helps everyone out.