Skip to content

Repository files navigation

桌面宠物

一个可爱的桌面宠物应用,使用 Electron + Vue 3 构建的跨平台桌面应用。

功能特性

核心功能

  • 🐱 多形态宠物 - 支持 8 种宠物形态:云朵、猫咪、熊猫、兔子、小鸡、小狗、企鹅、青蛙,可自由切换
  • 🎭 丰富表情 - 30+ 种状态动画(空闲、行走、跳跃、睡觉、开心、哭泣、生气、吃东西、洗澡等)
  • 🖱️ 多种互动 - 单击反应、双击快捷面板、拖拽移动
  • 👣 脚印轨迹 - 移动时留下渐隐的脚印效果
  • 💬 对话气泡 - 宠物会显示可爱的对话气泡
  • 🔊 语音系统 - 支持浏览器内置 TTS 和 Edge TTS(微软在线语音,高质量中文)
  • 🤖 AI 对话 - 接入大模型 API,宠物能根据对话内容切换表情、执行动作、回答问题
  • 🌓 主题适配 - 自动检测系统深色/浅色主题
  • 💾 状态保存 - 自动保存宠物状态和用户数据
  • 🪟 鼠标穿透 - 宠物区域可交互,其他区域鼠标穿透

天气系统

  • 🌤️ 真实天气 - 接入和风天气 API,根据实时天气显示对应天气背景
  • 📍 自动定位 - 通过 IP 定位获取当前位置
  • 🔄 定时更新 - 每 10 分钟自动更新天气

属性系统

  • 🍖 饱腹值 - 需要喂食维持,低于 30 时健康下降
  • 🛁 清洁值 - 需要洗澡维持,低于 30 时健康下降
  • 体力值 - 打工消耗,睡眠恢复,为 0 时强制睡觉
  • ❤️ 健康值 - 受饱腹/清洁影响,固定上限 100
  • 😊 心情值 - 受属性、天气、互动影响,影响宠物行为

等级系统

  • 经验升级 - 互动和陪伴获得经验,最高 40 级
  • 📈 属性成长 - 等级提升增加饱腹/清洁/体力上限
  • 🎯 每日限制 - 每日交互经验上限 10 点

经济系统

  • 💰 金币货币 - 打工赚取金币,用于购买物品
  • 💼 打工系统 - 三种打工方式:
    • 🧱 搬砖:30 分钟,收入 35 金币,经验 35
    • 📢 发传单:15 分钟,收入 10 金币,经验 25
    • 💻 写代码:45 分钟,收入 50 金币,经验 50
  • 🎁 每日救济 - 金币低于 50 时自动发放 10 金币

商店系统

  • 🍽️ 食物 - 7 种食物,恢复不同饱腹值
  • 🛁 沐浴露 - 4 种沐浴用品,恢复不同清洁值
  • 💍 装饰品 - 8 种装饰,提供功能性加成
  • 🐾 形态 - 可购买解锁新宠物形态

装饰系统

  • 🎀 多槽位装备 - 头部、脸部、颈部、手部四个槽位
  • 功能效果 - 装饰品提供各种属性加成:
    • 体力恢复加成
    • 饱腹/清洁衰减减缓
    • 健康恢复加成
    • 打工收入加成
    • 打工时间缩短
  • 📦 仓库管理 - 物品购买后存入仓库,按需使用

心情系统

  • 😊 心情等级 - 良好(70+)、一般(30-69)、低落(<30)
  • 🌤️ 天气影响 - 晴天心情好,雨天心情差
  • 🍖 属性影响 - 饥饿、肮脏会降低心情
  • 💤 睡眠恢复 - 睡眠中心情逐渐恢复

作息系统

  • 🌙 睡眠设置 - 可自定义睡眠时间段
  • 😴 自动睡眠 - 到时间自动进入睡眠状态
  • 💭 梦话系统 - 睡眠中会说梦话

数据统计

  • ⏱️ 陪伴时长 - 记录累计陪伴时间
  • 👆 互动次数 - 记录点击、拖拽等互动
  • 📊 详细数据 - 记录各种行为统计数据

系统托盘

  • 🔔 托盘图标 - 托盘控制宠物显示/隐藏
  • 📋 快捷菜单 - 托盘右键菜单快速操作

技术栈

  • 前端框架: Vue 3
  • 桌面框架: Electron
  • 构建工具: Vite
  • 类型检查: TypeScript

快速开始

环境要求

  • Node.js >= 18
  • npm >= 9

安装依赖

npm install

开发模式

# 启动 Web 开发服务器
npm run dev

# 启动 Electron 开发模式
npm run electron:dev

构建打包

# 构建 Web 版本
npm run build

# 构建 Electron 应用
npm run electron:build

# 预览 Electron 构建
npm run electron:preview

代码检查

npm run lint

语音系统配置

宠物支持语音播报对话内容,提供两种语音引擎:

浏览器内置 TTS

  • 无需额外配置,开箱即用
  • 使用系统自带的语音合成
  • 支持中文,但音质较机械

Edge TTS(推荐)

  • 使用微软 Edge 浏览器的在线语音合成
  • 音质自然,中文效果优秀
  • 需要网络连接

安装 Edge TTS

pip3 install edge-tts

安装完成后,在设置面板中选择「Edge」语音引擎即可使用。

语音设置

右键点击宠物 → 设置 → 语音设置:

  • 启用语音 - 开启/关闭语音播报
  • 语音引擎 - 选择浏览器或 Edge TTS
  • 语速 - 调整语音播放速度
  • 音调 - 调整语音音调
  • 音量 - 调整语音音量

语音输入功能

AI 对话面板支持语音输入,可以直接说话与宠物对话。

功能特性

  • 🎤 本地语音识别 - 使用 Whisper 本地模型,无需联网
  • 📝 实时转文字 - 说话内容自动转为文字填入输入框
  • 🇨🇳 中文支持 - 针对中文优化,识别准确率高
  • 🔒 隐私保护 - 所有处理在本地完成,数据不上传

安装准备

语音输入需要以下依赖(仅需安装一次):

macOS

1. 安装 sox(录音工具)

brew install sox

2. 安装 whisper-cpp(语音识别引擎)

brew install whisper-cpp

3. 下载语音识别模型(约 150MB)

mkdir -p ~/.whisper-models
curl -L "https://huggingface.co/ggerganov/whisper.cpp/resolve/main/ggml-base.bin" \
  -o ~/.whisper-models/ggml-base.bin

Windows

1. 安装 sox(录音工具)

2. 安装 whisper-cpp(语音识别引擎)

使用 Chocolatey(推荐):

choco install whisper-cpp

或手动安装:

3. 下载语音识别模型(约 150MB)

# 在 PowerShell 中执行
$modelDir = "$env:USERPROFILE\.whisper-models"
New-Item -ItemType Directory -Force -Path $modelDir
Invoke-WebRequest -Uri "https://huggingface.co/ggerganov/whisper.cpp/resolve/main/ggml-base.bin" `
  -OutFile "$modelDir\ggml-base.bin"

使用方法

  1. 打开 AI 对话面板(右键宠物 → AI 对话)
  2. 点击输入框左侧的麦克风按钮
  3. 开始说话(支持中文)
  4. 再次点击麦克风按钮停止录音
  5. 识别的文字会自动填入输入框

文件说明

文件/依赖 作用 大小
sox 录制麦克风音频 ~2.5MB
whisper-cli 语音识别程序 ~10MB
ggml-base.bin 语音识别模型 ~150MB

故障排查

如果语音输入无法使用:

  1. 检查依赖安装

    macOS:

    which sox          # 应输出路径
    which whisper-cli  # 应输出路径
    ls ~/.whisper-models/ggml-base.bin  # 应存在

    Windows:

    where sox          # 应输出路径
    where whisper-cli  # 应输出路径
    Test-Path "$env:USERPROFILE\.whisper-models\ggml-base.bin"  # 应返回 True
  2. 检查麦克风权限

    • macOS: 系统设置 → 隐私与安全 → 麦克风 → 允许「桌面宠物」
    • Windows: 设置 → 隐私 → 麦克风 → 允许桌面应用访问麦克风
  3. 重启应用

    • 安装依赖后需要重启 Electron 应用

天气系统配置

宠物支持接入和风天气 API,根据实时天气自动显示对应的天气背景效果。

获取 API Key

  1. 访问 和风天气开发平台 注册账号
  2. 进入控制台创建应用,选择「Web API」
  3. 复制生成的 API Key

配置方式

在项目根目录创建 .env.local 文件:

VITE_QWEATHER_API_KEY=你的API密钥
VITE_QWEATHER_API_HOST=你的API域名
VITE_AMAP_KEY=你的高德地图Key

配置说明:

  • VITE_QWEATHER_API_KEY:在和风天气控制台获取的 API Key
  • VITE_QWEATHER_API_HOST:API 请求域名
    • 免费版:devapi.qweather.com
    • 付费版:在你的和风天气控制台查看(如 nj6cdptmha.re.qweatherapi.com
  • VITE_AMAP_KEY:高德地图 API Key(用于 IP 定位)

配置完成后启动应用,天气服务将自动运行:

  • 通过 IP 定位获取当前位置
  • 每 10 分钟更新一次天气
  • API 调用失败时保持现有天气不变

支持的天气类型

实时天气 宠物背景效果
晴、少云 晴天光效
多云、阴 云朵漂浮
小雨、阵雨 小雨动画
中雨、大雨、暴雨 暴雨动画
雷阵雨 雷暴闪电
小雪、阵雪 小雪飘落
中雪、大雪、暴雪 大雪纷飞
雾、霾、沙尘 默认背景

AI 对话功能

宠物支持接入大模型 API,实现智能对话互动。

功能特性

  • 💬 自然对话 - 与宠物进行中文对话
  • 🎭 表情联动 - 根据对话内容自动切换表情(开心、难过、生气等)
  • 🍖 动作执行 - 通过对话让宠物吃饭、洗澡、打工
  • 📊 状态感知 - 宠物知道自己的属性、位置、天气,能如实回答
  • ⚙️ 多 API 支持 - 支持标准 OpenAI 格式及微博 AIGC 代理格式

配置方式

  1. 右键点击宠物,选择「AI 对话」打开聊天面板
  2. 点击设置图标,配置 API 信息:
    • API 地址:如 https://api.openai.com/v1/chat/completions
    • API Key:你的 API 密钥
    • 模型:如 gpt-4o-mini
    • 请求格式:标准 OpenAI 或微博 AIGC 代理

对话示例

  • "你今天开心吗?" → 宠物根据心情值回答
  • "你饿不饿?" → 宠物根据饱腹值回答
  • "去吃饭" → 宠物自动进食(需有食物库存)
  • "去搬砖打工" → 宠物开始打工
  • "今天天气怎么样?" → 宠物根据实时天气回答

项目结构

pet/
├── electron/
│   ├── main.js           # Electron 主进程
│   ├── preload.cjs       # 预加载脚本
│   ├── edgeTTS.js        # Edge TTS 语音合成
│   ├── edgeTTS-ipc.js    # Edge TTS IPC 通信
│   └── icon.png          # 应用图标
├── src/
│   ├── components/
│   │   └── DesktopPet/
│   │       ├── composables/        # 组合式函数
│   │       │   ├── dialogue.ts       # 对话系统
│   │       │   ├── footprints.ts     # 脚印效果
│   │       │   ├── passthrough.ts    # 鼠标穿透
│   │       │   ├── petController.ts  # 宠物控制
│   │       │   ├── qweatherService.ts # 天气服务
│   │       │   ├── scheduleManager.ts # 作息管理
│   │       │   ├── sharedState.ts    # 共享状态
│   │       │   ├── stats.ts          # 数据统计
│   │       │   ├── theme.ts          # 主题适配
│   │       │   ├── attributes.ts     # 属性系统
│   │       │   ├── attributeStorage.ts # 属性存储
│   │       │   ├── llmService.ts     # AI 对话服务
│   │       │   ├── speech.ts         # 语音系统
│   │       │   └── useModal.ts       # 弹窗管理
│   │       ├── shapes/            # 宠物形态组件
│   │       │   ├── cloud/           # 云朵形态
│   │       │   ├── cat/             # 猫咪形态
│   │       │   ├── panda/           # 熊猫形态
│   │       │   ├── rabbit/          # 兔子形态
│   │       │   ├── chick/           # 小鸡形态
│   │       │   ├── dog/             # 小狗形态
│   │       │   ├── penguin/         # 企鹅形态
│   │       │   ├── frog/            # 青蛙形态
│   │       │   └── decorations/     # 装饰品组件
│   │       ├── effects/           # 状态效果组件
│   │       ├── foods/             # 食物组件
│   │       ├── dialogue/          # 对话气泡
│   │       ├── footprints/        # 脚印组件
│   │       ├── contextMenu/       # 右键菜单
│   │       ├── ChatPanel/         # AI 聊天面板
│   │       ├── QuickActionPanel/  # 快捷操作面板
│   │       ├── schedule/          # 作息设置弹窗
│   │       ├── stats/             # 数据统计弹窗
│   │       ├── attributes/        # 属性面板弹窗
│   │       ├── shop/              # 商店弹窗
│   │       ├── warehouse/         # 仓库弹窗
│   │       ├── constants.ts       # 常量定义
│   │       ├── types.ts           # 类型定义
│   │       ├── index.vue          # 桌面宠物组件
│   │       └── WeatherBackground.vue # 天气背景
│   ├── config/
│   │   └── weatherCodeMapping.ts # 天气代码映射
│   ├── types/
│   │   └── qweather.d.ts         # 天气 API 类型
│   ├── App.vue           # 根组件
│   └── main.ts           # 入口文件
├── public/               # 静态资源
├── CLAUDE.md             # Claude Code 项目说明
└── README.md             # 项目文档

宠物状态说明

状态 说明 触发方式
idle 空闲待机 默认状态
walking 行走移动 随机移动或拖拽
jumping 跳跃 随机触发
sleeping 睡觉 随机/作息触发
happy 开心 点击宠物
crying 大哭 随机触发
angry 生气 点击宠物
fallen 摔倒 点击宠物
scared 惊吓 点击宠物
thinking 思考 随机触发
smug 得意 点击宠物
shy 害羞 点击宠物
confused 疑惑 随机触发
hello 打招呼 启动时
sneeze 打喷嚏 随机触发
yawn 打哈欠 睡前触发
sleepy 睡眼朦胧 睡眠中被点击
sleepwalking 睡眠行走 睡眠中拖拽
stretch 伸懒腰 醒来时
scratch 挠头 随机触发
celebrate 庆祝 点击宠物/升级时
peek 偷看 随机触发
grin 坏笑 随机触发
dancing 跳舞 双击宠物
rolling 翻滚 双击宠物
eating 吃东西 饱腹值低时自动/AI指令
bathing 洗澡 清洁值低时自动/AI指令
brickCarrying 搬砖 打工选择/AI指令
flyerDistributing 发传单 打工选择/AI指令
programmer 写代码 打工选择/AI指令

宠物形态

形态 说明 特点
云朵 默认形态 柔软的云朵造型
猫咪 可爱猫咪 小猫造型,带耳朵胡须
熊猫 胖墩熊猫 圆润黑白配色,带眼圈
兔子 萌萌兔子 长耳朵,可爱造型
小鸡 萌鸡 黄色小鸡,圆圆眼睛
小狗 小狗 棕色小狗,摇摆尾巴
企鹅 企鹅 黑白配色,摇摆走路
青蛙 青蛙 绿色青蛙,大眼睛

支持的每种形态都会根据主题自动适配深色/浅色模式的颜色。

装饰品系统

装饰品列表

装饰 槽位 价格 效果
蝴蝶结 头部 300 体力恢复 +15%
围巾 颈部 480 饱腹衰减减缓 20%
花环 头部 720 健康恢复 +25%
礼帽 头部 900 打工收入 +20%
墨镜 脸部 1080 清洁衰减减缓 25%
勋章 颈部 1200 打工收入 +30%
皇冠 头部 1500 全属性衰减减缓 20%
魔法杖 手部 1800 打工时间 -20%,收入 +15%

槽位系统

  • 头部:蝴蝶结、花环、礼帽、皇冠(互斥)
  • 脸部:墨镜
  • 颈部:围巾、勋章(互斥)
  • 手部:魔法杖

最多同时装备 3 个装饰品。

交互方式

操作 效果
单击宠物 触发随机反应(开心、惊吓、摔倒、得意、害羞、庆祝)
双击宠物 显示快捷操作面板(喂食、洗澡、打工)
拖拽宠物 将宠物移动到屏幕任意位置
右键宠物 打开菜单(作息设置、商店、仓库、属性、AI对话等)
托盘图标 点击显示/隐藏宠物

右键菜单

右键点击宠物可打开功能菜单:

  • AI 对话 - 与宠物进行智能对话
  • 属性面板 - 查看宠物属性、装备装饰、开始打工、切换形态
  • 商店 - 购买食物、沐浴露、装饰品、新形态
  • 仓库 - 使用已购买的物品、装备/卸下装饰
  • 作息设置 - 设置宠物的睡眠时间段
  • 数据统计 - 查看与宠物的互动记录和陪伴数据

快捷操作面板

双击宠物可打开快捷操作面板,快速执行常用操作:

  • 🍖 喂食 - 自动选择库存中恢复值最高的食物
  • 🛁 洗澡 - 自动选择库存中恢复值最高的沐浴露
  • 💼 打工 - 自动选择收入最高且体力足够的工作

开发调试

项目包含调试面板,可以手动控制宠物状态、切换形态、选择食物等。

许可证

MIT

About

cute desktop-pet

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages