test: demo app update

Author: farfromrefug

demo-vue/app/App_Resources/Android/app.gradle

@@ -2,7 +2,8 @@
 android {
   defaultConfig {
     generatedDensities = []
-    applicationId = "org.nativescript.demovuematerial"
+      multiDexEnabled true
+ applicationId = "org.nativescript.demovuematerial"
 
     //override supported platforms
     // ndk {

demo-vue/app/App_Resources/Android/values/styles.xml

@@ -2,7 +2,7 @@
 <resources xmlns:android="http://schemas.android.com/apk/res/android">
 
     <!-- theme to use FOR launch screen-->
-    <style name="LaunchScreenThemeBase" parent="Theme.MaterialComponents.Light.NoActionBar">
+    <style name="LaunchScreenThemeBase" parent="Theme.MaterialComponents.DayNight.NoActionBar">
         <item name="toolbarStyle">@style/NativeScriptToolbarStyle</item>
 
         <item name="colorPrimary">@color/ns_primary</item>
@@ -20,7 +20,7 @@
     </style>
 
     <!-- theme to use AFTER launch screen is loaded-->
-    <style name="AppThemeBase" parent="Theme.MaterialComponents.Light.NoActionBar">
+    <style name="AppThemeBase" parent="Theme.MaterialComponents.DayNight.NoActionBar">
         <item name="toolbarStyle">@style/NativeScriptToolbarStyle</item>
 
         <item name="colorPrimary">@color/ns_primary</item>

demo-vue/app/app.scss

@@ -2,6 +2,12 @@
     font-family: $mdi-fontFamily;
 }
 
+label {
+    color:black;
+    .ns-dark & {
+        color: red;
+    }
+}
 mdbutton,MDFloatingActionButton, MDCardView {
     shape: cut;
 }

demo-vue/app/main.ts

@@ -19,6 +19,7 @@ import BottomNavigationBarPlugin from '@nativescript-community/ui-material-botto
 import TabsPlugin from '@nativescript-community/ui-material-tabs/vue';
 import BottomNavigationPlugin from '@nativescript-community/ui-material-bottom-navigation/vue';
 import SpeedDialPlugin from '@nativescript-community/ui-material-speeddial/vue';
+import Theme from '@nativescript-community/css-theme';
 
 installBottomSheet();
 
@@ -56,8 +57,17 @@ themer.createShape('cut', {
         unit: '%'
     }
 });
+
+if (global.isAndroid) {
+    Application.on(Application.displayedEvent, () => {
+        Theme.setMode(Theme.Auto);
+        androidx.appcompat.app.AppCompatDelegate.setDefaultNightMode(androidx.appcompat.app.AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM);
+    });
+}
+
 // import { getExamples } from './examples';
 import * as views from './views';
+import { Application } from '@nativescript/core';
 
 // for (let item of getExamples()) {
 //     Vue.component(item.component.name, item.component);

demo-vue/app/views/Home.ts

@@ -1,3 +1,4 @@
+import { Application } from '@nativescript/core';
 import { getExamples } from '../examples';
 
 export default {
@@ -23,6 +24,11 @@ export default {
             examples: getExamples()
         };
     },
+    mounted() {
+        Application.on(Application.systemAppearanceChangedEvent, (event) => {
+            this.$refs?.listView?.nativeView?.refresh();
+        });
+    },
     methods: {
         async goToExample(item) {
             console.log('goToExample', item.title);

demo-vue/package.json

@@ -5,7 +5,7 @@
     "main": "app/main",
     "dependencies": {
         "@mdi/font": "5.9.55",
-        "@nativescript/core": "8.0.5",
+        "@nativescript-community/css-theme": "^1.2.7",
         "@nativescript-community/text": "1.4.11",
         "@nativescript-community/ui-material-activityindicator": "file:../packages/activityindicator",
         "@nativescript-community/ui-material-bottom-navigation": "file:../packages/bottom-navigation",
@@ -24,6 +24,7 @@
         "@nativescript-community/ui-material-tabs": "file:../packages/tabs",
         "@nativescript-community/ui-material-textfield": "file:../packages/textfield",
         "@nativescript-community/ui-material-textview": "file:../packages/textview",
+        "@nativescript/core": "8.0.5",
         "@nativescript/iqkeyboardmanager": "^2.0.0",
         "@nativescript/theme": "3.0.1",
         "nativescript-vue": "~2.9.0",
@@ -39,7 +40,7 @@
         "sass-loader": "^11.0.1",
         "scss-symbols-parser": "^2.0.1",
         "string-replace-loader": "^3.0.1",
-        "tns-ios":"6.5.4",
+        "tns-ios": "6.5.4",
         "typescript": "^4.2.4",
         "vue": "^2.6.12",
         "vue-i18n": "^8.24.1",

src/bottom-navigation/index.android.ts

@@ -403,7 +403,7 @@ export class BottomNavigation extends TabNavigationBase {
         // _onAttachedToWindow called from OS again after it was detach
         // still happens with androidx.fragment:1.3.2
         const activity = Application.android.foregroundActivity;
-        if ((this._manager && this._manager.isDestroyed()) || !activity.getLifecycle().getCurrentState().isAtLeast(androidx.lifecycle.Lifecycle.State.STARTED)) {
+        if ((this._manager && this._manager.isDestroyed()) || !activity.getLifecycle?.().getCurrentState().isAtLeast(androidx.lifecycle.Lifecycle.State.STARTED)) {
             return;
         }
 
@@ -527,6 +527,7 @@ export class BottomNavigation extends TabNavigationBase {
 
         //@ts-ignore
         const fragmentManager = this._getRootFragmentManager();
+        console.log();
         let fragment: androidx.fragment.app.Fragment = fragmentManager.findFragmentByTag(name);
         if (fragment != null) {
             this.attachFragment(fragment);

src/tabs/tabs.android.ts

@@ -513,7 +513,7 @@ export class Tabs extends TabsBase {
         // _onAttachedToWindow called from OS again after it was detach
         // still happens with androidx.fragment:1.3.2
         const activity = Application.android.foregroundActivity;
-        if ((this._manager && this._manager.isDestroyed()) || !activity.getLifecycle().getCurrentState().isAtLeast(androidx.lifecycle.Lifecycle.State.STARTED)) {
+        if ((this._manager && this._manager.isDestroyed()) || !activity.getLifecycle?.().getCurrentState().isAtLeast(androidx.lifecycle.Lifecycle.State.STARTED)) {
             return;
         }