feat: add interactive ToolApp back preview

README.md

@@ -19,7 +19,7 @@ https://git.xin-blog.com/linshenjianlu/ShortX_ToolHub
 - **防回滚**：入口内置 `MIN_TRUSTED_MANIFEST_VERSION`，并记录本地已信任清单版本，拒绝旧版本清单。
 - **本地可信回退**：网络或远端清单异常时，不盲目覆盖；已验证过的本地模块可继续使用。
 - **App 化设置页**：设置主页、按钮管理、按钮编辑等页面使用统一 Shell 与页面栈，支持顶部返回/关闭。
-- **系统返回适配**：支持导航键返回；悬浮窗内置左右边缘滑动返回，优先在 ToolHub 页面栈内返回，栈空后关闭面板。
+- **系统返回适配**：支持导航键返回；悬浮窗内置左右边缘交互式滑动返回，拖动时实时露出上级页面，松手后完成返回。
 - **ShortX 图标选择器**：支持图标点选、搜索、分页、自适应列数，不再依赖手填图标名。
 - **颜色选择器**：使用折叠式完整调色板，支持常用色、最近色、RGB、透明度和实时预览；避免重复内联色板。
 - **自适应布局**：ToolApp 根据屏幕尺寸调整宽高，按钮管理页底部操作区保持可见。
@@ -192,7 +192,8 @@ toolhub-targets-2026-rsa3072
 - 设置、按钮管理、按钮编辑统一运行在 ToolApp Shell 内。
 - 顶部栏提供返回与关闭，子页面优先通过页面栈返回。
 - 系统返回键会优先回到上一页；没有上一页时关闭 ToolApp。
-- 悬浮窗无法稳定接入系统级预测性返回动画，因此 ToolHub 内置左右边缘滑动返回作为可用替代。
+- 悬浮窗无法稳定接入系统级预测性返回动画，因此 ToolHub 内置左右边缘交互式滑动返回作为替代。
+- 拖动过程中当前页面跟随手指横移，上级页面在底层实时露出；松手达到阈值后完成返回，未达到阈值则回弹。
 - 面板尺寸按屏幕自适应，减少小屏溢出与大屏空白。
 - 按钮管理页底部操作区保持可见，避免被列表内容挤出屏幕。
 
@@ -275,7 +276,8 @@ ToolHub.js.sha256
 **功能改进**
 
 - 新增 ToolApp 式设置主页与页面栈，设置、按钮管理、按钮编辑改为更接近 App 的层级导航。
-- 支持系统导航返回；因 ToolHub 是悬浮窗 Overlay，系统级预测性返回动画不稳定，改为内置左右边缘滑动返回。
+- 支持系统导航返回；因 ToolHub 是悬浮窗 Overlay，系统级预测性返回动画不稳定，改为内置左右边缘交互式滑动返回。
+- 边缘返回拖动时会预渲染上级页面，当前页面随手指横移并露出上级页面，松手后完成返回或回弹。
 - ToolApp 尺寸按屏幕自适应，按钮管理页底部操作区保持可见。
 - 按钮管理与按钮编辑布局继续轻量化，减少说明文字和视觉负担。
 - ShortX 图标选择器风格与设置 UI 对齐。

code/th_02_core.js

@@ -51,7 +51,11 @@ function FloatBallAppWM(logger) {
     toolAppNavStack: [],
     toolAppRoute: null,
     toolAppRoot: null,
+    toolAppBody: null,
     toolAppContentHost: null,
+    toolAppBackPreviewView: null,
+    toolAppBackPreviewRoute: null,
+    toolAppBackPreviewReady: false,
     toolAppTitleView: null,
     toolAppBackButton: null,
     settingsGroupKey: null,

code/th_09_animation.js

@@ -190,7 +190,11 @@ FloatBallAppWM.prototype.hideViewerPanel = function() {
   this.state.viewerPanelType = null;
   if (oldViewerType === "tool_app") {
     this.state.toolAppRoot = null;
+    this.state.toolAppBody = null;
     this.state.toolAppContentHost = null;
+    this.state.toolAppBackPreviewView = null;
+    this.state.toolAppBackPreviewRoute = null;
+    this.state.toolAppBackPreviewReady = false;
     this.state.toolAppTitleView = null;
     this.state.toolAppBackButton = null;
   }

code/th_15_extra.js

@@ -515,12 +515,199 @@ FloatBallAppWM.prototype.closeToolApp = function() {
     this.state.settingsGroupKey = null;
     this.hideViewerPanel();
     this.state.toolAppRoot = null;
+    this.state.toolAppBody = null;
     this.state.toolAppContentHost = null;
+    this.state.toolAppBackPreviewView = null;
+    this.state.toolAppBackPreviewRoute = null;
+    this.state.toolAppBackPreviewReady = false;
     this.state.toolAppTitleView = null;
     this.state.toolAppBackButton = null;
   } catch (e) { safeLog(this.L, 'e', "closeToolApp fail: " + String(e)); }
 };
 
+FloatBallAppWM.prototype.clearToolAppBackPreview = function(resetCurrent) {
+  try {
+    var prev = this.state.toolAppBackPreviewView;
+    var root = this.state.toolAppRoot;
+    if (prev && root) {
+      try { root.removeView(prev); } catch (eRm) {}
+    }
+    this.state.toolAppBackPreviewView = null;
+    this.state.toolAppBackPreviewRoute = null;
+    this.state.toolAppBackPreviewReady = false;
+    var body = this.state.toolAppBody;
+    if (resetCurrent && body) {
+      try { body.animate().cancel(); } catch (eCancel) {}
+      try { body.setTranslationX(0); body.setAlpha(1); body.setScaleX(1); body.setScaleY(1); } catch (eBody) {}
+    }
+  } catch (e) { safeLog(this.L, 'w', "clear tool app back preview fail: " + String(e)); }
+};
+
+FloatBallAppWM.prototype.getToolAppPreviousStackEntry = function() {
+  try {
+    var st = this.state.toolAppNavStack || [];
+    if (!st || st.length <= 1) return null;
+    return st[st.length - 2];
+  } catch (e) {}
+  return null;
+};
+
+FloatBallAppWM.prototype.makeToolAppStackEntry = function(route) {
+  return {
+    route: String(route || "settings"),
+    settingsGroupKey: String(this.state.settingsGroupKey || "")
+  };
+};
+
+FloatBallAppWM.prototype.buildToolAppPreviewBody = function(route) {
+  try {
+    var r = this.isToolAppRoute(route) ? String(route) : "settings";
+    var isDark = this.isDarkTheme();
+    var C = this.ui.colors;
+    var body = new android.widget.LinearLayout(context);
+    body.setOrientation(android.widget.LinearLayout.VERTICAL);
+    body.setBackground(this.ui.createRoundDrawable(isDark ? C.bgDark : C.bgLight, this.dp(18)));
+    try { body.setElevation(this.dp(6)); } catch (eElev) {}
+
+    var bar = new android.widget.LinearLayout(context);
+    bar.setOrientation(android.widget.LinearLayout.HORIZONTAL);
+    bar.setGravity(android.view.Gravity.CENTER_VERTICAL);
+    bar.setPadding(this.dp(8), this.dp(8), this.dp(8), this.dp(6));
+
+    var btnBack = this.ui.createFlatButton(this, "‹", C.primary, function() {});
+    btnBack.setTextSize(android.util.TypedValue.COMPLEX_UNIT_SP, 24);
+    btnBack.setEnabled(false);
+    bar.addView(btnBack, new android.widget.LinearLayout.LayoutParams(this.dp(42), this.dp(38)));
+
+    var tvTitle = new android.widget.TextView(context);
+    tvTitle.setText(String(this.getToolAppTitle(r) || "ToolHub"));
+    tvTitle.setTextColor(isDark ? C.textPriDark : C.textPriLight);
+    tvTitle.setTextSize(android.util.TypedValue.COMPLEX_UNIT_SP, 16);
+    tvTitle.setTypeface(null, android.graphics.Typeface.BOLD);
+    tvTitle.setGravity(android.view.Gravity.CENTER_VERTICAL);
+    var titleLp = new android.widget.LinearLayout.LayoutParams(0, -1);
+    titleLp.weight = 1;
+    bar.addView(tvTitle, titleLp);
+
+    var btnClose = this.ui.createFlatButton(this, "✕", isDark ? C.textSecDark : C.textSecLight, function() {});
+    btnClose.setTextSize(android.util.TypedValue.COMPLEX_UNIT_SP, 18);
+    btnClose.setEnabled(false);
+    bar.addView(btnClose, new android.widget.LinearLayout.LayoutParams(this.dp(42), this.dp(38)));
+    body.addView(bar, new android.widget.LinearLayout.LayoutParams(-1, this.dp(52)));
+
+    var host = new android.widget.FrameLayout(context);
+    var raw = this.buildPanelView(r);
+    try { raw.setBackground(null); } catch (eBg) {}
+    try { raw.setElevation(0); } catch (eEl) {}
+    host.addView(raw, new android.widget.FrameLayout.LayoutParams(-1, -1));
+    body.addView(host, new android.widget.LinearLayout.LayoutParams(-1, 0, 1));
+    return body;
+  } catch (e) {
+    safeLog(this.L, 'w', "build tool app preview body fail route=" + String(route || "") + " err=" + String(e));
+  }
+  return null;
+};
+
+FloatBallAppWM.prototype.prepareToolAppBackPreview = function(edge) {
+  try {
+    if (this.state.toolAppBackPreviewReady) return true;
+    var root = this.state.toolAppRoot;
+    var body = this.state.toolAppBody;
+    var prevEntry = this.getToolAppPreviousStackEntry();
+    if (!root || !body || !prevEntry || !prevEntry.route) return false;
+    var prevRoute = String(prevEntry.route || "settings");
+    var oldGroupKey = String(this.state.settingsGroupKey || "");
+    if (prevRoute === "settings_group" && prevEntry.settingsGroupKey) this.state.settingsGroupKey = String(prevEntry.settingsGroupKey);
+    var prevBody = this.buildToolAppPreviewBody(prevRoute);
+    this.state.settingsGroupKey = oldGroupKey;
+    if (!prevBody) return false;
+    var lp = new android.widget.FrameLayout.LayoutParams(-1, -1);
+    prevBody.setAlpha(0.65);
+    prevBody.setScaleX(0.985);
+    prevBody.setScaleY(0.985);
+    prevBody.setTranslationX((Number(edge) === 1 ? 1 : -1) * this.dp(18));
+    try {
+      root.addView(prevBody, 0, lp);
+    } catch (eAddIdx) {
+      try { root.addView(prevBody, lp); } catch (eAdd) { return false; }
+      try { prevBody.bringToFront(); body.bringToFront(); } catch (eFront) {}
+    }
+    try { body.bringToFront(); } catch (eBodyFront) {}
+    this.state.toolAppBackPreviewView = prevBody;
+    this.state.toolAppBackPreviewRoute = prevRoute;
+    this.state.toolAppBackPreviewReady = true;
+    return true;
+  } catch (e) {
+    safeLog(this.L, 'w', "prepare tool app back preview fail: " + String(e));
+  }
+  return false;
+};
+
+FloatBallAppWM.prototype.applyToolAppBackPreviewProgress = function(edge, progress) {
+  try {
+    var p = Number(progress || 0);
+    if (isNaN(p)) p = 0;
+    if (p < 0) p = 0;
+    if (p > 1) p = 1;
+    if (!this.prepareToolAppBackPreview(edge)) return false;
+    var body = this.state.toolAppBody;
+    var prev = this.state.toolAppBackPreviewView;
+    var dir = Number(edge) === 1 ? -1 : 1;
+    var w = 0;
+    try { w = Number((this.state.viewerPanelLp && this.state.viewerPanelLp.width) || 0); } catch (eW0) {}
+    if (!w || w < this.dp(120)) {
+      try { w = Number((this.state.toolAppRoot && this.state.toolAppRoot.getWidth && this.state.toolAppRoot.getWidth()) || 0); } catch (eW1) {}
+    }
+    if (!w || w < this.dp(120)) w = this.dp(320);
+    if (body) {
+      body.setTranslationX(dir * w * p);
+      body.setAlpha(1.0 - 0.16 * p);
+      var s = 1.0 - 0.025 * p;
+      body.setScaleX(s);
+      body.setScaleY(s);
+    }
+    if (prev) {
+      prev.setAlpha(0.65 + 0.35 * p);
+      prev.setTranslationX(-dir * this.dp(18) * (1.0 - p));
+      var ps = 0.985 + 0.015 * p;
+      prev.setScaleX(ps);
+      prev.setScaleY(ps);
+    }
+    return true;
+  } catch (e) { safeLog(this.L, 'w', "apply tool app back preview fail: " + String(e)); }
+  return false;
+};
+
+FloatBallAppWM.prototype.finishToolAppBackPreview = function(edge, complete) {
+  try {
+    var self = this;
+    var body = this.state.toolAppBody;
+    var dir = Number(edge) === 1 ? -1 : 1;
+    if (complete && body) {
+      var w = 0;
+      try { w = Number((this.state.viewerPanelLp && this.state.viewerPanelLp.width) || 0); } catch (eW0) {}
+      if (!w || w < this.dp(120)) w = this.dp(320);
+      body.animate().translationX(dir * w).alpha(0.78).setDuration(120).withEndAction(new java.lang.Runnable({
+        run: function() {
+          try { self.clearToolAppBackPreview(true); } catch (eClear) {}
+          try { self.popToolAppPage("edge_swipe_back"); } catch (ePop) {}
+        }
+      })).start();
+      return;
+    }
+    if (body) {
+      body.animate().translationX(0).alpha(1).scaleX(1).scaleY(1).setDuration(140).withEndAction(new java.lang.Runnable({
+        run: function() { try { self.clearToolAppBackPreview(true); } catch (eClear2) {} }
+      })).start();
+    } else {
+      this.clearToolAppBackPreview(true);
+    }
+  } catch (e) {
+    this.clearToolAppBackPreview(true);
+    safeLog(this.L, 'w', "finish tool app back preview fail: " + String(e));
+  }
+};
+
 FloatBallAppWM.prototype.createToolAppEdgeBackStrip = function(edge) {
   var self = this;
   var strip = new android.view.View(context);
@@ -537,8 +724,9 @@ FloatBallAppWM.prototype.createToolAppEdgeBackStrip = function(edge) {
         if (action === android.view.MotionEvent.ACTION_DOWN) {
           downX = event.getRawX();
           downY = event.getRawY();
-          active = !!(self.state && self.state.toolAppActive);
+          active = !!(self.state && self.state.toolAppActive && self.getToolAppPreviousStackEntry());
           moved = false;
+          if (active) self.prepareToolAppBackPreview(edge);
           return active;
         }
         if (!active) return false;
@@ -546,33 +734,24 @@ FloatBallAppWM.prototype.createToolAppEdgeBackStrip = function(edge) {
           var mx = event.getRawX() - downX;
           var my = event.getRawY() - downY;
           var validDir = (edge === 0 && mx > 0) || (edge === 1 && mx < 0);
-          if (validDir && Math.abs(mx) > self.dp(8) && Math.abs(mx) > Math.abs(my)) {
+          if (validDir && Math.abs(mx) > self.dp(4) && Math.abs(mx) > Math.abs(my)) {
             moved = true;
-            var p = Math.min(1, Math.abs(mx) / self.dp(120));
-            var panel = self.state ? self.state.toolAppRoot : null;
-            if (panel) {
-              try {
-                panel.setTranslationX((edge === 0 ? 1 : -1) * self.dp(28) * p);
-                panel.setAlpha(1.0 - 0.10 * p);
-              } catch (eAnim) {}
-            }
+            var p = Math.min(1, Math.abs(mx) / self.dp(180));
+            self.applyToolAppBackPreviewProgress(edge, p);
           }
           return true;
         }
         if (action === android.view.MotionEvent.ACTION_UP || action === android.view.MotionEvent.ACTION_CANCEL) {
           var ux = event.getRawX() - downX;
           var uy = event.getRawY() - downY;
-          var okDir = (edge === 0 && ux > self.dp(56)) || (edge === 1 && ux < -self.dp(56));
-          var ok = moved && okDir && Math.abs(ux) > Math.abs(uy) * 1.2;
-          try { self.resetPanelPredictiveBackVisual(self.state ? self.state.toolAppRoot : null); } catch (eReset) {}
+          var okDir = (edge === 0 && ux > self.dp(72)) || (edge === 1 && ux < -self.dp(72));
+          var ok = (action === android.view.MotionEvent.ACTION_UP) && moved && okDir && Math.abs(ux) > Math.abs(uy) * 1.2;
           active = false;
-          if (ok) {
-            try { self.popToolAppPage("edge_swipe_back"); } catch (ePop) {}
-            return true;
-          }
+          self.finishToolAppBackPreview(edge, ok);
           return true;
         }
       } catch (e) {
+        try { self.clearToolAppBackPreview(true); } catch (eClear) {}
         try { safeLog(self.L, 'w', "tool app edge back fail: " + String(e)); } catch(eLog) {}
       }
       return false;
@@ -643,6 +822,7 @@ FloatBallAppWM.prototype.buildToolAppShell = function(contentView, title, canBac
   } catch (eStrip) { safeLog(this.L, 'w', "add edge back strip fail: " + String(eStrip)); }
 
   this.state.toolAppRoot = root;
+  this.state.toolAppBody = body;
   this.state.toolAppContentHost = host;
   this.state.toolAppTitleView = tvTitle;
   this.state.toolAppBackButton = btnBack;
@@ -762,9 +942,9 @@ FloatBallAppWM.prototype.showToolApp = function(route, resetStack) {
       this.state.previewMode = false;
     }
     if (resetStack || !this.state.toolAppNavStack || !this.state.toolAppNavStack.length) {
-      this.state.toolAppNavStack = [{ route: r }];
+      this.state.toolAppNavStack = [this.makeToolAppStackEntry(r)];
     } else {
-      this.state.toolAppNavStack[this.state.toolAppNavStack.length - 1] = { route: r };
+      this.state.toolAppNavStack[this.state.toolAppNavStack.length - 1] = this.makeToolAppStackEntry(r);
     }
 
     var raw = this.buildPanelView(r);
@@ -803,7 +983,7 @@ FloatBallAppWM.prototype.showToolApp = function(route, resetStack) {
 FloatBallAppWM.prototype.pushToolAppPage = function(route) {
   if (!this.isToolAppRoute(route)) return;
   if (!this.state.toolAppNavStack) this.state.toolAppNavStack = [];
-  this.state.toolAppNavStack.push({ route: String(route) });
+  this.state.toolAppNavStack.push(this.makeToolAppStackEntry(route));
   this.showToolApp(route, false);
 };
 
@@ -814,8 +994,8 @@ FloatBallAppWM.prototype.pushToolAppSettingsGroup = function(groupKey) {
 
 FloatBallAppWM.prototype.replaceToolAppPage = function(route) {
   if (!this.isToolAppRoute(route)) return;
-  if (!this.state.toolAppNavStack || !this.state.toolAppNavStack.length) this.state.toolAppNavStack = [{ route: String(route) }];
-  else this.state.toolAppNavStack[this.state.toolAppNavStack.length - 1] = { route: String(route) };
+  if (!this.state.toolAppNavStack || !this.state.toolAppNavStack.length) this.state.toolAppNavStack = [this.makeToolAppStackEntry(route)];
+  else this.state.toolAppNavStack[this.state.toolAppNavStack.length - 1] = this.makeToolAppStackEntry(route);
   this.showToolApp(route, false);
 };
 
@@ -837,7 +1017,8 @@ FloatBallAppWM.prototype.popToolAppPage = function(reason) {
     this.state.toolAppNavStack.pop();
     var top = this.state.toolAppNavStack[this.state.toolAppNavStack.length - 1];
     var nextRoute = top && top.route ? String(top.route) : "settings";
-    if (nextRoute !== "settings_group") this.state.settingsGroupKey = null;
+    if (nextRoute === "settings_group") this.state.settingsGroupKey = String((top && top.settingsGroupKey) ? top.settingsGroupKey : (this.state.settingsGroupKey || ""));
+    else this.state.settingsGroupKey = null;
     this.showToolApp(nextRoute, false);
     return true;
   } catch (e) {

manifest.json

@@ -6,8 +6,8 @@
       "size": 52546
     },
     "th_02_core.js": {
-      "sha256": "23b94eb4afbf978a75363b412b542d4f2b1f5260c63ab966dcf5b44076a05b6f",
-      "size": 4423
+      "sha256": "c8d823e135a4b58a50336586ab13265e5ff4b72531633908b635b243401f461a",
+      "size": 4551
     },
     "th_03_icon.js": {
       "sha256": "717f7f37474d3616c2cd944581455f600020a850ec8812100d0546ec1302c987",
@@ -34,8 +34,8 @@
       "size": 7938
     },
     "th_09_animation.js": {
-      "sha256": "8c8c0c166816c36569923de31c2951d16fce5ca2e68168cb6190283e058d14c3",
-      "size": 35207
+      "sha256": "1c323579c090e635f9ab52fb26c21151738e9a845e6c1a6ef86fdcc6adc16da6",
+      "size": 35383
     },
     "th_10_shell.js": {
       "sha256": "0ed793079c2f6ba7d29f4c0d411705cb72419f45f572cbe37ed32ac16527a8bc",
@@ -58,8 +58,8 @@
       "size": 239523
     },
     "th_15_extra.js": {
-      "sha256": "c39103bc3728fb6b5f0ced8975d064f50d7f6ef091355391f2f18b0d3c1cdb22",
-      "size": 79219
+      "sha256": "2f440db325b0349e86bdfdfcea98c96aa84b1c4457b623d9e4219cd67c9d045a",
+      "size": 87017
     },
     "th_16_entry.js": {
       "sha256": "e7c99c3dfbd6aedab05551426955081ae6cae034754f2f557cefa01dc75dc001",
@@ -68,5 +68,5 @@
   },
   "keyId": "toolhub-targets-2026-rsa3072",
   "schema": 2,
-  "version": 20260513185115
+  "version": 20260513190003
 }

manifest.sig

@@ -1 +1 @@
-Fsvy+vxIvc2+e29Z+Wq+pxms/IVoB04bKhmiDZB5DYq47f5RD4rc12AiiHPFm6tdYY2JQ4Ri/2XAPFW+GGJnhKSLJ9ngw/eSfEKPwlmLqitLTXUMH0qdl68+3BtoDLrBEF9Io1XnmeaLHizEAOM/Ubu5qc+IeDgEbnoMBWI+1eYp/VkeBRxl1TDDhTkb5yiRDCxES8X67FSismFOGQfCFA5T1oSUmX1YdkUkkd29ihUFnP0Jm+L2UIH+etms2LEsaGDXm7JUlGLK145U3pAsjoZzx/00v1ytyNtmE2qgb0NFAcEJqx6fpmKWfF7Ix0IeUTyeCkQXJsKnGsiYe3RxLAL2GGBc3EanIDQJTgsnb5Q96mV37HmHqGk6l/T3hPMpSDkc2AMq/pD2YQTsahW6k22m+/hHCftIBCO/1HkpkBVx+gkrt09OUZPkREuwq+nERSCowgRZLbmSYCjK2Mkl8jn1sXKk017Ew0EjcVzcyk+8rUVnJo7s/Pz4cZgjIp5+
+TxKSEMoO+ieBxrJQNOj3L0B9LYm42eVfpbDI2kDu9ztx3VcxmIrTfg2NlvpL9JHVy3zSshl61nB21XqPchEwS8G3/hZzF8bEyiL0/H0QuvbpBxE6Q8ZhrS6iyuuGGpTfxOdrTYZ1NLw3y1eqlWt3zsPr4/vcEEMrr49yQJaWAYdkNUpL3687uFB6ZABZdOuPiUcf2vQC7V9T3+ltwFxaCH1bxig3AGmPDTbREqgTckn8hClliBsqtoUjhnADwpBu1fFoAhIdb+p+sqYgA3kL7plSQHPjfKDz6fQwwv2EXdzCMbIMipPpS0fSHoDY66Z29Lxyr2hwBsCsze0Sd5TFEt8Ri1q8srVHgSOcxnRfa752Alw10KbQ24YKmiUbR1oLVvjGN7k4b8dsdFCZEVSyXedYJY1a5TJFwH3CtCbKK0v/RPTMhlhNOczgVakXba1JukLAiq7BF7aGlEvIf9rMQqsvpywvlAuu1sQQVT+0JK6puOkvfRnXxh1KK/EN8pqj