lpitault/application-amicale
1
0
Fork 0
forked from vergnet/application-amicale
Code Issues Pull requests Releases Wiki Activity

Added refresh button in planex screen

Browse source
This commit is contained in:
keplyx 2019-08-06 19:38:48 +02:00
parent a663d8256a
commit d9a68b021c
1 changed files with 44 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

55
screens/PlanexScreen.js
View file

@ -1,10 +1,13 @@
// @flow // @flow
import * as React from 'react'; import * as React from 'react';
import {View} from 'react-native'; import {Platform, View} from 'react-native';
import {Container, Content, Spinner} from 'native-base'; import {Container, Right, Spinner} from 'native-base';
import CustomHeader from "../components/CustomHeader"; import CustomHeader from "../components/CustomHeader";
import WebView from "react-native-webview"; import WebView from "react-native-webview";
import Touchable from "react-native-platform-touchable";
import CustomMaterialIcon from "../components/CustomMaterialIcon";
import ThemeManager from "../utils/ThemeManager";
type Props = { type Props = {
navigation: Object, navigation: Object,
@ -26,23 +29,53 @@ export default class PlanningScreen extends React.Component<Props, State> {
isFinishedLoading: false, isFinishedLoading: false,
}; };
webview: WebView;
getRefreshButton() {
return (
<Right>
<Touchable
style={{padding: 6}}
onPress={() => this.refreshWebview()}>
<CustomMaterialIcon
color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
icon="refresh"/>
</Touchable>
</Right>
);
};
refreshWebview() {
this.setState({isFinishedLoading: false});
this.webview.reload();
}
render() { render() {
const nav = this.props.navigation; const nav = this.props.navigation;
return ( return (
<Container> <Container>
<CustomHeader navigation={nav} title={'Planex'}/> <CustomHeader navigation={nav} title={'Planex'} rightMenu={this.getRefreshButton()}/>
<WebView <WebView
ref={ref => (this.webview = ref)}
source={{uri: PLANEX_URL}} source={{uri: PLANEX_URL}}
style={{width: this.state.isFinishedLoading ? '100%' : 0}} style={{
onLoadEnd={() => { width: '100%',
this.setState({isFinishedLoading: true}) height: '100%',
}} }}
/> startInLoadingState={true}
{this.state.isFinishedLoading ? renderLoading={() =>
<View/> : <View style={{
<Content> backgroundColor: ThemeManager.getCurrentThemeVariables().containerBgColor,
width: '100%',
height: '100%',
flex: 1,
alignItems: 'center',
justifyContent: 'center'
}}>
<Spinner/> <Spinner/>
</Content>} </View>
}
/>
</Container> </Container>
); );
} }