背景

引擎版本cocoscreator v 2.4.2,语言javascript。

情况1

用户头像为非微信头像,即公司服务器头像加载,需首先设置存放用户头像的静态资源服务器运行跨域;如果配置了域名,则设置域名运行跨域,前端代码代码实现如下:

/**
     * 渲染头像
     * @param {cc.Sprite} spAvatar  头像节点
     * @param {String} url          头像地址
     * @returns 头像地址为空时 返回
     */
    renderAvatar(spAvatar, url){
    	//空地址判断
        if(url == '')return;
	    //非微信头像
	    cc.assetManager.loadRemote(url, function (err, texture) {
	        //资源加载成功
	        if(err === null){
	        	//将texture对象转为SpriteFrame资源对象
	            let spriteFrame = new cc.SpriteFrame(texture);
	            //渲染对象
	            spAvatar.spriteFrame = spriteFrame;
	            //因引擎自身原因这里需进行延迟显示(跳过当前帧)
	            spAvatar.node.opacity = 0;
	            setTimeout(()=>{
	                spAvatar.node.width = 120;
	                spAvatar.node.height = 120;
	                spAvatar.node.opacity = 255;
	            }, 1);
	        }else{
	            log.debug('远程资源加载失败:', err);
	        }
	    });
	}

情况2

用户头像为微信头像,即用户注册为新用户后,默认使用微信头像。前端代码代码实现如下:

    /**
     * 渲染头像
     * @param {cc.Sprite} spAvatar  头像节点
     * @param {String} url          头像地址
     * @returns 头像地址为空时 返回
     */
    renderAvatar(spAvatar, url){
		//空地址判断
        if(url == '')return;
        //创建Image对象
        let img = new Image();
	    img.crossOrigin = 'Anonymous';
	    img.src = url;
	    //将传统网页Image对象转为cocos纹理对象
	    let texture2D = new cc.Texture2D();
	    texture2D.initWithElement(img);
	    //将纹理转为SpriteFrame类型的资源
	    let spriteFrame = new cc.SpriteFrame(texture2D);
	    //渲染图片资源
        spAvatar.spriteFrame = spriteFrame;
	}

汇总

以上两种方式,可以统一在游戏工具类中封装成一个方法,并设置远程资源缓存对象池,根据用户唯一标识性ID进行map中的key-value映射。这样,每个用户头像只需远程加载一次成功后,即可缓存至本地。
至此,结束。

Logo

这里是一个专注于游戏开发的社区,我们致力于为广大游戏爱好者提供一个良好的学习和交流平台。我们的专区包含了各大流行引擎的技术博文,涵盖了从入门到进阶的各个阶段,无论你是初学者还是资深开发者,都能在这里找到适合自己的内容。除此之外,我们还会不定期举办游戏开发相关的活动,让大家更好地交流互动。加入我们,一起探索游戏开发的奥秘吧!

更多推荐