cocos2d js 3.2使用Scale9Sprite 九宫图

cocos2d js 3.2使用Scale9Sprite 九宫图,第1张

概述Scale9Sprite是一个非常方便的类,用这个类可以很好的处理图片的放大问题,指定了几个区域以后,可以使图片不失真的放大。 一个非常简单的使用例子: // 第一个rc参数是整体大小 第二个rc参数是中间区域的范围 var sprTV = new cc.Scale9Sprite(res.TV_9png, cc.rect(0, 0, 26, 26), cc.re

Scale9Sprite是一个非常方便的类,用这个类可以很好的处理图片的放大问题,指定了几个区域以后,可以使图片不失真的放大。


一个非常简单的使用例子:

        // 第一个rc参数是整体大小   第二个rc参数是中间区域的范围        var sprTV = new cc.Scale9Sprite(res.TV_9png,cc.rect(0,26,26),cc.rect(10,10,7,7));        sprTV.x = posMenuBtn.x;        sprTV.y = posMenuBtn.y;        sprTV.wIDth = rcmenuBtnBB.wIDth + 20;        sprTV.height = rcmenuBtnBB.height + 20;        this.addChild(sprTV,5);


上面是原图


使用后效果如下:



具体的可以参加官方例子里的Scale9SpriteTest。

这里附上2张图,上面的是不适用Scale9Sprite放大的,下面的 是使用Scale9Sprite放大的。




对比可以发现,使用了Scale9Sprite的,ABCD区域都没有拉伸,只对其他区域做了拉伸,这种拉伸的好处是,可以很好的处理各种圆角图片的拉伸问题,而不影响最终视觉效果。

总结

以上是内存溢出为你收集整理的cocos2d js 3.2使用Scale9Sprite 九宫图全部内容,希望文章能够帮你解决cocos2d js 3.2使用Scale9Sprite 九宫图所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1036197.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-24
下一篇 2022-05-24

发表评论

登录后才能评论

评论列表(0条)

保存