115 lines
3.2 KiB
JavaScript
115 lines
3.2 KiB
JavaScript
|
import React, { Component } from "react";
|
||
|
import {
|
||
|
Platform,
|
||
|
StyleSheet,
|
||
|
Text,
|
||
|
View,
|
||
|
SafeAreaView,
|
||
|
Picker,
|
||
|
TouchableOpacity,
|
||
|
TouchableHighlight,
|
||
|
} from "react-native";
|
||
|
import RadioForm, {RadioButton, RadioButtonInput, RadioButtonLabel} from 'react-native-simple-radio-button';
|
||
|
import Size from "../../config/size";
|
||
|
import Icon from "react-native-vector-icons/dist/Ionicons";
|
||
|
import { observer, inject } from "mobx-react/native";
|
||
|
import { observable } from "mobx";
|
||
|
import DrawerNavigationHeader from "../../components/Public/drawerNavigationHeader";
|
||
|
import AsyncStorageHelper from "../../config/asyncStorageHelper";
|
||
|
import { scale, verticalScale, moderateScale } from "react-native-size-matters";
|
||
|
import { width, height } from "../../config/screen";
|
||
|
import language from "../../config/language";
|
||
|
import theme from "../../config/colors";
|
||
|
const asyncStorageHelper = new AsyncStorageHelper();
|
||
|
const size = new Size();
|
||
|
var radio_language = [
|
||
|
{label: 'English', value: 'english'},
|
||
|
{label: 'Chinese', value: 'chinese' }
|
||
|
];
|
||
|
@inject(["menuStore"], ["userStore"])
|
||
|
@observer
|
||
|
export default class Language extends Component {
|
||
|
//language = 'english'
|
||
|
static navigationOptions = {
|
||
|
drawerLabel: "Settings",
|
||
|
swipeEnabled: false,
|
||
|
tabBarLabel: language.en.setting,
|
||
|
};
|
||
|
state = { language: "chinese",
|
||
|
initial:0
|
||
|
};
|
||
|
constructor(props) {
|
||
|
super(props);
|
||
|
this.store = this.props.menuStore;
|
||
|
this.userStore = this.props.userStore;
|
||
|
}
|
||
|
|
||
|
componentWillMount() {
|
||
|
this.setState({ language: this.userStore.languageSelection });
|
||
|
if(this.userStore.languageSelection == 'chinese'){
|
||
|
this.setState({initial:1})
|
||
|
}else if (this.userStore.languageSelection == 'english'){
|
||
|
this.setState({initial:0})
|
||
|
}
|
||
|
console.log(this.state.language);
|
||
|
}
|
||
|
|
||
|
updateUser(language) {
|
||
|
this.userStore.saveLanguage(language);
|
||
|
this.setState({ language: language });
|
||
|
}
|
||
|
backAction() {
|
||
|
console.log('back')
|
||
|
this.props.navigation.goBack();
|
||
|
}
|
||
|
|
||
|
render() {
|
||
|
return (
|
||
|
<SafeAreaView style={{ backgroundColor: theme.mainColor, flex: 1 }}>
|
||
|
<View style={styles.container}>
|
||
|
|
||
|
<Icon
|
||
|
onPress={() => {this.backAction()}}
|
||
|
name="ios-arrow-back-outline"
|
||
|
size={size.getSize(40)}
|
||
|
color={"black"}
|
||
|
/>
|
||
|
|
||
|
{/* <Picker
|
||
|
selectedValue={this.state.language}
|
||
|
style={{ height: 50, width: 100 }}
|
||
|
onValueChange={(itemValue, itemIndex) => {
|
||
|
this.updateUser(itemValue);
|
||
|
}}
|
||
|
>
|
||
|
<Picker.Item label="中文" value="chinese" />
|
||
|
<Picker.Item label="English" value="english" />
|
||
|
</Picker> */}
|
||
|
<RadioForm
|
||
|
style = {{paddingTop: verticalScale(50),}}
|
||
|
radio_props={radio_language}
|
||
|
initial={this.state.initial}
|
||
|
onPress={(value) => {this.updateUser(value)}}/>
|
||
|
</View>
|
||
|
</SafeAreaView>
|
||
|
);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
const styles = StyleSheet.create({
|
||
|
container: {
|
||
|
flex: 1,
|
||
|
backgroundColor: "white"
|
||
|
},
|
||
|
flatViewContainer: {
|
||
|
height: "100%",
|
||
|
width: "100%",
|
||
|
alignItems: "center",
|
||
|
marginTop: 20
|
||
|
},
|
||
|
textView: {
|
||
|
marginLeft: scale(15),
|
||
|
marginBottom: scale(5)
|
||
|
}
|
||
|
});
|