Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix rendering issue in fillRoundRect/strokeRoundRect #91

Merged
merged 1 commit into from Nov 19, 2020

Conversation

guillerodriguez
Copy link
Contributor

There is a problem in AndroidCanvas.fillRoundRect() related to gradient fills.
Here's a test that fills some round rects using a linear gradient:

Linear config = new Linear(0, 0, width, 0,
    new int[] { 0xffff0000, 0xff00ff00, 0xff0000ff },
    new float[] { 0f, 0.5f, 1f });
Gradient gradient = canvas.createGradient(config);

canvas.setFillGradient(gradient);
canvas.fillRoundRect(0, 120, width, 50, 5);
canvas.fillRoundRect(0, 180, width / 2 - 5, 50, 5);
canvas.fillRoundRect(width / 2 + 5, 180, width / 2 - 5, 50, 5);

This is how it should look like:

image

This is how it looks like in Android:

image

The problem is that the origin for the gradient fill is reset to the origin of each shape (see the rectangle in the bottom right).

This seems to be due to the current implementation of AndroidCanvas.fillRoundRect, which translates the canvas, draws using a rect at (0, 0), and then translates it back. The translation is what is causing the issue with gradient fills.

The translate calls were introduced in this commit to fix a bug when the rect supplied to drawRoundRect had non-zero x or y. However, the problem was actually related to the coords passed to the rect (the two last parameters should be the right and bottom coords, not the width and height).

This PR fixes this issue by passing the right coords to the rect and removing the translate calls.

Another option would be to use the drawRoundRect method that takes (x, y, width, height) instead of a Rect, and avoid the creation of an intermediate Rect. However this was introduced in API level 21 which doesn't work if building PlayN using Maven (android.version is currently set to 4.1.1.4, which is the latest version available in Maven central).

The current implementation translates the canvas, draws using a rect at
(0, 0), and then translates it back. This doesn't play nice with gradient
fills.

The translate calls were introduced to fix a bug when the rect supplied
to drawRoundRect had non-zero x or y [1]. However, the problem was actually
related to the coords passed to the rect (the two last parameters should
be the right and bottom coords, not the width and height).

So fix the fix by passing the right coords to the rect and removing the
translate calls.

 [1]: ab72fb6
@samskivert samskivert merged commit 982dd6a into playn:master Nov 19, 2020
@samskivert
Copy link
Contributor

Thanks!

@guillerodriguez guillerodriguez deleted the android-canvas branch November 19, 2020 17:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants