如何在 Cocos2dx 中为 ProgressTimer 的 Sprite 添加标签？答案

【问题标题】：How to add a Label to a ProgressTimer's Sprite in Cocos2dx?如何在 Cocos2dx 中为 ProgressTimer 的 Sprite 添加标签？
【发布时间】：2015-04-26 22:49:49
【问题描述】：

我正在尝试让 ProgressTimer 与 Sprite 一起工作，而 Label 小时候有 Label。似乎只有 Sprite 并且没有它的孩子被用作进度条的精灵。

我已经创建了标签，并将其添加到精灵中。我将精灵添加到ProgressTimer 和场景中，因为我想确保它看起来不错。从场景中移除标签并仅将其提供给ProgressTimer 似乎并没有什么不同。

然后我使用Sprite 创建ProgressTimer，对其进行配置，然后将其添加到我的场景中。

我曾短暂研究过使用 RenderTexture 创建纹理并将其传递到 Sprite 并从那里开始工作，但没有看到更模糊的颠倒 mysprite.png。

如何让Sprite 中的Label 显示在我的场景中的ProgressTimer 上？

//init label
Label* lbl = Label::createWithTTF("My label", "fonts/Marker Felt.ttf", 24);
lbl->setTextColor(Color4B::RED);

//init sprite
Sprite* sprite = Sprite::create("mysprite.png");
sprite->addChild(lbl);

scene->addChild(sprite); //make sure it works normally

auto progress_timer = ProgressTimer::create(sprite);

progress_timer->setScale(1.5);
progress_timer->setPercentage(100);

scene->addChild(progress_timer);

【问题讨论】：

查看 cocos 源码，进度计时器似乎直接从 sprite 获取纹理。然后必须手动创建纹理。

标签： c++ cocos2d-x cocos2d-x-3.0

【解决方案1】：

最简单的解决方案是使用现有的 ProgressTimer，并在构建时嵌入您的标签（作为资产资源的一部分），或者如果您想动态更改标签，则使用 RenderTexture。

我见过一些游戏的标签和进度背景始终可见，只是让条本身填满。通常当它是一个健康栏或加载时，所以你可能想考虑添加一个背景，这样在进度填满时标签不会看起来很奇怪。

您还可以考虑使用 ClippingNode 或自定义命令构建自己的精灵+标签进度计时器。标签基本上是 spritebatch 中的一组 sprite。不过，这将是一些工作。

要使用 RenderTexture，如下所示：

Size size = sprite->getContentSize();

auto rt = RenderTexture::create(size.width, size.height, Texture2D::PixelFormat::RGBA8888);
rt->setAutoDraw(true);
rt->addChild(sprite);
rt->addChild(label);
auto rtSprite = Sprite::createWithTexture(rt->getSprite()->getTexture());
ProgressTimer* progress = ProgressTimer::create(rtSprite);

【讨论】：

谢谢。我会检查setAutoDraw 并尝试一下，而不是做我之前尝试的begin 和end 的东西。这可能是我得到奇怪结果的原因。
很酷，begin() 和 end() 应该给你相同的结果（内部自动绘制只是调用 begin/end 并对其子项进行访问），但希望自动绘制对你有用。
谢谢伙计。我很难让它继续下去，但我确信这是正确的答案。你在某个地方有一个回购协议，我可以在其中看到这些东西的运行情况吗？此外，现在您正在使用原始精灵创建进度计时器，而不是 rtsprite，哈哈。
大声笑，在 stackoverflow 编辑器中从头开始编写代码：D 我会寻找一些实际代码，可能测试项目会是最好的
我认为问题在于立即使用纹理并没有给 RT 时间来实际绘制。使用begin 和end 函数让它实际绘制。我使用它的方式是创建一次进度条的精灵，然后即时重绘进度条。似乎 RT 是用于不断更新或其他什么的。

【解决方案2】：

感谢@SteveTranby 的解决方案，我找到了一个适合我的解决方案。设置 AutoDraw 的问题在于，我认为它希望运行预定的更新，所以它实际上不会渲染任何东西，除非你在导演的渲染器上调用 render，所以我求助于手动绘制精灵。

我也遇到了失真问题，因此我禁用了抗锯齿功能并确保我根本没有进行任何缩放。我将锚点设置为 1,1，因为默认值 0,0 截断了一半的图像，然后我还不得不翻转图像。我不知道为什么。

//sprite for base layer
auto prog_sprite = Sprite::create("progbar.png");
auto fmt = prog_sprite->getTexture()->getPixelFormat();
auto size = prog_sprite->getContentSize();

auto lbl = Label::createWithTTF("label text", "fontpath, size.height);
lbl->setTextColor(Color4B::RED);

//sprite for label
auto lbl_sprt = Sprite::create();
lbl_sprt->addChild(lbl);
rt = RenderTexture::create(size.width, size.height, fmt);

rt->begin();
//draw base sprite to texture
prog_sprite->getTexture()->setAliasTexParameters();
prog_sprite->setAnchorPoint(Vec2(1, 1));
prog_sprite->setPosition(size.width, size.height);
prog_sprite->visit();

//draw label sprite to texture
lbl_sprt->setAnchorPoint(Vec2(1, 1));
lbl_sprt->setPosition(10, 10);
lbl_sprt->visit();
rt->end();

//create a sprite from the new texture
Texture2D* text2d = rt->getSprite()->getTexture();
text2d->setAliasTexParameters();
auto final_sprite = Sprite::createWithTexture(text2d);
final_sprite->setFlippedY(true);

//create the final progresstimer
this->prog_timer = ProgressTimer::create(final_sprite);

在纹理之前的精灵上的大多数方法，例如锚点和翻转它，似乎并不重要。位置可以。

请注意，如果您在已经调用过一次 setPercentage 之后在 ProgressTimer 上setSprite，则需要将其设置为另一个值，然后再返回，以便更新内部精灵/纹理。我认为这是一个错误，所以要小心。

【讨论】：

【解决方案3】：

我最近重新处理了这个问题，并找到了一个实际的解决方案。事实证明@SteveTranby 一开始不使用 renderTexture 是对的。

auto lbl = Label::createWithTTF("label string", my_font_name, 25);
lbl->setAnchorPoint(Vec2(0.5f, 0.5f));
auto front_size = my_progress_timer->getContentSize();
lbl->setPosition(Vec2(
    front_size.width/2.0f,
    front_size.height/2.0f
));
lbl->setTextColor(Color4B::BLACK);
my_progress_timer->addChild(lbl);

足以做我想做的事。我不确定为什么这以前不起作用。

【讨论】：