1 | import React from 'react';
|
2 | import { Text } from 'react-native';
|
3 | import { Font } from 'expo';
|
4 | import createIconSet from './vendor/react-native-vector-icons/lib/create-icon-set';
|
5 | import createIconButtonComponent from './vendor/react-native-vector-icons/lib/icon-button';
|
6 |
|
7 | export default function(glyphMap, fontName, expoAssetId) {
|
8 | const font = { [fontName]: expoAssetId };
|
9 | const RNVIconComponent = createIconSet(glyphMap, fontName);
|
10 |
|
11 | class Icon extends React.Component {
|
12 | static propTypes = RNVIconComponent.propTypes;
|
13 | static defaultProps = RNVIconComponent.defaultProps;
|
14 |
|
15 | state = {
|
16 | fontIsLoaded: Font.isLoaded(fontName),
|
17 | };
|
18 |
|
19 | async componentWillMount() {
|
20 | this._mounted = true;
|
21 | if (!this.state.fontIsLoaded) {
|
22 | await Font.loadAsync(font);
|
23 | this._mounted && this.setState({ fontIsLoaded: true });
|
24 | }
|
25 | }
|
26 |
|
27 | componentWillUnmount() {
|
28 | this._mounted = false;
|
29 | }
|
30 |
|
31 | setNativeProps(props) {
|
32 | if (this._icon) {
|
33 | this._icon.setNativeProps(props);
|
34 | }
|
35 | }
|
36 |
|
37 | render() {
|
38 | if (!this.state.fontIsLoaded) {
|
39 | return <Text />;
|
40 | }
|
41 |
|
42 | return (
|
43 | <RNVIconComponent
|
44 | ref={view => {
|
45 | this._icon = view;
|
46 | }}
|
47 | {...this.props}
|
48 | />
|
49 | );
|
50 | }
|
51 | }
|
52 |
|
53 | Icon.Button = createIconButtonComponent(Icon);
|
54 | Icon.glyphMap = glyphMap;
|
55 | Icon.font = font;
|
56 |
|
57 | return Icon;
|
58 | }
|