一只「瑞星小狮子」风格的卡通桌面宠物:圆脑袋、一圈蓬松鬃毛、大眼睛、腮红。 它会趴在你的桌面上、叠在所有应用窗口之上,陪你一起办公。
当前版本 v1.3.0 —— 打包好的安装包在
dist/桌面小狮子-1.3.0-arm64.dmg(Apple Silicon)。
- 会呼吸、眨眼、朝鼠标看
- 鼠标靠近会挥手打招呼
- 点一下摸摸头(开心跳 + 冒爱心)
- 双击喂食
- 按住可以拖着它满屏跑
- 有饥饿值 / 心情值,饿了、无聊了会冒对话气泡抱怨
- 没人理就自己趴下睡觉(Zzz)
- 平时会自己在桌面溜达
全部用 Canvas 程序化绘制,不依赖任何图片素材。
cd desktop-pet
npm install # 首次需要下载 Electron
npm start # 启动!小狮子出现在桌面右下方Electron 默认从 GitHub 下载。若失败,先确认能访问 GitHub; 国内网络可尝试镜像(注意旧地址
npmmirror.com/mirrors/electron已失效):ELECTRON_MIRROR=https://registry.npmmirror.com/-/binary/electron/ npm install
- 右键小狮子 → 弹出菜单 → 「❌ 退出」
- 或菜单栏
Cmd + Q
| 操作 | 效果 |
|---|---|
| 鼠标靠近 | 挥手打招呼「你好呀~」 |
| 单击小狮子 | 摸摸头,开心跳 + 爱心,心情 ↑ |
| 双击小狮子 | 喂食,饥饿 ↑ |
| 按住拖动 | 把它拎到屏幕任意位置,松手就停在那(包括半空;走动/睡觉/跳跃都在这条线上,重启后还记得) |
| 右键宠物 | 菜单:喂食 / 摸头 / 睡觉 / 叫它过来 / ⏳一起专注 / 跳舞 / 打滚 / 追我玩 / 🎾丢飞盘 / 比心 / 生气 / 跺脚 / 歪头思考 / 打哈欠 / 🎩换配饰 / 🔊音效开关 / ✨氛围特效(可关) / 📊状态面板 / 🙈忙碌避让 / 🐾换个动物 / ➕再养一只 / ➖赶走一只 / 退出 |
- 一起专注:右键「一起专注」选时长(5 / 15 / 25 分钟),小狮子会安静地蹲在桌面陪你,头顶走一个番茄钟倒计时(药丸+进度条)。专注期间它不乱跑、不闹腾、不喊饿;到点会欢呼提醒你「起来活动、喝口水」。专注中右键即可「结束专注」。非专注时,每隔一段时间它还会贴心提醒喝水 / 起身 / 护眼 / 伸展。
- 丢飞盘:右键「丢飞盘给它捡」,飞盘抛出去后它会冲过去叼住,再叼回到你鼠标旁边放下,眼巴巴等你再扔一个。
桌面其它区域的点击会直接穿透到下面的应用,完全不挡你干活 —— 只有鼠标移到小狮子身上时窗口才会「接住」鼠标。
不用你管,小狮子会根据情境自动做出合适的反应(都带冷却,不会太频繁):
- 按时间问候:早上「早安~」、中午「该吃饭咯」、傍晚「辛苦啦」、深夜「早点休息」;深夜更容易犯困打哈欠。
- 看鼠标动作:在它附近快速移动→ 好奇地追上去;猛地划过身上→ 吓一跳;在身边晃 → 把睡着的它叫醒;慢慢靠近 → 打招呼。
- 你在忙时(忙碌避让,默认开):鼠标在它附近活动(浏览网页 / 操作)时,它会自动让到屏幕边,不挡着你;鼠标走远再恢复溜达。右键「🙈 忙碌时让到一边」可开关。
- 像是没人时(鼠标很久没动)→ 自己发呆、打哈欠、溜达或睡觉。
- 按心情 / 肚子:很饿 → 跺脚或可怜巴巴要吃的;心情好 → 跳舞、打滚、比心;心情低落 → 没精神、发呆、睡觉。
- 被连戳(短时间戳很多下)→ 戳烦了会生气「别戳啦!」。
- 养了不止一只时:它们凑近会自己一起玩 —— 打招呼、你追我跑、挨在一起蹭蹭头冒爱心,或者打闹滚成一团卡通烟雾(里头蹦出小爪子和星星火花),玩完各自加一点亲密度。
- 节日:每年 12 月自动戴上圣诞帽 🎄。
想调节奏 / 概率,改 renderer.js 里的 decideNextAction() 和「鼠标场景反应」那段。
- 换个动物:右键「🐾 换个动物」在 狮子🦁 / 小猫🐱(尖耳+胡须)/ 小狗🐶(垂耳)/ 小兔🐰(长耳+门牙,白绒)/ 熊猫🐼(黑眼圈+黑耳黑肢)间切换 —— 造型变,动作和性格通用。
- 换配饰:右键「🎩 换配饰」循环 无 / 圣诞帽🎄 / 墨镜😎 / 围巾🧣 / 蝴蝶结🎀 / 皇冠👑;每年 12 月默认戴圣诞帽。
- 氛围特效:右键「✨ 氛围特效」子菜单直接选 关闭 / 下雪❄️ / 下雨🌧️ / 落叶🍂 / 花瓣🌸 / 星空✨ / 萤火虫✨(当前项打勾,一键关闭)。飘落的雪·雨·叶·花会被缓缓起伏的风吹得左右摆动;未手动设置时也会按季节·时间自动出现(秋叶、夜星、春花、夏夜萤火虫),手动关闭后会被记住。
- 亲密度养成:摸头 / 喂食 / 比心 / 一起玩(接飞盘、抓蝴蝶、玩球)以及日常陪伴都会一点点积累 亲密度;跨过「熟悉 → 亲密 → 形影不离」的里程碑时它会比心庆祝。右键「📊 状态面板」可随时查看 ❤心情 / 🍖饱腹 / 🤝亲密 三条进度。
- 全局快捷键(应用不在前台也生效):
⌘⇧D跳舞 ·⌘⇧L比心 ·⌘⇧K叫它过来 ·⌘⇧J打滚。 - 记忆:位置 / 心情 / 饥饿 / 亲密度 / 配饰 / 音效 / 特效 / 种类 / 状态面板开关都会自动存档,重启后恢复;离开久了回来,它会喊饿、跟你打招呼。
渲染层是纯网页技术,直接用浏览器打开 index.html 就能看到小狮子并和它互动
(只是少了「全屏透明置顶 + 鼠标穿透」那层桌面叠加效果,右键菜单/退出也不可用)。
都在 renderer.js 里,改起来很直观:
- 配色:文件顶部
COLOR = { ... }(鬃毛色、脸色、腮红等) - 体型大小:底部
lion.size = ...(或固定成你喜欢的值,如1.1) - 初始位置:
lion.x = W * 0.5(默认屏幕中下方) - 饿/掉心情的速度:
update()里lion.hunger -= dt * 0.55等 - 台词:各处
say(pick([...]))里的文案 - 走动 / 待机节奏:
idleTimer、startWalk()的速度speed = 70
desktop-pet/
├── package.json # 依赖与启动脚本
├── main.js # Electron 主进程:全屏透明置顶窗口 + 鼠标穿透 IPC + 右键菜单
├── preload.js # 安全地把有限 IPC 能力暴露给渲染层
├── index.html # 透明舞台 + 一块铺满屏幕的 canvas
└── renderer.js # 小狮子全部逻辑:绘制 / 动画 / 物理 / 状态机 / 交互
- 主进程创建一个铺满整个屏幕的窗口:
transparent + frame:false + alwaysOnTop, 并用setAlwaysOnTop(win, 'screen-saver')顶到最上层。 - 窗口默认开启鼠标穿透
setIgnoreMouseEvents(true, { forward: true }), 所以点击会落到下面的应用,但鼠标移动事件仍会转发给渲染层。 - 渲染层每帧做命中检测:鼠标一旦移到小狮子身上,就通过 IPC 让主进程 临时关闭穿透(窗口「接住」鼠标),移开再恢复。这样既能互动又不挡操作。