美文网首页
使用filter滤镜导致界面布局混乱问题

使用filter滤镜导致界面布局混乱问题

作者: 综合对接组 | 来源:发表于2016-06-14 18:06 被阅读0次

问题描述:

公司有部分产品里面有使用filter滤镜(比如将一个精灵置灰),导致场景内的布局混乱,临床表现为:精灵位置发生大幅度偏移,或放大,或变小等。这是一个非必现的问题,有时正常,有时不正常。这种问题是使用滤镜效果引起的,具体原因不明。所以只能走曲线救国的办法解决问题。

首先找到问题代码:

添加效果代码大概长这样:

local spr= D.img("xxx/xxx.png",{ class = CCFilteredSpriteWithOne }):to(parent):p(x, y)
-- 滤镜
local filters = filter.newFilter("GRAY", {})
spr:setFilter(filters)

local spr= U.loadSpriteFilter({
    imgName = xxx/xxx.png,
    filters = "GRAY",
}):to(parent):p(x, y)

恢复正常显示的代码:

local filters = filter.newFilter("BRIGHTNESS", {})
spr:setFilter(filters)
目前使用的解决方法是用 CCGraySprite 来代替用filter实现的精灵置灰效果(目前只发现使用灰色效果),原理是获取精灵的纹理然后创建一个和精灵一模一样的灰色精灵覆盖在上面,方法如下:

1.找到添加滤镜处的代码用下面的方法替换:

local spr= D.img("xxx/xxx.png"):to(parent):p(x, y)
-- 创建灰色精灵覆盖在 spr 上面
local gray = CCGraySprite:createWithTexture(spr:getTexture(), spr:getTextureRect())
gray = CCNodeExtend.extend(gray)
--添加到精灵spr同一位置就行了
gray:to(parent):p(x, y)  
-- 可以把灰色精灵绑定为spr的一个属性方便移除对应精灵的灰色效果
spr.gray = gray

2.恢复显示的代码替换为以下方法即可:
spr.gray:remove()


  • author :lan

  • date :2016-06-14
    更多

相关文章

  • 使用filter滤镜导致界面布局混乱问题

    问题描述: 公司有部分产品里面有使用filter滤镜(比如将一个精灵置灰),导致场景内的布局混乱,临床表现为:精灵...

  • CSS中filter滤镜的的用途

    1.CSS静态滤镜样式 (filter)(只有IE4.0以上支持) CSS静态滤镜样式的使用方法:{ filter...

  • ie滤镜filter

    静态滤镜: CSS静态滤镜样式的使用方法:{ filter : filtername( parameters1, ...

  • 如何把整个网页都变成黑白

    利用CSS的 filter: grayscale(1) 使用 filter 属性对元素应用滤镜效果的方法,匹配 S...

  • FFmpeg滤镜(1)

    FFmpeg滤镜Filter描述格式 1、FFmpeg滤镜Filter的参数排列方式 [输入流或标记名]滤镜参数[...

  • 滤镜

    滤镜 CIFilter *filter = [CIFilter filterWithName:@"滤镜种类"]; ...

  • VUE导致swiper 界面混乱

    今天采用vue+swiper开发,如果是静态图片,不通过请求服务器的方式是正常显示的,且可以左右滑动swiper。...

  • 使用css把彩色图片设置成黑白色

    IE下可以轻松实现,使用(filter:gray) CSS3 grayscale 实现滤镜 .gray{ ...

  • FFmpeg常用命令集

    滤镜解析 FFmpeg中filter分为: audio filter video filter Multimedi...

  • FFmpeg命令

    滤镜解析 FFmpeg中filter分为: audio filter video filter Multimedi...

网友评论

      本文标题:使用filter滤镜导致界面布局混乱问题

      本文链接:https://www.haomeiwen.com/subject/nveudttx.html