1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
|
import React, { Component } from 'react'
import {
StyleSheet,
WebView,
View,
ActivityIndicator,
} from 'react-native'
import Modal from 'react-native-modal'
import Close from './close'
export default class WebViewModal extends Component {
render() {
return (
<Modal isVisible={!!this.props.url} style={styles.modal}>
<WebView
source={{uri: this.props.url || 'about:blank'}}
style={styles.webview}
startInLoadingState={true}
renderLoading={() => {
return (
<View style={styles.loadingContainer}>
<ActivityIndicator size="large" color="white" />
</View>
)
}}
/>
<Close onPress={this.props.onClose} />
</Modal>
)
}
}
const styles = StyleSheet.create({
modal: {
marginLeft: 0,
marginRight: 0,
marginBottom: 0,
marginTop: 0,
paddingTop: 60,
backgroundColor: 'black',
},
webview: {
flex: 1,
justifyContent: 'flex-start',
alignItems: 'flex-start',
},
loadingContainer: {
backgroundColor: 'black',
flex: 1,
height: '100%',
width: '100%',
justifyContent: 'center',
alignItems: 'center',
},
})
|