vergnet/application-amicale
5
5
Fork 5
Code Issues Pull requests Releases Wiki Activity

Enabled collapsing header in login screen

Browse source
This commit is contained in:
Arnaud Vergnet 2020-04-22 11:18:43 +02:00
parent c9b8a6e2ca
commit 0c71a78b22
2 changed files with 18 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
src/navigation/MainTabNavigator.js
View file

@ -126,13 +126,7 @@ function ServicesStackComponent() {
{/* AMICALE */}
<ServicesStack.Screen
name="login"
component={LoginScreen}
options={{
title: i18n.t('screens.login'),
}}
/>
{createScreenCollapsibleStack("login", ServicesStack, LoginScreen, i18n.t('screens.login'))}
{createScreenCollapsibleStack("profile", ServicesStack, ProfileScreen, i18n.t('screens.profile'))}
{createScreenCollapsibleStack("club-list", ServicesStack, ClubListScreen, i18n.t('clubs.clubList'))}
<ServicesStack.Screen
@ -274,14 +268,7 @@ function HomeStackComponent(initialRoute: string | null, defaultData: { [key: st
}}
/>
{createScreenCollapsibleStack("self-menu", HomeStack, SelfMenuScreen, i18n.t('screens.menuSelf'), true, {...modalTransition})}
<HomeStack.Screen
name="login"
component={LoginScreen}
options={{
title: i18n.t('screens.login'),
}}
/>
{createScreenCollapsibleStack("login", HomeStack, LoginScreen, i18n.t('screens.login'))}
</HomeStack.Navigator>
);
}

20
src/screens/Amicale/LoginScreen.js
View file

@ -1,16 +1,20 @@
// @flow
import * as React from 'react';
import {KeyboardAvoidingView, ScrollView, StyleSheet, View} from "react-native";
import {Animated, KeyboardAvoidingView, StyleSheet, View} from "react-native";
import {Avatar, Button, Card, HelperText, Paragraph, TextInput, withTheme} from 'react-native-paper';
import ConnectionManager from "../../managers/ConnectionManager";
import i18n from 'i18n-js';
import ErrorDialog from "../../components/Dialogs/ErrorDialog";
import {CommonActions} from "@react-navigation/native";
import {withCollapsible} from "../../utils/withCollapsible";
import {Collapsible} from "react-navigation-collapsible";
import CustomTabBar from "../../components/Tabbar/CustomTabBar";
type Props = {
navigation: Object,
route: Object,
collapsibleStack: Collapsible,
}
type State = {
@ -248,6 +252,7 @@ class LoginScreen extends React.Component<Props, State> {
}
render() {
const {containerPaddingTop, scrollIndicatorInsetTop, onScroll} = this.props.collapsibleStack;
return (
<KeyboardAvoidingView
behavior={"height"}
@ -256,7 +261,14 @@ class LoginScreen extends React.Component<Props, State> {
enabled
keyboardVerticalOffset={100}
>
<ScrollView>
<Animated.ScrollView
onScroll={onScroll}
contentContainerStyle={{
paddingTop: containerPaddingTop,
paddingBottom: CustomTabBar.TAB_BAR_HEIGHT + 20
}}
scrollIndicatorInsets={{top: scrollIndicatorInsetTop}}
>
<View>
{this.getMainCard()}
{this.getSecondaryCard()}
@ -266,7 +278,7 @@ class LoginScreen extends React.Component<Props, State> {
onDismiss={this.hideErrorDialog}
errorCode={this.state.dialogError}
/>
</ScrollView>
</Animated.ScrollView>
</KeyboardAvoidingView>
);
}
@ -292,4 +304,4 @@ const styles = StyleSheet.create({
}
});
export default withTheme(LoginScreen);
export default withCollapsible(withTheme(LoginScreen));