feat: bundle demo webapp in apk

2026-08-16 20:00:26 +08:00
parent 5f5d0431ee
commit c82418f846
2 changed files with 85 additions and 5 deletions
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>示例应用</title>
+<style>
+  /* Miuix 风格示例页面 */
+  * { margin: 0; padding: 0; box-sizing: border-box; }
+  body {
+    font-family: -apple-system, "MiSans", "PingFang SC", sans-serif;
+    background: #f5f5f7;
+    color: #1a1a1a;
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 16px;
+    padding: 24px;
+  }
+  .icon {
+    width: 72px; height: 72px; border-radius: 20px;
+    background: linear-gradient(135deg, #ff6900, #ff9d00);
+    display: flex; align-items: center; justify-content: center;
+    font-size: 34px; color: #fff;
+  }
+  h1 { font-size: 24px; font-weight: 600; }
+  .card {
+    background: #fff; border-radius: 16px; padding: 16px 20px;
+    width: 100%; max-width: 360px;
+    box-shadow: 0 2px 12px rgba(0,0,0,.06);
+  }
+  .row { display: flex; justify-content: space-between; padding: 8px 0; font-size: 14px; }
+  .row .k { color: #8a8a90; }
+  .note { font-size: 12px; color: #8a8a90; text-align: center; line-height: 1.6; }
+</style>
+</head>
+<body>
+  <div class="icon">🎨</div>
+  <h1>示例应用</h1>
+  <div class="card">
+    <div class="row"><span class="k">来源</span><span>Hearth 内置</span></div>
+    <div class="row"><span class="k">当前时间</span><span id="clock">--:--:--</span></div>
+  </div>
+  <p class="note">这是打包在 Hearth APK 内的示例 webapp<br>用于演示 webAPP 打开 / 顶栏导航 / 多标签</p>
+<script>
+  function tick() {
+    var now = new Date();
+    var p = function (n) { return String(n).padStart(2, '0'); };
+    document.getElementById('clock').textContent =
+      p(now.getHours()) + ':' + p(now.getMinutes()) + ':' + p(now.getSeconds());
+  }
+  tick();
+  setInterval(tick, 1000);
+</script>
+</body>
+</html>