San Song Daddy :)

Multi language prepare .\app\i18n\locales\en.js export default { wcsqa: 'Westminster Shorter Catechism Q&A' }; .\app\i18n\locales\zh.js export default { wcsqa: '威斯敏斯德小要理问答' }; .\app\i18n\i18n.js import I18n from 'react-native-i18n'; import en from './locales/en'; import zh from './locales/zh'; I18n.fallbacks = true; I18n.translations = { en, zh }; export default I18n; Usage App.js import ReactNativeLanguages from 'react-native-languages'; import I18n from './app/i18n/i18n' ReactNativeLanguages.addEventListener('change', ({ language }) => { I18n.locale = language; }); render() { return ( <View style={styles.container}> <View style={styles.header}> <Text style={styles.title}> {I18n.t('wcsqa')} </Text> ... // other contents </View> ... // other contents </View> ) }

Render render() { return ( <View style={styles.container}> <View style={styles.header}> <Text style={styles.title}> {I18n.t('wcsqa')} // your title </Text> <TouchableOpacity onPress={() => {}}> <Image style={styles.option} source={require('./res/img/nav_icon.png')} /> </TouchableOpacity> </View> <View style={styles.content}> <Text> {this.wcs[0].Q} // your content </Text> </View> </View> ) } Style const styles = StyleSheet.create({ container: { flex: 2, }, header: { backgroundColor: '#00FF7F', flex: 1, flexDirection: 'row', alignItems: 'center', justifyContent: 'space-around', }, title: {

According to RFC4646 ( http://www.ietf.org/rfc/rfc4646.txt ) language codes for Traditional Chinese should be zh-Hant react-native-i18n import { getLanguages } from 'react-native-i18n' getLanguages().then(languages => { console.log(languages); }); Set system language to Chinese 01-24 17:47:47.957 19851 19873 I ReactNativeJS: [ 'zh-Hans-CN', 'en-US' ] Set system language to English 01-24 17:56:30.754 20563 20584 I ReactNativeJS: [ 'en-US', 'zh-Hans-CN' ]

Error Unable to process incoming event 'ProgressComplete ' (ProgressCompleteEvent) on Windows Solution I looked solution from web, but not found one can work for my issue. https://github.com/gradle/gradle/issues/882 Then I just closed my shell window(cmd.exe or powershell.exe) and reopen a new one, I found the issue gone.

render render() { return ( <ImageBackground style={styles.bgimg} source={require('./res/img/wcs.png')}> <View style={styles.fgcontainer}> <Text style={styles.qa}> WCS WCS WCS </Text> </View> </ImageBackground> ); } Style const styles = StyleSheet.create({ bgimg: { flex: 1 }, fgcontainer: { flex: 1, justifyContent: 'center', alignItems: 'center' }, qa: { fontSize: 30, fontWeight: 'bold' } }); No Image, No Truth

Render render() { return ( <View style={styles.splashContainer}> <Image source={require('./res/img/Catechism-words.png')}> </Image> </View> ) } Style const styles = StyleSheet.create({ splashContainer: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#00FF7F' } }); No Image, No True