cocos2dx学习笔记之Scale9Sprite九宫格

本文介绍如何使用Scale9Sprite类实现精灵缩放时四角不变形的效果,并对比Sprite、Scale9Sprite及ImageView的不同表现。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

当有精灵缩放时,需要保持四个角不变,避免失真的需求时,需要使用到Scale9Sprite类,本文译作九宫格类.

需包含的头文件和命名空间如下:

#include "ui/UIScale9Sprite.h"
using namespace cocos2d::ui;

举个例子,代码和运行效果如下:

bool HelloWorld::init()
{
    if ( !Layer::init() )
    {
        return false;
    }
    
    auto rootNode = CSLoader::createNode("MainScene.csb");
    addChild(rootNode);


	Sprite* s0 = Sprite::create("btn0.png");
	s0->setPosition(190, 330);
	s0->setScaleX(0.5);
	addChild(s0);

	Scale9Sprite* sp = Scale9Sprite::create("btn0.png");
	sp->setPosition(720, 330);
	sp->setContentSize(Size(300, 192));
	addChild(sp);

	ImageView* i0 = ImageView::create("btn0.png");
	i0->setScale9Enabled(true);
	i0->setPosition(Vec2(190, 115));
	i0->setContentSize(Size(300,192));	
	addChild(i0);

	ImageView* imageView = (ImageView*)rootNode->getChildByName("Image_4");
	imageView->loadTexture("btn0.png");

    return true;
}


除了右下角的按钮,其他3个按钮是用代码创建的,可以看到使用精灵直接缩放的话,4个角会受到缩放影响变形。

使用Scale9Sprite或者ImageView对象缩放时,要注意这里使用的函数是setContentSize而不是setScale.

最下面2个按钮缩放是想说明ImageView自带了九宫格缩放功能,默认是未开启状态,可以手动调用setScale9Enabled(true);或者在CocosStudio里勾选九宫格选项.

右下角例子是想说明ImageView控件通过代码加载纹理时,如果自身大小和纹理大小不一致,则会发生缩放将纹理大小缩放至自身大小,此时可以根据需求选择是否开启setScale9Enabled(true),若ImageView通过LoadTexture加载纹理时发生了扭曲,则很可能也是九宫格缩放导致的,需设置setScale9Enabled(false)后再测试.

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

ellis1970

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值