头像模块操作手册

本文档介绍头像模块的使用方法和相关配置。

头像相关逻辑封装

头像相关逻辑封装于：HeadAvatarModel.js

1. 不使用裁切，在背景图上按会预留透明区域来做头像展示

CCB 结构要求

参考收集系统排行榜：card_system_lagload/card_ranking/card_ranking_rank_item.ccb

1. 背景图层级要高于头像图
2. 默认头像图片路径：

   casino/user_profile_avatar/user_profile_avatar.plist/user_profile_avatar_empty.png

3. 将头像图圆调整到合适的缩放比例，不漏空

注意：背景条头像位置镂空透明

服务器字段要求

• 玩家名字： name
• 玩家ID： playerId
• 玩家头像ID： avatarId、facebookId、logo

使用方法

代码参考：CardRankItemController.prototype.refreshCellUI

if (!this._avatarModel) {
    this._avatarModel = new HeadAvatarModel(this._headIcon); // 参数为ccb中的头像图节点
}
this._avatarModel.setPlayerAvatar(rankData.facebookId); // 传入头像id

var name = this._avatarModel.getPlayerName(rankData, 12); // 根据玩家信息获取展示的玩家名称字符串
// 参数说明：
// 1: 排名信息
// 2: 最大长度
// 3: 默认展示名（可选，有些需求需要固定展示数量，即使没有玩家排名信息也要展示默认UI）
//    如果不传的话，默认展示问号：？？
//    有些需求需要展示Empty，根据需求传入参数

game.nodeHelper.setNodeText(this._nameLabel, name);

2. 需要根据固定形状裁切创建头像（常用于无背景图时，需要将默认的方形图裁切为圆形图）

CCB 结构要求

参考：card_system_lagload/card_ranking/card_ranking_honor_item2.ccb

1. 默认的方形、圆形头像存在： common/avatar_resource 目录下，plist中是通用的机器人头像，plist最后有default默认头像

   • 方形： square
   • 圆形： circle

2. 头像分两个节点来存放： 一个是真实玩家的头像，另一个是机器人头像，结构必须严格按照下图

服务器字段要求

• 玩家名字： name
• 玩家ID： playerId、id
• 玩家头像ID： avatarId、facebookId、logo

使用方法

代码参考：CardRankHonorItemController.prototype.initWith

game.uIHelper.initPlayerAvatar(rankData, this._headRoot,
    this._headIcon, this._robotHeadImg, this, true);
// 具体参数对应节点可参考CardRankHonorItemController.js映射ccb中节点命名

注意事项

1. 背景图层级 必须高于头像图层级
2. 头像节点命名 要与代码中的映射保持一致
3. 默认头像路径 确保资源文件存在且路径正确
4. 圆形裁切 需要严格按照文档中的节点结构来创建CCB
5. 参数传递 注意区分真实玩家头像和机器人头像的节点引用

相关文件

• HeadAvatarModel.js - 头像模型类
• CardRankItemController.js - 排行榜条目控制器
• CardRankHonorItemController.js - 荣誉榜条目控制器
• card_system_lagload/card_ranking/card_ranking_rank_item.ccb - 排行榜UI结构
• card_system_lagload/card_ranking/card_ranking_honor_item2.ccb - 荣誉榜UI结构