language change without restart

This commit is contained in:
vishnuraghavb 2021-06-08 17:13:54 +05:30
parent a315243af9
commit 45eae5f36f

View file

@ -1,11 +1,17 @@
<template> <template>
<Page @loaded="onPageLoad" actionBarHidden="true"> <Page @loaded="pgLoad" actionBarHidden="true">
<GridLayout rows="*, auto" columns="auto, *"> <RGridLayout :isRtl="RTL" rows="*, auto" columns="auto, *">
<OptionsList title="intf" :items="items" /> <OptionsList title="intf" :items="items" />
<GridLayout row="1" class="appbar" rows="*" columns="auto, *"> <GridLayout
:isRtl="RTL"
row="1"
class="appbar"
rows="*"
columns="auto, *"
>
<Button class="ico" :text="icon.back" @tap="$navigateBack()" /> <Button class="ico" :text="icon.back" @tap="$navigateBack()" />
</GridLayout> </GridLayout>
</GridLayout> </RGridLayout>
</Page> </Page>
</template> </template>
@ -16,7 +22,7 @@ import {
Device, Device,
Frame, Frame,
} from "@nativescript/core"; } from "@nativescript/core";
import { localize, overrideLocale } from "@nativescript/localize"; import { localize } from "@nativescript/localize";
import Action from "../modals/Action"; import Action from "../modals/Action";
import Confirm from "../modals/Confirm"; import Confirm from "../modals/Confirm";
import OptionsList from "../sub/OptionsList"; import OptionsList from "../sub/OptionsList";
@ -27,11 +33,11 @@ export default {
components: { OptionsList }, components: { OptionsList },
data() { data() {
return { return {
appLanguage: "English", applang: 0,
}; };
}, },
computed: { computed: {
...mapState(["icon", "language", "appTheme", "layout"]), ...mapState(["icon", "language", "appTheme", "layout", "RTL"]),
items() { items() {
return [ return [
{}, {},
@ -39,23 +45,21 @@ export default {
type: "list", type: "list",
icon: "lang", icon: "lang",
title: "lang", title: "lang",
subTitle: this.appLanguage, subTitle: this.applang,
action: this.selectAppLanguage, action: this.setAppLang,
}, },
{ {
type: "list", type: "list",
icon: "theme", icon: "theme",
title: "Theme", title: "Theme",
subTitle: localize( subTitle: ApplicationSettings.getString("appTheme", "sysDef"),
ApplicationSettings.getString("appTheme", "sysDef")
),
action: this.selectThemes, action: this.selectThemes,
}, },
{ {
type: "list", type: "list",
icon: "layout", icon: "layout",
title: "listVM", title: "listVM",
subTitle: localize(this.layout), subTitle: this.layout,
action: this.setLayoutMode, action: this.setLayoutMode,
}, },
{}, {},
@ -63,12 +67,12 @@ export default {
}, },
}, },
methods: { methods: {
...mapActions(["setTheme", "setLayout"]), ...mapActions(["setTheme", "setLayout", "setRTL"]),
onPageLoad({ object }) { pgLoad({ object }) {
object.bindingContext = new Observable(); object.bindingContext = new Observable();
}, },
// LANGUAGE SELECTION // LANGUAGE SELECTION
selectAppLanguage() { setAppLang() {
let languages = this.language.map((e) => e.title); let languages = this.language.map((e) => e.title);
this.$showModal(Action, { this.$showModal(Action, {
props: { props: {
@ -76,26 +80,19 @@ export default {
list: [...languages], list: [...languages],
}, },
}).then((action) => { }).then((action) => {
if (action && this.appLanguage !== action) { if (action && this.applang !== action) {
let currentLocale = Device.language.split("-")[0]; let currentLocale = ApplicationSettings.getString(
"appLocale",
"none"
).split("-");
let locale = this.language.filter((e) => e.title === action)[0] let locale = this.language.filter((e) => e.title === action)[0]
.locale; .locale;
if (currentLocale !== locale) { if (currentLocale !== locale) {
this.$showModal(Confirm, { this.applang = action;
props: { ApplicationSettings.setString("applang", action);
title: "appRst", ApplicationSettings.setString("appLocale", locale);
description: localize("nLangInfo"), utils.updateLocale();
cancelButtonText: "cBtn", this.setRTL();
okButtonText: "rst",
},
}).then((result) => {
if (result) {
this.appLanguage = action;
ApplicationSettings.setString("appLanguage", action);
overrideLocale(locale);
setTimeout(utils.restartApp, 250);
}
});
} }
} }
}); });
@ -111,7 +108,7 @@ export default {
if ( if (
action && action &&
(ApplicationSettings.getString("appTheme") != this.appTheme (ApplicationSettings.getString("appTheme") != this.appTheme
? true ? 1
: this.appTheme != action) : this.appTheme != action)
) { ) {
this.setTheme(action); this.setTheme(action);
@ -136,10 +133,7 @@ export default {
}, },
}, },
created() { created() {
this.appLanguage = ApplicationSettings.getString( this.applang = ApplicationSettings.getString("applang", "sysDef");
"appLanguage",
localize("sysDef")
);
}, },
}; };
</script> </script>