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

Titles made in Inkscape do not render in Openshot the same #5115

Open
JamesRichards22 opened this issue Jan 26, 2023 · 14 comments
Open

Titles made in Inkscape do not render in Openshot the same #5115

JamesRichards22 opened this issue Jan 26, 2023 · 14 comments
Assignees

Comments

@JamesRichards22
Copy link

JamesRichards22 commented Jan 26, 2023

Describe the bug:
When creating a title or title template in Inkscape, I use a specific Font and Stroke Style to create a thick border with my text.

image

But when using this in Openshot, the thick border is not rendered and the font weight is not the same.

Frame-03842

I used the steps in https://logosbynick.com/outline-text-with-inkscape/ to create the outline.

Here I'm using Roboto Slab Black or bold, a very heavy set font.

Steps to reproduce the behavior:

  1. Create a title in Openshot Ctrl+T
  2. Choose Standard 1
  3. Click on Use Advanced Editor
  4. Highlight the text with the select tool (click and drag marching ants over the text)
  5. Press Ctrl+Shift+F for Fill and Stroke
  6. Click the blue box next to the red (x) for Flat color
  7. Choose a colour from the palate at the bottom
  8. Click Stroke paint tab
  9. Click the blue box next to the red (x) for Flat color
  10. Right click on the Stoke colour box at the bottom and choose black
  11. Click Stroke style tab
  12. For Width, enter 20 (this gives a nice chunky border to show the issue)
  13. Save the file Ctrl+S
  14. Edit Inkscape
  15. Click Save on the Openshot titles dialog
  16. Use the title in the video

Expected behavior:
The imported .svg should look the same as what we saw in Inkscape.

System Details:

  • OpenShot Version: 3.0.0 - although the about dialog still says version 2 is the next generation
    image

  • Operating System / Distro:

$ lsb_release -a
No LSB modules are available.
Distributor ID:	Ubuntu
Description:	Ubuntu 22.10
Release:	22.10
Codename:	kinetic
@JamesRichards22 JamesRichards22 changed the title Titles made in Inkscape with stroke style do not render in Openshot the same Titles made in Inkscape do not render in Openshot the same Jan 27, 2023
@sc0nway
Copy link
Collaborator

sc0nway commented Mar 3, 2023

To ensure that the font in Inkscape appears in OpenShot, you may convert the text to an object using paths. Once the text is an object, you can save your file and close Inkscape, and the image will import to OpenShot as a title.

@jonoomph
Copy link
Member

jonoomph commented Mar 3, 2023

Another trick, you can rasterize the vector SVG file - and export it from Inkscape as a High DPI PNG file. This will import into OpenShot with pixel perfect accuracy. Regarding the SVG rendering differently, we use a different SVG library than Inkscape called ReSvg (https://github.com/RazrFalcon/resvg). It is possible that a bug in ReSVG is causing the rendering issue, and it would probably be very useful to file an issue with this library, and attach your example SVG file there. Fixing it upstream in ReSVG will eventually work it's way back to OpenShot. Thanks!

@JamesRichards22
Copy link
Author

So, in the process of making sure this issue has a valid documented workaround, the options are in Inkscape to

  1. Export as a PNG, making sure the width and height matches the video size you're working on. This is fine if you don't want to re-size the title in a animation as it will get the jaggies / pixelate. Then re-import the png file as an image and use that.

Screenshot from 2023-03-04 13-15-30

  1. Convert using Object to Path, however this will remove the ability to edit the title as text. I also found that the fill colour was not imported correctly, so I had black on black writing.

I'll log bugs with the ReSVG library about these issues.

@JamesRichards22
Copy link
Author

Logged as linebender/resvg#591

@JamesRichards22
Copy link
Author

RazrFalcon came back with

If you render it via resvg CLI tool it will produce the correct output. Something went wrong on the OpenShot side.

@Melonadev
Copy link

Melonadev commented May 23, 2023

I experienced a similar issue, where bolded Chinese characters in Inkscape don't appear in Openshot at all:
image

However, I used the above suggested workarounds by @sc0nway and @jonoomph, and they worked!

To ensure that the font in Inkscape appears in OpenShot, you may convert the text to an object using paths. Once the text is an object, you can save your file and close Inkscape, and the image will import to OpenShot as a title.

Another trick, you can rasterize the vector SVG file - and export it from Inkscape as a High DPI PNG file. This will import into OpenShot with pixel perfect accuracy. [...]

image

I would still very much prefer if this issue is fixed. Whether or not this is due to Inkscape, Openshot, or Qt, or others, I have no clue.

@Colorjet3
Copy link
Collaborator

Hello @Melonadev. Are you creating your text outside of Openshot and then importing it in or are you creating a Title inside of Openshot using the Title template and then leveraging the "Use Advanced Editor" which uses Inkscape? I ask because if you do the latter ("Use Advanced Editor"), what happens when you create you text, regardless of language, by default it is in Black color. When you save the text file and you come back into Openshot the canvas is black so you can not see the text. if you picked a different color than Black when in Inkscape, the text shows up just fine in Openshot.

However, this doesn't address the other issue mentioned in the original email about some fonts not rendering the same in Openshot when created in Inkscape. And as @jonoomph (lead developer) indicated that this issue resides in ReSvg (see threads above for more details) and when that is fixed, then Openshot will be fixed as well.

@JamesRichards22
Copy link
Author

JamesRichards22 commented May 23, 2023

@Colorjet3, I opened a ticket with ReSvg and they responded that the issue is with OpenShot. You can see the ticket I logged with them in https://github.com/RazrFalcon/resvg/issues/.

@Colorjet3
Copy link
Collaborator

@Colorjet3, I opened a ticket with ReSvg and they responded that the issue is with OpenShot. You can see the ticket I logged with them in https://github.com/RazrFalcon/resvg/issues/.

@jonoomph Please check this out.

@Melonadev
Copy link

Hello @Melonadev. Are you creating your text outside of Openshot and then importing it in or are you creating a Title inside of Openshot using the Title template and then leveraging the "Use Advanced Editor" which uses Inkscape? I ask because if you do the latter ("Use Advanced Editor"), what happens when you create you text, regardless of language, by default it is in Black color. When you save the text file and you come back into Openshot the canvas is black so you can not see the text. if you picked a different color than Black when in Inkscape, the text shows up just fine in Openshot.

However, this doesn't address the other issue mentioned in the original email about some fonts not rendering the same in Openshot when created in Inkscape. And as @jonoomph (lead developer) indicated that this issue resides in ReSvg (see threads above for more details) and when that is fixed, then Openshot will be fixed as well.

@Colorjet3 The first. I created the text outside of Openshot, then imported it into Openshot.

@Colorjet3
Copy link
Collaborator

@Melonadev Thank you for that information. Please create another text image using Inkscape but this time pick a different color for the text. I just created a text image using Inkscape (not from withing Openshot). I added two lines of text. The first line I kept it the default Black color. The 2nd line I changed the color to Red.

when I import the image into Openshot and drag onto a track, I do not see the first line in the Preview but do see the 2nd line.

Is this what is happening to you?

@Melonadev
Copy link

@Colorjet3 Sorry for the insanely late reply!

As of right now, both lines are displayed, as they should be. (white background made in GIMP and imported into Openshot)
image

@JamesRichards22
Copy link
Author

JamesRichards22 commented Dec 9, 2023

Hello,

So this is weird. I'm using OpenShot 3.1.1 with AppRun due to #5360 and it's rendering the mostly SVGs correctly (still some errors). This is the same version I ran from the PPA that I've been using since last year. It might be something on Ubuntu 23.10 that's updated that's a dependent library, or just plain magic.

Frame-29469

James.

@JamesRichards22
Copy link
Author

I've just tried Openshot 3.2.0. The .AppImage version renders svg titles as I had above, mostly correctly. But the .deb version from the official repo does not display the titles, which is what I originally reported. So there's something that is different in the way they're built that's the issue here.

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

No branches or pull requests

5 participants