注册 登录
主题 : CocosCreator + 动态获取和修改精灵纹理 简易教程
级别: 侠客
UID: 503086
精华: 11
发帖: 140
可可豆: 830 CB
威望: 625 点
在线时间: 275(时)
注册时间: 2015-09-05
最后登录: 2018-12-02
0 楼:  发表于: 2016-02-17 17:05    发自: Web Page

CocosCreator + 动态获取和修改精灵纹理 简易教程   

管理提醒: 本帖被 panda 设置为精华(2016-02-17)
->前往教程司令部
New: 教程司令部已经更新了教程 往后不再使用链式的教程结构

假如我们有很多张图片

比如说这里演示的头像



我们想要动态在Assert上获取这些图片并且修改Sprite上的spriteFrame

那么可以这么做



我们先演示一下



原先的纹理是黄色头发的小女孩 修改纹理的脚本和精灵组件在一个节点上

然后我们运行一下



纹理已经替换了

那么我讲一下限制条件

第一 不能读plist图集

我这边出了点问题不能打包  

我用另一个打包好的项目说一下



那么上面是之前打包后plist的目录  实际上只剩下了大图
小图的plist信息都成json文件了  

而我们之前代码里面的
var realUrl = cc.url.raw('image/girl233.png');
实际上是将CocosCreator项目里的目录映射到打包后项目的目录里
这个是console.log('realUrl');的信息

那么动态获取RawAssert图片的过程我们大概就有底了
plist的小图在打包后的项目里根本就没有那张小图 只有大图
之后会测试能不能用cc.loader.loadJSON
不过目前用这用方法是不能读plist的小图的
只能拆开来

那么第二 一开始Sprite节点上必须要有一个default SpriteFrame
为什么呢
我们试一下SpriteFrame置空 然后console.log(this.getComponent(cc.Sprite));


我们就会发现找不到setTexture方法
为什么呢= =
我们将上面Sprite的信息展开

这就是为什么我们一开始要设置一个default SpriteFrame了
因为setTexture方式是从spriteFrame那边拿过来的
如果一开始没有纹理
就拿不到spirteFrame
也拿不到setTexture方法
也就换不了纹理了

那么 代码: RawAssertGuide

->前往教程司令部

下一篇:CocosCreator + 通过atlas动态修改纹理 简易教程

[ 此帖被linhaiwei123在2016-02-18 17:45重新编辑 ]

清空我的评分动态本帖最近评分记录: 共1条评分记录
panda 可可豆 +10 2016-02-17 -
隐藏评分记录
级别: 版主
UID: 7757
精华: 1
发帖: 183
可可豆: 221 CB
威望: 221 点
在线时间: 125(时)
注册时间: 2009-08-11
最后登录: 2016-04-04
1 楼:  发表于: 2016-02-17 17:43    发自: Web Page
实用 !接地气 !
级别: 版主
UID: 7757
精华: 1
发帖: 183
可可豆: 221 CB
威望: 221 点
在线时间: 125(时)
注册时间: 2009-08-11
最后登录: 2016-04-04
2 楼:  发表于: 2016-02-17 17:44    发自: Web Page
话说,有空编辑一下教程司令部啊,你的新教程都没加上去
级别: 侠客
UID: 503086
精华: 11
发帖: 140
可可豆: 830 CB
威望: 625 点
在线时间: 275(时)
注册时间: 2015-09-05
最后登录: 2018-12-02
3 楼:  发表于: 2016-02-17 19:29    发自: Web Page
回 2楼(panda) 的帖子
一直点下一篇就能找到啦
级别: 新手上路
状态: 连续签到 - [1天]
UID: 541275
精华: 0
发帖: 6
可可豆: 28 CB
威望: 29 点
在线时间: 41(时)
注册时间: 2016-01-28
最后登录: 2017-10-24
4 楼:  发表于: 2016-02-23 15:32    发自: Web Page
V0.7.1 测试只适应网页,其他环境不行。包括 cc.textureCache.addImage 加入回调方法
级别: 版主
UID: 7757
精华: 1
发帖: 183
可可豆: 221 CB
威望: 221 点
在线时间: 125(时)
注册时间: 2009-08-11
最后登录: 2016-04-04
5 楼:  发表于: 2016-02-23 15:41    发自: Web Page
引用
引用第4楼fly2012于2016-02-23 15:32发表的  :
V0.7.1 测试只适应网页,其他环境不行。包括 cc.textureCache.addImage 加入回调方法




如果你使用 Cocos2d-x 最新版本的话应该是没有问题的,JSB 的 addImage 支持加载远程图片,你的 -x 版本是?

级别: 新手上路
UID: 260737
精华: 0
发帖: 26
可可豆: 98 CB
威望: 98 点
在线时间: 238(时)
注册时间: 2013-07-15
最后登录: 2017-10-31
6 楼:  发表于: 2016-02-24 17:17    发自: Web Page
请问如果是合图要怎么写
级别: 新手上路
UID: 218250
精华: 0
发帖: 21
可可豆: 21 CB
威望: 21 点
在线时间: 29(时)
注册时间: 2013-04-12
最后登录: 2016-04-13
7 楼:  发表于: 2016-03-16 13:30    发自: Web Page
支持,不错
级别: 新手上路
UID: 442805
精华: 0
发帖: 7
可可豆: 25 CB
威望: 25 点
在线时间: 39(时)
注册时间: 2015-02-27
最后登录: 2016-05-30
8 楼:  发表于: 2016-03-24 00:08    发自: Web Page
这里很奇怪,完全看不懂。根据官方api文档spriteFrame继承自Asset,asset继承字rawasset,也就是说没有setexture()方法,这里的这个settexture方法是哪里来的?官方api中settexture只有TextureAtlas存在这个方法,有什么联系么?我把settexture修改为官方api中的_refreshTexture(texture)似乎也是生效的,效果有区别;这里面有什么关系么?感觉官方api很乱啊,看api基本上解决不了什么问题。。。。求解啊。
级别: 新手上路
UID: 537118
精华: 0
发帖: 1
可可豆: 1 CB
威望: 1 点
在线时间: 21(时)
注册时间: 2016-01-08
最后登录: 2018-07-19
9 楼:  发表于: 2016-08-17 12:17    发自: Web Page
请教!和楼主一样的代码,为什么图片显示不出来?
用的cocoscreator版本是1.2.0
cc.Class({
    extends: cc.Component,

    properties: {
        
    },
    // use this for initialization
    onLoad: function () {
        var realUrl = cc.url.raw('resources/girl114.png');
        var texture = cc.textureCache.addImage(realUrl);
        this.getComponent(cc.Sprite).spriteFrame.setTexture(texture);
    },
    // called every frame, uncomment this function to activate update callback
    // update: function (dt) {
    // },
});
图片:22.jpg

CocoaChina社区转载内容已尽可能注明出处,如未能核实来源或转发内容图片有权利瑕疵的,请及时联系社区进行修改或删除【联系方式QQ : 3442093904 邮箱:support@cocoachina.com】文章内容为作者独立观点,不代表CocoaChina社区立场。版权归原作者所有,如申请授权请联系作者,因文章侵权CocoaChina社区不承担任何法律及连带责任。

描述
快速回复

关注本帖(如果有新回复会站内信通知您)

发帖、回帖都会得到可观的积分奖励。查看论坛积分规则

按"Ctrl+Enter"直接提交
    顶部