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: Noto flag emojis exceed bounds #2

Merged
merged 1 commit into from
May 7, 2024

Conversation

cbruegg
Copy link
Contributor

@cbruegg cbruegg commented Apr 21, 2024

Hey there,

with the Skia renderer, flag emojis (Noto) such as 🇯🇵 exceed their bounds.
image

This is what the Japan flag emoji looks like:

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="900" height="600">
<rect fill="#fff" height="600" width="900"/>
<circle fill="#bc002d" cx="450" cy="300" r="180"/>
</svg>

Other emojis are properly sized and look like this:

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 128 128" style="enable-background:new 0 0 128 128;" xml:space="preserve">
...

The main difference I could spot is that flag emojis seem to have an explicit width and height, while others use a viewBox. In this case, Skia seems to ignore the call to image.dom.setContainerSize(...) in SVGImage.

I've found a workaround that scales both kinds of emojis better by using canvas.scale(scaleFactor, scaleFactor).

The result looks like this:

image

@SalomonBrys
Copy link
Member

Nice catch!
Thanks 👍

@SalomonBrys SalomonBrys merged commit e241fdf into kosi-libs:main May 7, 2024
1 check passed
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.

2 participants