Visible artifacts on DrawNode::drawCircle() with a corresponding lineWidth > 5 (window resizing issue) (#1050)

* Fix DrawNode::drawCircle() behavior itf the window is resizing.

* Update CCDrawNode.cpp

Tested also with
resourceSize(960, 640) or (1280, 720)
designSize(480, 320) or (400, 320);

Making a deal with the "boss"

* Update drawCircle and Tests

_lineWidth/4  is needed => the circle grow to fast without

---------

Co-authored-by: Deal(涓€绾跨伒) <halx99@live.com>
This commit is contained in:
aismann 2023-02-22 13:02:20 +01:00 committed by GitHub
parent b21b34ee66
commit cfcf541744
4 changed files with 46 additions and 41 deletions

View File

@ -355,7 +355,7 @@ void DrawNode::drawCircle(const Vec2& center,
float scaleX,
float scaleY,
const Color4B& color,
float minThickness)
float threshold)
{
const float coef = 2.0f * (float)M_PI / segments;
@ -367,10 +367,9 @@ void DrawNode::drawCircle(const Vec2& center,
vertices[i].x = radius * cosf(rads + angle) * scaleX + center.x;
vertices[i].y = radius * sinf(rads + angle) * scaleY + center.y;
}
if (_lineWidth > minThickness)
if (_lineWidth > threshold)
{
auto scaleFactor = AX_CONTENT_SCALE_FACTOR() * 2 ;
drawPolygon(vertices, segments, Color4B(1.0f, 0.0f, 0.0f, 1.0f), _lineWidth / scaleFactor, color);
drawPolygon(vertices, segments, Color4B(1.0f, 0.0f, 0.0f, 1.0f), _lineWidth/4, color);
}
else
{
@ -390,9 +389,9 @@ void DrawNode::drawCircle(const Vec2& center,
unsigned int segments,
bool drawLineToCenter,
const Color4B& color,
float minThickness)
float threshold)
{
drawCircle(center, radius, angle, segments, drawLineToCenter, 1.0f, 1.0f, color, minThickness);
drawCircle(center, radius, angle, segments, drawLineToCenter, 1.0f, 1.0f, color, threshold);
}
void DrawNode::drawQuadBezier(const Vec2& origin,

View File

@ -129,7 +129,7 @@ public:
* @param scaleX The scale value in x.
* @param scaleY The scale value in y.
* @param color Set the circle color.
* @param thickness Set the thickness and draws a better rendered polygon.
* @param threshold (optional) Set the threshold which will be draws a better rendered polygon.
*/
void drawCircle(const Vec2& center,
float radius,
@ -139,7 +139,7 @@ public:
float scaleX,
float scaleY,
const Color4B& color,
float minThickness = 200); // 200 should "simulate/save" th backwards compatibility
float threshold = 500); // 500 should "simulate/save" the backwards compatibility
/** Draws a circle given the center, radius and number of segments.
*
@ -149,7 +149,7 @@ public:
* @param segments The number of segments.
* @param drawLineToCenter Whether or not draw the line from the origin to center.
* @param color Set the circle color.
* @param thickness Set the thickness which will be draws a better rendered polygon.
* @param threshold (optional) Set the threshold which will be draws a better rendered polygon.
*/
void drawCircle(const Vec2& center,
float radius,
@ -157,7 +157,7 @@ public:
unsigned int segments,
bool drawLineToCenter,
const Color4B& color,
float minThickness = 200); // 200 should "simulate/save" th backwards compatibility
float threshold = 500); // 500 should "simulate/save" the backwards compatibility
/** Draws a quad bezier path.
*

View File

@ -256,45 +256,47 @@ string Issue11942Test::subtitle() const
}
//
// drawCircle new feature
// drawCircle new feature (better rendering)
//
BetterCircleRendering::BetterCircleRendering()
{
//Add lines to see the correct "scale of the 'rings'" changing the window size
auto draw0 = DrawNode::create();
draw0->setLineWidth(1);
addChild(draw0, 10);
auto draw = DrawNode::create();
draw->setLineWidth(1);
addChild(draw, 10);
for (float y = 0; y < VisibleRect::top().y; y += 10)
{
draw0->drawLine({VisibleRect::left().x, y}, {VisibleRect::right().x, y}, Color4B::GRAY);
draw->drawLine({VisibleRect::left().x, y}, {VisibleRect::right().x, y}, Color4B::GRAY);
}
initSliders();
drawNode = DrawNode::create();
addChild(drawNode, 10);
thick = 0;
lineWidth = 0;
scheduleUpdate();
}
void BetterCircleRendering::changeThickness(ax::Ref* pSender, ax::ui::Slider::EventType type)
{
if (type == ax::ui::Slider::EventType::ON_PERCENTAGE_CHANGED)
{
ax::ui::Slider* sliderThickness = dynamic_cast<ax::ui::Slider*>(pSender);
thick = sliderThickness->getPercent();
_thickNessLabel->setString("setLineWidth(" + Value(thick).asString() + ")");
}
}
void BetterCircleRendering::changeLineWidth(ax::Ref* pSender, ax::ui::Slider::EventType type)
{
if (type == ax::ui::Slider::EventType::ON_PERCENTAGE_CHANGED)
{
ax::ui::Slider* sliderLineWidth = dynamic_cast<ax::ui::Slider*>(pSender);
lineWidth = sliderLineWidth->getPercent();
_lineWidthLabel->setString("drawCircle(pos, radius, ..., segemnts, ..., color, " + Value(lineWidth).asString() + ")");
_lineWidthLabel->setString("setLineWidth(" + Value(lineWidth).asString() + ")");
}
}
void BetterCircleRendering::changeThreshold(ax::Ref* pSender, ax::ui::Slider::EventType type)
{
if (type == ax::ui::Slider::EventType::ON_PERCENTAGE_CHANGED)
{
ax::ui::Slider* sliderThreshold = dynamic_cast<ax::ui::Slider*>(pSender);
threshold = sliderThreshold->getPercent();
_thresholdLabel->setString("drawCircle(pos, radius, ..., segments, ..., color, " + Value(threshold).asString() + ")");
}
}
@ -307,12 +309,14 @@ void BetterCircleRendering::initSliders()
slider->loadSlidBallTextures("cocosui/sliderThumb.png", "cocosui/sliderThumb.png", "");
slider->loadProgressBarTexture("cocosui/sliderProgress.png");
slider->setPosition(Vec2(vsize.width / 2, vsize.height / 6));
slider->addEventListener(AX_CALLBACK_2(BetterCircleRendering::changeThickness, this));
slider->addEventListener(AX_CALLBACK_2(BetterCircleRendering::changeThreshold, this));
auto ttfConfig = TTFConfig("fonts/arial.ttf", 8);
_thickNessLabel = Label::createWithTTF(ttfConfig, "setLineWidth(0)");
addChild(_thickNessLabel, 20);
_thickNessLabel->setPosition(Vec2(vsize.width / 2, vsize.height / 6 + 15));
_thresholdLabel = Label::createWithTTF(ttfConfig, "drawCircle(pos, radius, ..., segments, ..., color, 0)");
addChild(_thresholdLabel, 20);
_thresholdLabel->setPosition(Vec2(vsize.width / 2, vsize.height / 6 + 15));
addChild(slider, 20);
ax::ui::Slider* sliderLineWidth = ax::ui::Slider::create();
@ -323,7 +327,8 @@ void BetterCircleRendering::initSliders()
sliderLineWidth->setPosition(Vec2(vsize.width / 2, vsize.height / 6 + 35));
sliderLineWidth->addEventListener(AX_CALLBACK_2(BetterCircleRendering::changeLineWidth, this));
_lineWidthLabel = Label::createWithTTF(ttfConfig, "drawCircle(pos, radius, ..., segments, ..., color, 0)");
_lineWidthLabel = Label::createWithTTF(ttfConfig, "setLineWidth(0)");
addChild(_lineWidthLabel, 20);
_lineWidthLabel->setPosition(Vec2(vsize.width / 2, vsize.height / 6 + 50));
addChild(sliderLineWidth, 20);
@ -332,19 +337,20 @@ void BetterCircleRendering::initSliders()
void BetterCircleRendering::update(float dt)
{
drawNode->clear();
drawNode->setLineWidth(thick); // value from the slider
drawNode->setLineWidth(lineWidth); // value from the slider
// Old behavior => faster but badly rendering if line width > 5 (= rings)
drawNode->drawCircle(VisibleRect::center() + Vec2(120.0f, 0.0f), 60, AX_DEGREES_TO_RADIANS(90), 36, false, Color4F::RED);
drawNode->drawCircle(VisibleRect::center() + Vec2(120.0f, 0.0f), 60, AX_DEGREES_TO_RADIANS(90), 36, false,
Color4F::RED);
// New behavior => slower but good rendering if line width > 5
auto color = Color4F::GREEN;
if (thick <= lineWidth)
if (lineWidth <= threshold)
{
color = Color4F::RED; // using the faster rendering internal method of drawCircle (old behavior)
}
drawNode->drawCircle(VisibleRect::center() - Vec2(120.0f, 0.0f), 60, AX_DEGREES_TO_RADIANS(90), 36, false, color,
lineWidth);
threshold);
}
string BetterCircleRendering::title() const

View File

@ -71,15 +71,15 @@ public:
void update(float dt);
void initSliders();
void changeThickness(Ref* pSender, ax::ui::Slider::EventType type);
void changeThreshold(Ref* pSender, ax::ui::Slider::EventType type);
void changeLineWidth(Ref* pSender, ax::ui::Slider::EventType type);
private:
ax::DrawNode* drawNode;
float thick = 0;
ax::Label* _thickNessLabel;
float lineWidth = 0;
ax::Label* _lineWidthLabel;
float lineWidth = 0;
ax::Label* _thresholdLabel;
float threshold = 0;
};
class Issue829Test : public DrawPrimitivesBaseTest