diff --git a/src/Components/Languages/languagesHeader.js b/src/Components/Languages/languagesHeader.js new file mode 100644 index 0000000..de01dec --- /dev/null +++ b/src/Components/Languages/languagesHeader.js @@ -0,0 +1,54 @@ +import React from "react" + +import { View, StyleSheet, Text, TouchableOpacity } from "react-native" +import { Icon } from "react-native-elements" + +const languagesHeader = props => { + return ( + + + { + const { navigation } = props + navigation.navigate("SettingsScreen") + }} + hitSlop={{ top: 20, bottom: 20, left: 20, right: 20 }} + > + + + Idiomas + + + ) +} + +const styles = StyleSheet.create({ + header: { + backgroundColor: "#fff", + elevation: 5, + marginTop: 0, + fontFamily: "OpenSans" + }, + headerContent: { + backgroundColor: "#fff", + marginBottom: 15, + marginTop: 15, + marginLeft: 15, + marginRight: 10, + flexDirection: "row" + }, + backButton: { + justifyContent: "center" + }, + languagesInfo: { + flex: 1, + fontSize: 22, + textAlign: "center", + backgroundColor: "#fff", + marginLeft: 20, + paddingRight: 20 + } +}) + +export default languagesHeader diff --git a/src/Screens/Languages/languages.js b/src/Screens/Languages/languages.js index a15126d..a1206a6 100644 --- a/src/Screens/Languages/languages.js +++ b/src/Screens/Languages/languages.js @@ -6,8 +6,10 @@ import { FlatList, StyleSheet, TouchableOpacity, - ToastAndroid + ToastAndroid, + BackHandler } from "react-native" +import LanguagesHeader from "~/Components/Languages/languagesHeader" import { CheckBox } from "react-native-elements" import firebase from "react-native-firebase" import data from "~/assets/languages/languages.json" @@ -19,7 +21,8 @@ export default class Languages extends Component { dataSource: [], currentLanguageName: "", checkBoxIndex: -1, - checkBox: true + checkBox: true, + disabled: false } this.user = firebase.auth().currentUser @@ -30,6 +33,8 @@ export default class Languages extends Component { } componentDidMount() { + BackHandler.addEventListener("hardwareBackPress", this.handleBackPress) + this.setState({ dataSource: data }) @@ -39,7 +44,20 @@ export default class Languages extends Component { }) } - changeLanguage = (item, index) => { + componentWillUnmount() { + BackHandler.removeEventListener("hardwareBackPress", this.handleBackPress) + } + + handleBackPress = () => { + const { navigation } = this.props + const { disabled } = this.state + if (!disabled) { + navigation.navigate("SettingsScreen") + } + return true + } + + changeLanguage = item => { firebase .firestore() .collection("users") @@ -70,8 +88,11 @@ export default class Languages extends Component { checkBox, checkBoxIndex } = this.state + const { navigation } = this.props + return ( + Idioma atual {currentLanguageName} @@ -86,16 +107,17 @@ export default class Languages extends Component { return ( this.changeLanguage(item, index)} + onPress={() => this.changeLanguage(item)} > {item.name} this.changeLanguage(item)} /> @@ -115,19 +137,19 @@ const styles = StyleSheet.create({ }, itemTextHeader: { backgroundColor: "#fff", - fontSize: 20, + fontSize: 18, paddingTop: 15, paddingLeft: 20, paddingBottom: 15 }, itemText: { - fontSize: 20 + fontSize: 18 }, headerTitle: { backgroundColor: "#F4F5F8" }, headerText: { - fontSize: 26, + fontSize: 24, alignSelf: "flex-start", paddingTop: 10, paddingBottom: 10, diff --git a/src/routes.js b/src/routes.js index 89ebea7..d654080 100644 --- a/src/routes.js +++ b/src/routes.js @@ -140,10 +140,7 @@ const appStackNavigator = createStackNavigator( LanguagesScreen: { screen: Languages, navigationOptions: { - title: "Tela de Idiomas", - headerTitleStyle: { - fontWeight: "normal" - } + header: null } } },