基于微信小程序的奥拉星角色换装搭配工具,支持实时预览、部件调色、搭配保存等功能。
- 🎨 换装搭配:三栏布局(分类栏 / 角色展示区 / 服装面板),支持按分类浏览和搜索服装
- 👀 实时预览:Canvas 实时渲染角色形象,支持全屏模式、手势缩放与拖动
- 🎨 部件调色:支持对服装部件进行自定义调色
- 📸 截图保存:支持透明背景截图,保存搭配效果图
- 💾 搭配存档:保存 / 加载搭配方案,方便管理多套搭配
- 🌈 多主题:内置多种主题配色方案
- 🤖 小助手:集成发包工具、账号管理、亚比查询等实用功能
- 👫 双模型:支持男/女角色模型切换
aola-nuannuan-wx/
├── app.js # 小程序入口
├── app.json # 全局配置
├── app.wxss # 全局样式
├── project.config.json # 项目配置
├── sitemap.json # 站点地图
├── images/ # 图片资源
├── pages/
│ ├── index/ # 主页面 - 换装搭配
│ │ ├── index.js
│ │ ├── index.json
│ │ ├── index.wxml
│ │ └── index.wxss
│ └── helper/ # 小助手页面
│ ├── helper.js
│ ├── helper.json
│ ├── helper.wxml
│ └── helper.wxss
└── utils/ # 工具模块
├── amf3.js # AMF3 协议解析
├── avatarRenderer.js # 角色渲染引擎
├── clothDefine.js # 服装定义数据
├── configLoader.js # 配置加载器
├── gameClient.js # 游戏客户端通信
├── outfitToken.js # 搭配令牌处理
├── protocol.js # 通信协议
└── themes.js # 主题配色方案
-
克隆本仓库:
git clone https://github.com/satoing/aola-nuannuan-wx.git
-
打开微信开发者工具,导入项目目录
-
在项目配置中填入你的小程序 AppID(或使用测试号)
-
编译运行即可预览
- 框架:微信小程序原生开发
- 渲染:Canvas 2D API
- 通信:WebSocket + AMF3 协议
- UI:自定义组件 + 横屏布局
本项目仅供学习交流使用。