2026-07-06 11:10:43 +08:00
|
|
|
|
<!DOCTYPE html>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<html lang="zh-CN">
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="UTF-8">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<title>手环 AMOLED 屏幕无障碍大字版 UI 效果图画册 (A11y V3.3)</title>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<style>
|
|
|
|
|
|
body {
|
|
|
|
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
|
|
|
|
|
background-color: #0A0D14;
|
|
|
|
|
|
color: #E2E8F0;
|
|
|
|
|
|
margin: 0;
|
|
|
|
|
|
padding: 40px 20px;
|
|
|
|
|
|
line-height: 1.6;
|
|
|
|
|
|
}
|
|
|
|
|
|
.container {
|
|
|
|
|
|
max-width: 1200px;
|
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
}
|
|
|
|
|
|
h1 {
|
|
|
|
|
|
font-size: 2.2rem;
|
|
|
|
|
|
color: #00E5FF;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
margin-bottom: 8px;
|
|
|
|
|
|
letter-spacing: 1px;
|
|
|
|
|
|
}
|
|
|
|
|
|
.subtitle {
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
color: #94A3B8;
|
|
|
|
|
|
font-size: 1.1rem;
|
|
|
|
|
|
margin-bottom: 50px;
|
|
|
|
|
|
}
|
|
|
|
|
|
.grid {
|
|
|
|
|
|
display: grid;
|
|
|
|
|
|
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
|
|
|
|
|
gap: 40px;
|
|
|
|
|
|
justify-items: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
.card {
|
|
|
|
|
|
background-color: #161B22;
|
|
|
|
|
|
border-radius: 16px;
|
|
|
|
|
|
border: 1px solid #30363D;
|
|
|
|
|
|
padding: 24px;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
width: 270px;
|
|
|
|
|
|
box-shadow: 0 8px 30px rgba(0,0,0,0.5);
|
|
|
|
|
|
transition: transform 0.2s, border-color 0.2s;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
}
|
|
|
|
|
|
.card:hover {
|
|
|
|
|
|
transform: translateY(-5px);
|
|
|
|
|
|
border-color: #00E5FF;
|
|
|
|
|
|
}
|
|
|
|
|
|
.card-title {
|
|
|
|
|
|
font-size: 1.1rem;
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
color: #FFB74D;
|
|
|
|
|
|
margin-bottom: 8px;
|
|
|
|
|
|
}
|
|
|
|
|
|
.card-desc {
|
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
|
color: #8B949E;
|
|
|
|
|
|
margin-bottom: 20px;
|
|
|
|
|
|
height: 40px;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* Realistic Smartwatch CSS Simulator */
|
|
|
|
|
|
.watch-device {
|
|
|
|
|
|
position: relative;
|
2026-07-09 17:42:55 +08:00
|
|
|
|
width: 160px;
|
2026-07-06 11:10:43 +08:00
|
|
|
|
height: 280px;
|
|
|
|
|
|
background: linear-gradient(135deg, #2D3748 0%, #1A202C 100%);
|
|
|
|
|
|
border-radius: 35px;
|
|
|
|
|
|
border: 5px solid #4A5568;
|
|
|
|
|
|
box-shadow: inset 0 0 10px rgba(0,0,0,0.8), 0 10px 20px rgba(0,0,0,0.6);
|
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
.watch-device::before {
|
|
|
|
|
|
content: '';
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: -20px;
|
|
|
|
|
|
left: 45px;
|
|
|
|
|
|
width: 70px;
|
|
|
|
|
|
height: 20px;
|
|
|
|
|
|
background-color: #2D3748;
|
|
|
|
|
|
border-radius: 5px 5px 0 0;
|
|
|
|
|
|
z-index: -1;
|
|
|
|
|
|
}
|
|
|
|
|
|
.watch-device::after {
|
|
|
|
|
|
content: '';
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
bottom: -20px;
|
|
|
|
|
|
left: 45px;
|
|
|
|
|
|
width: 70px;
|
|
|
|
|
|
height: 20px;
|
|
|
|
|
|
background-color: #2D3748;
|
|
|
|
|
|
border-radius: 0 0 5px 5px;
|
|
|
|
|
|
z-index: -1;
|
|
|
|
|
|
}
|
|
|
|
|
|
.screen-bezel {
|
|
|
|
|
|
position: relative;
|
2026-07-09 17:42:55 +08:00
|
|
|
|
width: 130px;
|
2026-07-06 11:10:43 +08:00
|
|
|
|
height: 250px;
|
|
|
|
|
|
background-color: #000000;
|
|
|
|
|
|
border-radius: 25px;
|
|
|
|
|
|
border: 2px solid #0D1117;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* Inlined SVG Scaling */
|
|
|
|
|
|
.screen-bezel svg {
|
2026-07-09 17:42:55 +08:00
|
|
|
|
width: 120px;
|
2026-07-06 11:10:43 +08:00
|
|
|
|
height: 240px;
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* Button operations instruction block */
|
|
|
|
|
|
.card-ops {
|
|
|
|
|
|
font-size: 0.8rem;
|
|
|
|
|
|
color: #E2E8F0;
|
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
|
text-align: left;
|
|
|
|
|
|
background-color: #0D1117;
|
|
|
|
|
|
padding: 12px;
|
|
|
|
|
|
border-radius: 8px;
|
|
|
|
|
|
border: 1px solid #21262D;
|
|
|
|
|
|
min-height: 70px;
|
|
|
|
|
|
flex-grow: 1;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
.card-ops b {
|
|
|
|
|
|
color: #FFB74D;
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
margin-bottom: 4px;
|
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
|
|
|
<div class="container">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<h1>手环 AMOLED 无障碍大字版 UI 效果图画册 (A11y V3.3)</h1>
|
|
|
|
|
|
<div class="subtitle">针对特殊人群优化的大字体、大图标单页集中展示界面效果及按键交互说明(共 15 类全套界面)</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
|
|
|
|
|
<div class="grid">
|
|
|
|
|
|
<!-- 1. Normal Clock -->
|
|
|
|
|
|
<div class="card">
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<div class="card-title">1. 待机时钟界面 (DESARME)</div>
|
|
|
|
|
|
<div class="card-desc">撤防待机:超大数字时钟,状态栏左侧显示大解锁图标 🔓</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- Status Bar (Left: Big Unlock, Right: Battery 16x32px text + battery icon) -->
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<!-- 🔓 Unlock Icon (32x32px style) -->
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<g transform="translate(10, 15)">
|
|
|
|
|
|
<rect x="0" y="8" width="20" height="15" rx="3" fill="none" stroke="#10B981" stroke-width="2"/>
|
|
|
|
|
|
<path d="M 5 8 L 5 4 C 5 2, 12 2, 15 4 L 15 10" fill="none" stroke="#10B981" stroke-width="2" stroke-linecap="round"/>
|
|
|
|
|
|
</g>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<!-- Large Battery info and Large Battery Icon -->
|
|
|
|
|
|
<text x="82" y="32" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="end">85%</text>
|
|
|
|
|
|
<rect x="86" y="19" width="24" height="13" rx="2" fill="none" stroke="#FFFFFF" stroke-width="1.8"/>
|
|
|
|
|
|
<rect x="89" y="22" width="15" height="7" rx="0.5" fill="#10B981"/>
|
|
|
|
|
|
<rect x="110" y="23" width="1.5" height="5" rx="0.5" fill="#FFFFFF"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- Central Big Time (32x64px equivalent in SVG) -->
|
|
|
|
|
|
<text x="60" y="115" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="34" font-weight="bold" text-anchor="middle">10:35</text>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Bottom Large Date (16x32px equivalent) -->
|
|
|
|
|
|
<text x="60" y="195" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">VEN. 07-10</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
长按 ■ 确认键 3 秒进入主选择菜单;短按或长按 SOS 键均直接触发【本地主动报警】。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 2. Armed Clock -->
|
|
|
|
|
|
<div class="card">
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<div class="card-title">2. 系统布防时钟 (ARME)</div>
|
|
|
|
|
|
<div class="card-desc">布防待机状态,状态栏左侧显示大红色锁图标 🔒</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- Status Bar (Left: Big Lock 32x32px, Right: Battery with + charging indicator) -->
|
|
|
|
|
|
<!-- 🔒 Lock Icon -->
|
|
|
|
|
|
<g transform="translate(10, 15)">
|
|
|
|
|
|
<rect x="0" y="8" width="20" height="15" rx="3" fill="none" stroke="#EF4444" stroke-width="2"/>
|
|
|
|
|
|
<path d="M 5 8 L 5 3 C 5 1, 15 1, 15 3 L 15 8" fill="none" stroke="#EF4444" stroke-width="2" stroke-linecap="round"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</g>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<!-- Large Battery info & Icon -->
|
|
|
|
|
|
<text x="82" y="32" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="end">85%+</text>
|
|
|
|
|
|
<rect x="86" y="19" width="24" height="13" rx="2" fill="none" stroke="#FFFFFF" stroke-width="1.8"/>
|
|
|
|
|
|
<rect x="89" y="22" width="15" height="7" rx="0.5" fill="#10B981"/>
|
|
|
|
|
|
<rect x="110" y="23" width="1.5" height="5" rx="0.5" fill="#FFFFFF"/>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
|
|
|
|
|
|
<!-- Central Big Time -->
|
|
|
|
|
|
<text x="60" y="115" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="34" font-weight="bold" text-anchor="middle">10:35</text>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Bottom Large Date -->
|
|
|
|
|
|
<text x="60" y="195" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">VEN. 07-10</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
长按 ■ 确认键 3 秒进入主菜单;短按或长按 SOS 键直接触发【本地主动报警】。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- 3. Main Menu - Date/Time -->
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<div class="card-title">3. 主菜单: 时间修改</div>
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-desc">菜单项 1:大时钟图标配合超大功能项文字</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<text x="60" y="35" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">- MENU -</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- ⏰ 48x48px Clock Icon -->
|
|
|
|
|
|
<g transform="translate(36, 65)">
|
|
|
|
|
|
<circle cx="24" cy="24" r="20" stroke="#00E5FF" stroke-width="3" fill="none"/>
|
|
|
|
|
|
<path d="M 24 10 L 24 24 L 34 24" stroke="#00E5FF" stroke-width="3" stroke-linecap="round" fill="none"/>
|
|
|
|
|
|
<path d="M 8 6 L 16 2 M 40 6 L 32 2" stroke="#00E5FF" stroke-width="3.5" stroke-linecap="round"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</g>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="165" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">1. HORLOGE</text>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<text x="60" y="210" fill="#64748B" font-family="system-ui, sans-serif" font-size="14" text-anchor="middle">^ v</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:15:46 +08:00
|
|
|
|
按 ▲/▼ 键翻看菜单选项;短按 ■ 确认进入;长按 ■ 3秒返回时钟。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- 4. Main Menu - Pairing -->
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<div class="card-title">4. 主菜单: 传感器配对</div>
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-desc">菜单项 2:大雷达对码图标与对码文本</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<text x="60" y="35" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">- MENU -</text>
|
2026-07-09 17:42:55 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- 📡 48x48px Radar Icon -->
|
|
|
|
|
|
<g transform="translate(36, 65)">
|
|
|
|
|
|
<path d="M 24 38 A 12 12 0 0 1 36 28 M 24 38 A 18 18 0 0 1 42 22 M 24 38 A 24 24 0 0 1 48 16" stroke="#00E5FF" stroke-width="3" fill="none" stroke-linecap="round"/>
|
|
|
|
|
|
<circle cx="24" cy="38" r="4" fill="#00E5FF"/>
|
|
|
|
|
|
<line x1="24" y1="38" x2="6" y2="44" stroke="#00E5FF" stroke-width="2.5"/>
|
|
|
|
|
|
</g>
|
2026-07-09 17:42:55 +08:00
|
|
|
|
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="165" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">2. APPAIR.</text>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<text x="60" y="210" fill="#64748B" font-family="system-ui, sans-serif" font-size="14" text-anchor="middle">^ v</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:15:46 +08:00
|
|
|
|
按 ▲/▼ 键翻看菜单选项;短按 ■ 确认进入对码搜索;长按 ■ 3秒返回时钟。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 5. Main Menu - Arm/Disarm -->
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-title">5. 主菜单: 手动布撤防</div>
|
|
|
|
|
|
<div class="card-desc">菜单项 3:大盾牌防区图标与大字指示</div>
|
|
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
|
|
|
|
|
<text x="60" y="35" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">- MENU -</text>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 🛡️ Shield / Security Icon (48x48px) representing ALARME menu item -->
|
|
|
|
|
|
<g transform="translate(36, 65)">
|
|
|
|
|
|
<path d="M 24 4 C 12 4, 6 12, 6 12 C 6 28, 24 44, 24 44 C 24 44, 42 28, 42 12 C 42 12, 36 4, 24 4 Z" stroke="#00E5FF" stroke-width="3.5" fill="none" stroke-linejoin="round"/>
|
|
|
|
|
|
<path d="M 24 12 L 24 34" stroke="#00E5FF" stroke-width="3"/>
|
|
|
|
|
|
</g>
|
|
|
|
|
|
|
|
|
|
|
|
<text x="60" y="165" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">3. ALARME</text>
|
|
|
|
|
|
<text x="60" y="210" fill="#64748B" font-family="system-ui, sans-serif" font-size="14" text-anchor="middle">^ v</text>
|
|
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
|
|
|
|
|
按 ▲/▼ 键翻看菜单选项;短按 ■ 确认进入手动布撤防选项页;长按 ■ 3秒返回时钟。
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 6. Main Menu - Liaison -->
|
|
|
|
|
|
<div class="card">
|
|
|
|
|
|
<div class="card-title">6. 主菜单: 摄像头绑定</div>
|
|
|
|
|
|
<div class="card-desc">菜单项 4:大摄像头图标与绑定文本</div>
|
|
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
|
|
|
|
|
<text x="60" y="35" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">- MENU -</text>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 📷 Camera Icon (48x48px) representing LIAISON menu item -->
|
|
|
|
|
|
<g transform="translate(36, 65)">
|
|
|
|
|
|
<rect x="4" y="14" width="30" height="24" rx="3" fill="none" stroke="#00E5FF" stroke-width="3"/>
|
|
|
|
|
|
<circle cx="19" cy="26" r="6" stroke="#00E5FF" stroke-width="2.5" fill="none"/>
|
|
|
|
|
|
<path d="M 34 20 L 44 14 L 44 38 L 34 32 Z" fill="#00E5FF"/>
|
|
|
|
|
|
</g>
|
|
|
|
|
|
|
|
|
|
|
|
<text x="60" y="165" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">4. LIAISON</text>
|
|
|
|
|
|
<text x="60" y="210" fill="#64748B" font-family="system-ui, sans-serif" font-size="14" text-anchor="middle">^ v</text>
|
|
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
|
|
|
|
|
按 ▲/▼ 键翻看菜单选项;短按 ■ 确认进入摄像头绑定对码页;长按 ■ 3秒返回时钟。
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 7. Single Value Time Edit -->
|
|
|
|
|
|
<div class="card">
|
|
|
|
|
|
<div class="card-title">7. 设定时间: 修改小时</div>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<div class="card-desc">每次仅微调一项:超大数字显示,下方指示已缩短</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="35" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="14" font-weight="bold" text-anchor="middle">REGLER</text>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
|
|
|
|
|
|
<!-- Up Arrow -->
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<path d="M 60 62 L 52 72 L 68 72 Z" fill="#00E5FF"/>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
|
|
|
|
|
|
<!-- Huge 32x64px hour value -->
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="132" fill="#00E5FF" font-family="system-ui, sans-serif" font-size="44" font-weight="bold" text-anchor="middle">10</text>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
|
|
|
|
|
|
<!-- Down Arrow -->
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<path d="M 60 157 L 52 147 L 68 147 Z" fill="#00E5FF"/>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="200" fill="#64748B" font-family="system-ui, sans-serif" font-size="14" font-weight="bold" text-anchor="middle">VALIDER</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
按 ▲ 增加数值,▼ 减少数值;短按 ■ 确认保存并切入分秒年等微调;长按 ■ 3s 放弃退出。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 8. Pairing Search -->
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-title">8. 雷达对码搜索</div>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<div class="card-desc">64x64px 超大雷达闪烁动画,文字防超出优化</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="35" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="14" font-weight="bold" text-anchor="middle">APPAIRAGE</text>
|
2026-07-09 14:22:59 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- 64x64px Big Radar -->
|
|
|
|
|
|
<g transform="translate(28, 65)">
|
|
|
|
|
|
<path d="M 32 50 C 32 30, 48 10, 60 10 M 32 50 C 32 35, 42 20, 52 20 M 32 50 C 32 40, 36 30, 44 30" stroke="#00E5FF" stroke-width="3" fill="none" stroke-linecap="round"/>
|
|
|
|
|
|
<circle cx="32" cy="50" r="5" fill="#00E5FF"/>
|
|
|
|
|
|
<line x1="32" y1="50" x2="8" y2="58" stroke="#00E5FF" stroke-width="3"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</g>
|
2026-07-09 14:22:59 +08:00
|
|
|
|
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="165" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="14" font-weight="bold" text-anchor="middle">RECHERCHE</text>
|
|
|
|
|
|
<text x="60" y="200" fill="#00E5FF" font-family="system-ui, sans-serif" font-size="13" font-weight="bold" text-anchor="middle">ACTIVER DET.</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
触发物理传感器。捕获数据后手环将<b>自动以数据码识别类型并跳转确认页</b>。长按 ▼ 2 秒退出。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 9. Pairing Confirm -->
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-title">9. 识别类型与微调序号</div>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<div class="card-desc">自动显示类型及大图标,直接对大序号框增减操作</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="32" fill="#10B981" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">✓ RECU</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- 48x48px Big Door Icon -->
|
|
|
|
|
|
<g transform="translate(36, 45)">
|
|
|
|
|
|
<rect x="2" y="2" width="24" height="42" rx="3" fill="none" stroke="#FFFFFF" stroke-width="2.5"/>
|
|
|
|
|
|
<rect x="30" y="8" width="10" height="30" rx="1.5" fill="none" stroke="#10B981" stroke-width="2.5"/>
|
|
|
|
|
|
<circle cx="8" cy="24" r="2.5" fill="#FFFFFF"/>
|
|
|
|
|
|
</g>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- Only-read sensor type name (16x32px equivalent) -->
|
|
|
|
|
|
<text x="60" y="130" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">PORTE</text>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 32x64px Suffix Edit Box [ 01 ] -->
|
|
|
|
|
|
<rect x="15" y="152" width="90" height="44" rx="6" fill="none" stroke="#00E5FF" stroke-width="2"/>
|
|
|
|
|
|
<text x="60" y="186" fill="#00E5FF" font-family="system-ui, sans-serif" font-size="34" font-weight="bold" text-anchor="middle">01</text>
|
|
|
|
|
|
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<text x="60" y="225" fill="#64748B" font-family="system-ui, sans-serif" font-size="13" font-weight="bold" text-anchor="middle">CONFIRMER</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
按 ▲ 键自增,▼ 键自减微调序号(01~99);短按 ■ 确认键保存;长按 ■ 3秒放弃。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 10. Pair Success -->
|
|
|
|
|
|
<div class="card">
|
|
|
|
|
|
<div class="card-title">10. 对码保存成功</div>
|
|
|
|
|
|
<div class="card-desc">无障碍大字版:圆圈成功对勾,绿色成功指示</div>
|
|
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Symmetrical Circular Success Badge -->
|
|
|
|
|
|
<circle cx="60" cy="90" r="24" stroke="#10B981" stroke-width="2.5" fill="none"/>
|
|
|
|
|
|
<path d="M 48 90 L 56 98 L 72 82" stroke="#10B981" stroke-width="3.5" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
|
|
|
|
|
|
|
|
|
|
|
|
<text x="60" y="150" fill="#10B981" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">REUSSITE</text>
|
|
|
|
|
|
<text x="60" y="185" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="13" font-weight="bold" text-anchor="middle">ENREGISTRE</text>
|
|
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
|
|
|
|
|
显示 2 秒后自动退回到主时钟待机状态,无须任何按键。
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 11. Pair Failed -->
|
|
|
|
|
|
<div class="card">
|
|
|
|
|
|
<div class="card-title">11. 对码绑定失败</div>
|
|
|
|
|
|
<div class="card-desc">无障碍大字版:红叉圈,提示重新激活对码</div>
|
|
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Symmetrical Circular Fail Badge -->
|
|
|
|
|
|
<circle cx="60" cy="90" r="24" stroke="#EF4444" stroke-width="2.5" fill="none"/>
|
|
|
|
|
|
<path d="M 50 80 L 70 100 M 70 80 L 50 100" stroke="#EF4444" stroke-width="3.5" fill="none" stroke-linecap="round"/>
|
|
|
|
|
|
|
|
|
|
|
|
<text x="60" y="150" fill="#EF4444" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">ECHEC</text>
|
|
|
|
|
|
<text x="60" y="185" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="12" font-weight="bold" text-anchor="middle">DEJA ASSOC.</text>
|
|
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
|
|
|
|
|
自动显示 5 秒后回退到配对菜单,或短按任意键立即回退。
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 12. Alarm Received -->
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-title">12. 收到防区报警 (PORTE)</div>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<div class="card-desc">全屏闪烁粗边框 + 64x64px 报警大图标</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- 4px Flashing Red Border -->
|
|
|
|
|
|
<rect x="4" y="4" width="112" height="232" rx="20" stroke="#EF4444" stroke-width="4.5" fill="none"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- 64x64px Huge Door Icon -->
|
|
|
|
|
|
<g transform="translate(28, 40)">
|
|
|
|
|
|
<rect x="2" y="2" width="32" height="58" rx="4" fill="none" stroke="#EF4444" stroke-width="3.5"/>
|
|
|
|
|
|
<rect x="42" y="12" width="14" height="42" rx="2" fill="none" stroke="#EF4444" stroke-width="3"/>
|
|
|
|
|
|
<circle cx="10" cy="32" r="3.5" fill="#EF4444"/>
|
|
|
|
|
|
</g>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- 16x32px text warnings -->
|
|
|
|
|
|
<text x="60" y="145" fill="#EF4444" font-family="system-ui, sans-serif" font-size="16" font-weight="bold" text-anchor="middle">PORTE 01</text>
|
|
|
|
|
|
<text x="60" y="185" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="16" font-weight="bold" text-anchor="middle">INTRUSION!</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
高分贝马达与声光报警启动。短按手环侧边或上部任意键均可瞬间解除报警复位。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 13. Emitted SOS -->
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-title">13. 本机主动求救 SOS</div>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<div class="card-desc">巨大警灯,通过换行与字号分配,完全防止溢出</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<rect x="4" y="4" width="112" height="232" rx="20" stroke="#EF4444" stroke-width="4.5" fill="none"/>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Huge 64x64px Rotating Siren Icon -->
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<g transform="translate(28, 25)">
|
2026-07-09 18:01:49 +08:00
|
|
|
|
<!-- Rays -->
|
|
|
|
|
|
<path d="M 32 10 L 32 18 M 14 16 L 22 22 M 50 16 L 42 22 M 6 32 L 15 34 M 58 32 L 49 34" stroke="#EF4444" stroke-width="3" stroke-linecap="round"/>
|
|
|
|
|
|
<!-- Dome -->
|
|
|
|
|
|
<path d="M 12 52 C 12 28, 52 28, 52 52 Z" fill="#EF4444" stroke="#EF4444" stroke-width="2"/>
|
|
|
|
|
|
<circle cx="32" cy="45" r="7" fill="#FFFFFF"/>
|
|
|
|
|
|
<!-- Base -->
|
|
|
|
|
|
<rect x="6" y="52" width="52" height="8" rx="2" fill="#64748B"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</g>
|
2026-07-09 18:01:49 +08:00
|
|
|
|
|
2026-07-09 18:06:37 +08:00
|
|
|
|
<!-- Split into 2 rows to fit within 120px screen width nicely -->
|
|
|
|
|
|
<text x="60" y="125" fill="#EF4444" font-family="system-ui, sans-serif" font-size="16" font-weight="bold" text-anchor="middle">SOS</text>
|
|
|
|
|
|
<text x="60" y="152" fill="#EF4444" font-family="system-ui, sans-serif" font-size="16" font-weight="bold" text-anchor="middle">EMIS</text>
|
|
|
|
|
|
|
|
|
|
|
|
<text x="60" y="195" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="14" font-weight="bold" text-anchor="middle">APPEL...</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:06:37 +08:00
|
|
|
|
连发 SOS 呼救信号。短按或长按任意按键均可停止发射并消除紧急求救。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 14. Arm/Disarm Setting Select -->
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-title">14. 手动布撤防设定</div>
|
|
|
|
|
|
<div class="card-desc">48x48px 锁/防区图标,无障碍大字状态指示</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
2026-07-09 17:42:55 +08:00
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<text x="60" y="35" fill="#94A3B8" font-family="system-ui, sans-serif" font-size="14" font-weight="bold" text-anchor="middle">REG. ALARME</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 48x48px Big Lock Icon representing ARME selection -->
|
|
|
|
|
|
<g transform="translate(36, 65)">
|
|
|
|
|
|
<rect x="6" y="16" width="36" height="26" rx="4" fill="none" stroke="#EF4444" stroke-width="3"/>
|
|
|
|
|
|
<path d="M 12 16 L 12 10 C 12 5, 36 5, 36 10 L 36 16" fill="none" stroke="#EF4444" stroke-width="3" stroke-linecap="round"/>
|
|
|
|
|
|
<circle cx="24" cy="28" r="3.5" fill="#EF4444"/>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</g>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- Large active state option in brackets -->
|
|
|
|
|
|
<text x="60" y="165" fill="#00E5FF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">[ ARME ]</text>
|
|
|
|
|
|
<text x="60" y="210" fill="#64748B" font-family="system-ui, sans-serif" font-size="14" text-anchor="middle">^ v</text>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:15:46 +08:00
|
|
|
|
按 ▲/▼ 键来回切换 `[ ARME ]` 和 `[ DESARME ]`;短按 ■ 确认保存退出;长按 ■ 3s 放弃退出。
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2026-07-09 18:12:25 +08:00
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 15. IPC Binding -->
|
2026-07-09 18:12:25 +08:00
|
|
|
|
<div class="card">
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<div class="card-title">15. IPC 绑定发送页</div>
|
|
|
|
|
|
<div class="card-desc">48x48px 摄像头图标,大字发送指示</div>
|
2026-07-09 18:12:25 +08:00
|
|
|
|
<div class="watch-device">
|
|
|
|
|
|
<div class="screen-bezel">
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="240" viewBox="0 0 120 240">
|
|
|
|
|
|
<rect width="120" height="240" fill="#000000"/>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<!-- 48x48px Camera Icon -->
|
|
|
|
|
|
<g transform="translate(36, 40)">
|
|
|
|
|
|
<rect x="2" y="10" width="32" height="26" rx="4" fill="none" stroke="#00E5FF" stroke-width="3"/>
|
|
|
|
|
|
<circle cx="18" cy="23" r="6" stroke="#00E5FF" stroke-width="2.5" fill="none"/>
|
|
|
|
|
|
<path d="M 34 16 L 44 10 L 44 36 L 34 30 Z" fill="#00E5FF"/>
|
2026-07-09 18:12:25 +08:00
|
|
|
|
</g>
|
|
|
|
|
|
|
2026-07-09 18:15:46 +08:00
|
|
|
|
<text x="60" y="130" fill="#FFFFFF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">LIAISON</text>
|
|
|
|
|
|
<text x="60" y="165" fill="#00E5FF" font-family="system-ui, sans-serif" font-size="15" font-weight="bold" text-anchor="middle">EN COURS</text>
|
|
|
|
|
|
|
|
|
|
|
|
<text x="60" y="215" fill="#64748B" font-family="system-ui, sans-serif" font-size="9" text-anchor="middle">ID: 0x3F882</text>
|
2026-07-09 18:12:25 +08:00
|
|
|
|
</svg>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="card-ops">
|
|
|
|
|
|
<b>按键操作:</b>
|
2026-07-09 18:15:46 +08:00
|
|
|
|
连发对码信号。长按 ■ 键 3 秒 或 长按 ▼ 键 2 秒可立刻退出返回时钟。
|
2026-07-09 18:12:25 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2026-07-06 11:10:43 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>
|