-
Notifications
You must be signed in to change notification settings - Fork 6
/
index.js
118 lines (108 loc) · 2.22 KB
/
index.js
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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
/**
* Copyright 2016 Reza (github.com/rghorbani).
*
* @flow
*/
'use strict';
const React = require('react');
const PropTypes = require('prop-types');
const { ActivityIndicator, StyleSheet } = require('react-native');
const {
Constants,
Colors,
Text,
ThemeManager,
View,
} = require('react-native-ui-lib');
class LoadingView extends React.Component {
static displayName = 'LoadingView';
static propTypes = {
...ActivityIndicator.propTypes,
/**
* Show the screen as an absolute overlay
*/
overlay: PropTypes.bool,
/**
* is loading
*/
loading: PropTypes.bool,
/**
* loading caption
*/
caption: PropTypes.string,
/**
* caption style
*/
captionStyle: PropTypes.oneOfType([
PropTypes.object,
PropTypes.number,
PropTypes.array,
]),
/**
* container style
*/
containerStyle: PropTypes.oneOfType([
PropTypes.object,
PropTypes.number,
PropTypes.array,
]),
};
static defaultProps = {
overlay: false,
loading: true,
color: Constants.isIOS ? Colors.dark60 : ThemeManager.primaryColor,
caption: 'Loading...',
};
render() {
const {
overlay,
caption,
captionStyle,
style,
containerStyle,
...props
} = this.props;
if (!this.props.loading) {
return null;
}
return (
<View
style={[
overlay ? styles.overlayContainer : styles.container,
styles.containerCommon,
containerStyle,
]}
>
<ActivityIndicator style={[styles.indicator, style]} {...props} />
{caption && (
<Text text70 style={[styles.caption, captionStyle]}>
{caption}
</Text>
)}
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
overlayContainer: {
...StyleSheet.absoluteFillObject,
backgroundColor: Colors.rgba(Colors.white, 0.85),
zIndex: 100,
},
containerCommon: {
alignItems: 'center',
justifyContent: 'center',
paddingHorizontal: 10,
},
indicator: {
transform: [{ scale: 1.5 }],
},
caption: {
marginTop: 15,
color: Colors.dark10,
},
});
module.exports = LoadingView;