锁屏主题预览 Lockscreen Preview
在 VSCode 中实时预览锁屏主题 manifest.xml，MAML语法，代码写到那就能直接刷新，支持触摸/按钮/解锁/重力交互、变量模拟与映射。
功能特性
- 实时预览：打开
manifest.xml 即可在左侧预览锁屏效果，右侧继续编辑代码，修改后自动热更新
- 真机交互：左键触摸/点击按钮/解锁，右键拖动模拟重力感应
- 变量模拟：时间、电量、步数、天气等变量可在面板中实时修改，主题即时响应
- 变量映射：预置 7 个常用变量映射，支持自定义任意 MAML 变量到面板通道
- 高亮调试：一键高亮所有
<Button> 元素的点击区域
- 代码定位：
Ctrl+左键 点击预览中的图片/文字，右侧代码直接跳到对应源码行
- 变量监控：输入任意 MAML 变量名，实时查看其求值结果
安装
将本插件目录放入 VSCode 扩展目录，或通过 Developer: Install Extension from Location... 选择本文件夹。
打开预览
三种方式任选其一：
- 标题栏图标：打开
manifest.xml 后，编辑器标题栏右上角的 📱 手机图标
- 右键菜单：在编辑器标签页或资源管理器的
manifest.xml 上右键 → "打开锁屏预览"
- 命令面板：
Ctrl+Shift+P → 输入"打开锁屏预览"
打开后自动左右分栏：左侧预览（约 25%），右侧代码（约 75%）。
浮动操作按钮
预览左上角有三个单色线条图标按钮：
| 图标形状 |
名称 |
功能 |
| 图片框（矩形 + 太阳 + 山峦线条） |
重新加载图片 |
重新扫描锁屏包内所有图片并全量加载，同时重载代码并重启锁屏 |
| 循环箭头（带箭头的圆弧） |
代码重载 |
重新解析 manifest.xml 并重启锁屏，不重新加载图片 |
| 圆角矩形框 |
高亮按钮区域 |
为所有 <Button> 元素叠加蓝色半透明框，仅做屏幕显示，不修改 MAML |
基础交互
- 左键点击：模拟手指触摸，触发
<Button> 的 Click/Touch 事件
- 右键拖动：模拟重力感应（陀螺仪），影响依赖重力变量的元素（目前仅支持华为平台的重力感应变量）
- 解锁：在屏幕上执行主题定义的解锁手势
代码定位（Ctrl + 左键）
按住 Ctrl 点击预览画面中的元素，右侧 manifest.xml 会自动跳转并选中该元素的源码行。
- 支持元素：
<Image>、<Text>、<ImageNumber>、<Time>
- 命中规则：点击点必须落在元素的矩形区域内（未声明宽高且尚未加载出内容的元素不参与命中）
- 多层叠加切换：
- 首次点击命中最上层元素（即代码中靠后、最后绘制的那个）
- 在同一位置（横纵偏差均不超过 30 像素）继续
Ctrl+单击，会逐层切换到下一层，到最底层后循环回到最上层
- 点击位置偏移超过 30 像素视为切换到新区域，重新从最上层开始
- 点击处没有任何可定位元素时不做任何操作
- 行号按源码顺序精确记录，注释掉的元素不参与定位（
<!-- <Image ... /> --> 不会干扰行号）
跳转成功后，VSCode 状态栏会短暂提示元素类型、name 与行号。
控制面板
预览右侧边缘有收起/展开把手，点击可显示控制台面板。
时间模拟
- 启用：勾选后冻结显示在指定时间，动画继续运行；不勾选则跟随系统时间
- 预设按钮：
- 华为08:08：设置为 2023年10月20日 08:08
- Vivo 10:00：设置为 2020年3月21日 10:00
- 微调器：年 / 月 / 日 / 时 / 分 各带 ‹ › 按钮，逐单位调整
- 24时：勾选后小时按 24 小时制显示
电量
- 重置：恢复默认电量 80%
- 数字输入框 + 滑块：两者双向同步，范围 0–100
- 充电中：勾选后
#charging 变量为 1
变量映射
预置 7 个常用变量映射，输入框修改即实时生效，失焦自动保存为下次加载的默认值：
| 显示名 |
MAML 变量 |
通道 |
默认值 |
| 类型 |
weather_id |
weather_id |
1 |
| 城市 |
weather_city |
provider:city_name |
深圳 |
| 温度 |
currentTemp |
temperature |
26 |
| 描述 |
weather_des |
provider:description |
多云 |
| 最低温度 |
lowTmp |
temp_low |
19 |
| 最高温度 |
highTmp |
temp_high |
30 |
| 步数 |
steps_value |
steps |
3333 |
- 还原默认：恢复 7 个预置映射及其默认值
- 编辑JSON：打开工作区设置
lockscreen-preview.varChannels，添加自定义映射
自定义映射格式：
{
"var": "对应在maml中的变量名",
"source": "中文变量名",
"default": "26"
}
var：MAML 中的变量名source：内置通道 / provider:<列名> / count:<countName> / 任意自定义名称（作为独立通道）；留空或 manual 按字面量锁定default：初始值，仅在加载主题时写入通道一次
保存设置后，自定义映射会出现在预置行下方，可直接编辑值实时生效。
变量监控
输入任意 MAML 变量名（如 touch_x、battery_level、hour24、ampm、daysleftValue），点击 + 添加到监控列表，实时显示其当前求值结果。点击变量名右侧的 × 可移除。
热更新机制
- 编辑
manifest.xml 时，输入防抖 500ms 后自动热更新
- 热更新仅重载代码、不重启锁屏、不重新加载图片，保留运行时变量值与动画进度
- XML 解析失败时保留旧的元素树，不会黑屏
- 保存文件时立即触发热更新
分辨率
仅支持 1080×2400 分辨率的锁屏预览。
已知限制
- 重力感应目前仅支持华为平台，vivo 等其他平台的重力变量暂不支持
- 变量语义按华为 MAML 规范实现，
#day_of_week 取值 1~7 对应星期日~星期六
- 主题中若存在将
#hour24 与 #ampm*12 相加的剩余时间百分比表达式，正午之后会被截断（主题模板源头问题，真机同样复现）
| |
