当前位置：首页 > news >正文

美乐迪电玩客户端打包与资源替换实战教程

news 来源：原创 2025/4/24 20:10:31

本篇为《美乐迪电玩全套系统搭建》系列的第二篇，聚焦客户端层的实战操作，主要面向前端开发者、美术资源替换人员及整体项目的打包部署人员。教程将涵盖安卓客户端的构建、资源目录说明、动画素材替换方式及常见适配问题处理等。

一、客户端项目结构说明（Cocos Creator）

默认项目使用 Cocos Creator 2.4.x 或 2.2.2 开发，结构如下：

/meiledi_client
├── assets/                # 所有资源目录（UI、音效、脚本）
├── build-templates/       # 各平台打包模板
├── settings/              # 构建参数存储
├── jsb-default/           # 原生构建输出
├── project.json           # 工程基础配置
└── main.js                # 启动入口

二、UI资源与美术替换流程

1. 界面图层目录说明

路径：assets/resources/ui/

/ui/
├── hall/                  # 大厅界面
├── login/                 # 登录注册页
├── game/                  # 子游戏通用UI
├── spine/                 # 动画角色目录
└── common/                # 通用按钮、弹窗、特效

2. 替换示例 - 登录页背景图

步骤：

找到 assets/resources/ui/login/bg_login.png
使用 PhotoShop 替换为自定义图，尺寸必须一致。
保持文件名不变或在脚本中更新路径：

this.loginBg.spriteFrame = new cc.SpriteFrame("ui/login/bg_login");

3. Spine 动画替换流程

路径：assets/resources/ui/spine/

所需文件：.json + .atlas + .png

导入 Spine 动画：

将上述三个文件拖入 Spine目录。
在 Cocos 编辑器中自动生成 SkeletonData
替换节点：

this.node.getComponent(sp.Skeleton).skeletonData = this.newSpine;

三、安卓客户端打包流程

1. 构建原生项目

在 Cocos Creator 顶部菜单选择：

"项目 -> 构建发布" -> 平台选择 Android -> 输出路径 build/jsb-default -> 构建

2. Android Studio 打开并签名

使用 Android Studio 打开 build/jsb-default/frameworks/runtime-src/proj.android-studio
设置签名配置：

signingConfigs {release {storeFile file("keystore.jks")storePassword "123456"keyAlias "meiledi"keyPassword "123456"}
}

Build APK -> Release

3. 输出路径

输出文件位于：

/app/build/outputs/apk/release/app-release.apk

四、常见打包与适配问题

问题	说明
构建失败（找不到模块）	检查 assets 资源路径及脚本引用
黑屏或卡LOGO页	图集丢失或 Spine格式不兼容，建议用 Spine 3.8 导出
安卓闪退	没有设置 Android API Level ≥ 23，或权限未声明
打包后UI错乱	Canvas未设为自适应宽高，请打开 Canvas -> FitWidth + FitHeight