forked from vergnet/application-amicale
Added more animations
This commit is contained in:
parent
96394972eb
commit
26cf3cf2c3
2 changed files with 34 additions and 7 deletions
|
@ -6,6 +6,7 @@ import {StyleSheet, View} from "react-native";
|
||||||
import {MaterialCommunityIcons} from "@expo/vector-icons";
|
import {MaterialCommunityIcons} from "@expo/vector-icons";
|
||||||
import i18n from 'i18n-js';
|
import i18n from 'i18n-js';
|
||||||
import {ERROR_TYPE} from "../../utils/WebData";
|
import {ERROR_TYPE} from "../../utils/WebData";
|
||||||
|
import * as Animatable from 'react-native-animatable';
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
navigation: Object,
|
navigation: Object,
|
||||||
|
@ -124,10 +125,15 @@ class ErrorView extends React.PureComponent<Props, State> {
|
||||||
render() {
|
render() {
|
||||||
this.generateMessage();
|
this.generateMessage();
|
||||||
return (
|
return (
|
||||||
<View style={{
|
<Animatable.View
|
||||||
|
style={{
|
||||||
...styles.outer,
|
...styles.outer,
|
||||||
backgroundColor: this.colors.background
|
backgroundColor: this.colors.background
|
||||||
}}>
|
}}
|
||||||
|
animation={"zoomIn"}
|
||||||
|
duration={200}
|
||||||
|
useNativeDriver
|
||||||
|
>
|
||||||
<View style={styles.inner}>
|
<View style={styles.inner}>
|
||||||
<View style={styles.iconContainer}>
|
<View style={styles.iconContainer}>
|
||||||
<MaterialCommunityIcons
|
<MaterialCommunityIcons
|
||||||
|
@ -147,7 +153,7 @@ class ErrorView extends React.PureComponent<Props, State> {
|
||||||
: this.getRetryButton())
|
: this.getRetryButton())
|
||||||
: null}
|
: null}
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</Animatable.View>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,6 +8,7 @@ import {Animated, RefreshControl, View} from "react-native";
|
||||||
import ErrorView from "../Custom/ErrorView";
|
import ErrorView from "../Custom/ErrorView";
|
||||||
import BasicLoadingScreen from "../Custom/BasicLoadingScreen";
|
import BasicLoadingScreen from "../Custom/BasicLoadingScreen";
|
||||||
import {withCollapsible} from "../../utils/withCollapsible";
|
import {withCollapsible} from "../../utils/withCollapsible";
|
||||||
|
import * as Animatable from 'react-native-animatable';
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
navigation: Object,
|
navigation: Object,
|
||||||
|
@ -174,9 +175,29 @@ class WebSectionList extends React.PureComponent<Props, State> {
|
||||||
index
|
index
|
||||||
});
|
});
|
||||||
|
|
||||||
onListScroll= (event) => {
|
renderSectionHeader = (data: Object) => {
|
||||||
|
return (
|
||||||
|
<Animatable.View
|
||||||
|
animation={"fadeInUp"}
|
||||||
|
duration={500}
|
||||||
|
useNativeDriver
|
||||||
|
>
|
||||||
|
{this.props.renderSectionHeader(data)}
|
||||||
|
</Animatable.View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
};
|
renderItem = (data: Object) => {
|
||||||
|
return (
|
||||||
|
<Animatable.View
|
||||||
|
animation={"fadeInUp"}
|
||||||
|
duration={500}
|
||||||
|
useNativeDriver
|
||||||
|
>
|
||||||
|
{this.props.renderItem(data)}
|
||||||
|
</Animatable.View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
let dataset = [];
|
let dataset = [];
|
||||||
|
@ -198,9 +219,9 @@ class WebSectionList extends React.PureComponent<Props, State> {
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
//$FlowFixMe
|
//$FlowFixMe
|
||||||
renderSectionHeader={shouldRenderHeader ? this.props.renderSectionHeader : this.getEmptySectionHeader}
|
renderSectionHeader={shouldRenderHeader ? this.renderSectionHeader : this.getEmptySectionHeader}
|
||||||
//$FlowFixMe
|
//$FlowFixMe
|
||||||
renderItem={this.props.renderItem}
|
renderItem={this.renderItem}
|
||||||
stickySectionHeadersEnabled={this.props.stickyHeader}
|
stickySectionHeadersEnabled={this.props.stickyHeader}
|
||||||
style={{minHeight: '100%'}}
|
style={{minHeight: '100%'}}
|
||||||
ListEmptyComponent={this.state.refreshing
|
ListEmptyComponent={this.state.refreshing
|
||||||
|
|
Loading…
Reference in a new issue