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

Added spinner on first load

Browse source
This commit is contained in:
keplyx 2019-08-06 14:06:05 +02:00
parent 405f1769d3
commit c60fb5291c
3 changed files with 294 additions and 289 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
components/FetchedDataSectionList.js
View file

@ -2,7 +2,7 @@
import * as React from 'react';
import WebDataManager from "../utils/WebDataManager";
import {Container, H3, Tab, TabHeading, Tabs, Text} from "native-base";
import {Container, H3, Spinner, Tab, TabHeading, Tabs, Text} from "native-base";
import CustomHeader from "./CustomHeader";
import {RefreshControl, SectionList, View} from "react-native";
import CustomMaterialIcon from "./CustomMaterialIcon";
@ -152,10 +152,11 @@ export default class FetchedDataSectionList extends React.Component<Props, State
* No need to be overridden, has good defaults.
*
* @param text
* @param isSpinner
* @param icon
* @return {*}
*/
getEmptyRenderItem(text: string, icon: string) {
getEmptyRenderItem(text: string, isSpinner: boolean, icon: string) {
return (
<View>
<View style={{
@ -165,11 +166,14 @@ export default class FetchedDataSectionList extends React.Component<Props, State
height: 100,
marginBottom: 20
}}>
{isSpinner ?
<Spinner/>
:
<CustomMaterialIcon
icon={icon}
fontSize={100}
width={100}
color={ThemeManager.getCurrentThemeVariables().fetchedDataSectionListErrorText}/>
color={ThemeManager.getCurrentThemeVariables().fetchedDataSectionListErrorText}/>}
</View>
<H3 style={{
@ -209,6 +213,7 @@ export default class FetchedDataSectionList extends React.Component<Props, State
text: this.state.refreshing ?
i18n.t('general.loading') :
i18n.t('general.networkError'),
isSpinner: this.state.refreshing,
icon: this.state.refreshing ?
'refresh' :
'access-point-network-off'
@ -256,7 +261,7 @@ export default class FetchedDataSectionList extends React.Component<Props, State
}
renderItem={({item, section}) =>
isEmpty ?
this.getEmptyRenderItem(item.text, item.icon) :
this.getEmptyRenderItem(item.text, item.isSpinner, item.icon) :
this.getRenderItem(item, section, dataset)
}
style={{minHeight: 300, width: '100%'}}

4
native-base-theme/variables/platform.js
View file

@ -2,7 +2,7 @@
import color from "color";
import { Platform, Dimensions, PixelRatio } from "react-native";
import {Dimensions, PixelRatio, Platform} from "react-native";
const deviceHeight = Dimensions.get("window").height;
const deviceWidth = Dimensions.get("window").width;
@ -226,7 +226,7 @@ export default {
segmentBorderColorMain: platform === "ios" ? "#a7a6ab" : "#3F51B5",
// Spinner
defaultSpinnerColor: "#45D56E",
defaultSpinnerColor: "#e42612",
inverseSpinnerColor: "#1A191B",
// Tab

4
native-base-theme/variables/platformDark.js
View file

@ -2,7 +2,7 @@
import color from "color";
import { Platform, Dimensions, PixelRatio } from "react-native";
import {Dimensions, PixelRatio, Platform} from "react-native";
const deviceHeight = Dimensions.get("window").height;
const deviceWidth = Dimensions.get("window").width;
@ -226,7 +226,7 @@ export default {
segmentBorderColorMain: platform === "ios" ? "#a7a6ab" : "#3F51B5",
// Spinner
defaultSpinnerColor: "#45D56E",
defaultSpinnerColor: "#e42612",
inverseSpinnerColor: "#1A191B",
// Tab