react-native-i18n/example/screen.js

79 lines
1.6 KiB
JavaScript

// @ flow
import React, { Component } from 'react';
import I18n, { getLanguages } from 'react-native-i18n';
import {
Platform,
StyleSheet,
Text,
ScrollView,
View,
} from 'react-native';
// Enable fallbacks if you want `en-US`
// and `en-GB` to fallback to `en`
I18n.fallbacks = true;
// Available languages
I18n.translations = {
'en': require('./translations/en'),
'fr': require('./translations/fr'),
'fr-CA': require('./translations/fr-CA'),
'es': require('./translations/es'),
};
console.log(I18n.locales)
export default class extends Component {
state = { languages: [] }
componentWillMount() {
getLanguages().then(languages => {
this.setState({ languages })
})
}
render() {
return (
<ScrollView style={styles.container}>
<Text style={styles.title}>Additional methods</Text>
<View style={styles.line}>
<Text style={styles.label}>getLanguages (Promise): </Text>
<Text>{JSON.stringify(this.state.languages)}</Text>
</View>
<Text style={styles.title}>Demos</Text>
<View style={styles.line}>
<Text style={styles.label}>I18n.t('hello world'): </Text>
<Text>{I18n.t('hello world')}</Text>
</View>
</ScrollView>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#F5FCFF',
padding: 24,
paddingTop: Platform.OS === 'ios' ? 44 : 24,
},
title: {
fontSize: 20,
fontWeight: '700',
marginBottom: 8,
},
line: {
flexDirection: 'row',
marginBottom: 16,
},
label: {
fontWeight: '700',
marginRight: 8,
},
});