feat(navigation): integrate capgo capacitor navigation bar plugin

android/app/capacitor.build.gradle

@@ -22,6 +22,7 @@ dependencies {
     implementation project(':capacitor-share')
     implementation project(':capacitor-splash-screen')
     implementation project(':capacitor-status-bar')
+    implementation project(':capgo-capacitor-navigation-bar')
     implementation project(':send-intent')
     implementation project(':jcesarmobile-ssl-skip')
 

android/app/src/main/assets/capacitor.plugins.json

@@ -51,6 +51,10 @@
 		"pkg": "@capacitor/status-bar",
 		"classpath": "com.capacitorjs.plugins.statusbar.StatusBarPlugin"
 	},
+	{
+		"pkg": "@capgo/capacitor-navigation-bar",
+		"classpath": "ee.forgr.capacitor_navigation_bar.NavigationBarPlugin"
+	},
 	{
 		"pkg": "send-intent",
 		"classpath": "de.mindlib.sendIntent.SendIntent"

android/app/src/main/java/com/logseq/app/MainActivity.java

@@ -8,12 +8,15 @@ import android.view.View;
 import android.view.Window;
 import android.webkit.ValueCallback;
 import android.webkit.WebView;
-
+import com.getcapacitor.PluginCall;
+import com.getcapacitor.JSObject;
 import com.getcapacitor.BridgeActivity;
 
 import java.util.Timer;
 import java.util.TimerTask;
 
+import ee.forgr.capacitor_navigation_bar.NavigationBarPlugin;
+
 public class MainActivity extends BridgeActivity {
     @Override
     public void onCreate(Bundle savedInstanceState) {
@@ -26,7 +29,7 @@ public class MainActivity extends BridgeActivity {
         webView.getSettings().setUseWideViewPort(true);
         webView.getSettings().setLoadWithOverviewMode(true);
 
-        setNavigationBarColorBasedOnTheme();
+        // initNavigationBarBgColor();
 
         new Timer().schedule(new TimerTask() {
             @Override
@@ -41,6 +44,15 @@ public class MainActivity extends BridgeActivity {
         }, 5000);
     }
 
+    public void initNavigationBarBgColor() {
+        NavigationBarPlugin navigationBarPlugin = new NavigationBarPlugin();
+        JSObject data = new JSObject();
+        data.put("color", "transparent");
+
+        PluginCall call = new PluginCall(null, null, null, "t", data);
+        navigationBarPlugin.setNavigationBarColor(call);
+    }
+
     @Override
     public void onPause() {
         overridePendingTransition(0, R.anim.byebye);
@@ -62,22 +74,4 @@ public class MainActivity extends BridgeActivity {
             });
         }
     }
-
-    private void setNavigationBarColorBasedOnTheme() {
-        Window window = getWindow();
-        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) { // API 26及以上支持
-            // 根据主题选择颜色
-            int navBarColor = isDarkMode()
-                    ? getResources().getColor(R.color.colorPrimaryDark, getTheme())
-                    : getResources().getColor(R.color.colorPrimary, getTheme());
-
-            // 设置导航栏颜色
-            window.setNavigationBarColor(navBarColor);
-        }
-    }
-
-    private boolean isDarkMode() {
-        int nightModeFlags = getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK;
-        return nightModeFlags == Configuration.UI_MODE_NIGHT_YES;
-    }
 }

android/capacitor.settings.gradle

@@ -41,6 +41,9 @@ project(':capacitor-splash-screen').projectDir = new File('../node_modules/@capa
 include ':capacitor-status-bar'
 project(':capacitor-status-bar').projectDir = new File('../node_modules/@capacitor/status-bar/android')
 
+include ':capgo-capacitor-navigation-bar'
+project(':capgo-capacitor-navigation-bar').projectDir = new File('../node_modules/@capgo/capacitor-navigation-bar/android')
+
 include ':send-intent'
 project(':send-intent').projectDir = new File('../node_modules/send-intent/android')
 

package.json

@@ -124,6 +124,7 @@
         "@capacitor/share": "7.0.1",
         "@capacitor/splash-screen": "7.0.1",
         "@capacitor/status-bar": "7.0.1",
+        "@capgo/capacitor-navigation-bar": "^7.1.32",
         "@dnd-kit/core": "^6.0.8",
         "@dnd-kit/sortable": "^7.0.2",
         "@emoji-mart/data": "^1.1.2",
@@ -138,6 +139,7 @@
         "@js-joda/timezone": "2.5.0",
         "@logseq/diff-merge": "^0.2.2",
         "@logseq/react-tweet-embed": "1.3.1-1",
+        "@logseq/simple-wave-record": "^0.0.3",
         "@radix-ui/colors": "^0.1.8",
         "@sentry/react": "^6.18.2",
         "@sentry/tracing": "^6.18.2",
@@ -145,7 +147,6 @@
         "@tabler/icons-react": "^2.47.0",
         "@tabler/icons-webfont": "^2.47.0",
         "@tippyjs/react": "4.2.5",
-        "@logseq/simple-wave-record": "^0.0.3",
         "bignumber.js": "^9.0.2",
         "check-password-strength": "2.0.7",
         "chokidar": "3.5.1",

src/main/mobile/components/app.css

@@ -23,7 +23,7 @@ html.is-native-android {
   --silk-topbar-inner-height: 36px;
   --silk-topbar-inner-padding-bottom: 6px;
 
-  --silk-tabbar-bottom-paddding: 18px;
+  --silk-tabbar-bottom-paddding: 22px;
 
   .app-silk-index-container {
     padding-top: calc(var(--safe-area-inset-top) + var(--silk-topbar-inner-height) + 22px);

src/main/mobile/init.cljs

@@ -3,6 +3,7 @@
   (:require ["@capacitor/app" :refer [^js App]]
             ["@capacitor/keyboard" :refer [^js Keyboard]]
             ["@capacitor/network" :refer [^js Network]]
+            ["@capgo/capacitor-navigation-bar" :refer [^js NavigationBar]]
             [clojure.string :as string]
             [frontend.handler.editor :as editor-handler]
             [frontend.mobile.flows :as mobile-flows]
@@ -23,14 +24,16 @@
 (def *last-shared-url (atom nil))
 (def *last-shared-seconds (atom 0))
 
-(defn- ios-init
+(defn- ios-init!
   "Initialize iOS-specified event listeners"
   []
   (mobile-util/check-ios-zoomed-display))
 
-(defn- android-init
+(defn- android-init!
   "Initialize Android-specified event listeners"
   []
+  (js/setTimeout
+   #(.setNavigationBarColor NavigationBar #js {:color "transparent"}) 128)
   (.addListener App "backButton"
                 (fn []
                   (when (false?
@@ -82,7 +85,7 @@
                                             (js/window.location.reload)))))))))
   (reset! mobile-flows/*mobile-app-state (.-isActive state)))
 
-(defn- general-init
+(defn- general-init!
   "Initialize event listeners used by both iOS and Android"
   []
   (.addListener App "appUrlOpen"
@@ -125,13 +128,13 @@
   (reset! mobile-flows/*network Network)
 
   (when (mobile-util/native-android?)
-    (android-init))
+    (android-init!))
 
   (when (mobile-util/native-ios?)
-    (ios-init))
+    (ios-init!))
 
   (when (mobile-util/native-platform?)
-    (general-init)))
+    (general-init!)))
 
 (defn keyboard-hide
   []

yarn.lock

@@ -336,6 +336,11 @@
   resolved "https://registry.yarnpkg.com/@capacitor/status-bar/-/status-bar-7.0.1.tgz#6bd3769ef35158c961ff2a6b571c03e9bce55809"
   integrity sha512-iDv3mXYo9CdxYRVwt3/pRyuk25p7Sn4GfaS/zMZyVIqTzsvKLCIIH3GdKK+ta+nsNcAVpCw/t5jFEBt1D18ctA==
 
+"@capgo/capacitor-navigation-bar@^7.1.32":
+  version "7.1.32"
+  resolved "https://registry.yarnpkg.com/@capgo/capacitor-navigation-bar/-/capacitor-navigation-bar-7.1.32.tgz#937902665c1602bc653e9344538cfc3abc525062"
+  integrity sha512-bigqO8GD1qiyoGdMPCDXOmthhjEAokW0P4Aq+1ejWAKzy4tge44r2vThuTV+W75sPWFiNXdt8tB+iSQImN1row==
+
 "@colors/[email protected]":
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9"