openshot-qt icon indicating copy to clipboard operation
openshot-qt copied to clipboard

Titles made in Inkscape do not render in Openshot the same

Open JamesRichards22 opened this issue 2 years ago • 14 comments

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 avatar Jan 26 '23 03:01 JamesRichards22

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.

sc0nway avatar Mar 03 '23 04:03 sc0nway

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!

jonoomph avatar Mar 03 '23 22:03 jonoomph

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 avatar Mar 04 '23 02:03 JamesRichards22

Logged as https://github.com/RazrFalcon/resvg/issues/591

JamesRichards22 avatar Mar 04 '23 02:03 JamesRichards22

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.

JamesRichards22 avatar Mar 13 '23 08:03 JamesRichards22

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.

Melonadev avatar May 23 '23 13:05 Melonadev

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 avatar May 23 '23 18:05 Colorjet3

@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/.

JamesRichards22 avatar May 23 '23 19:05 JamesRichards22

@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.

Colorjet3 avatar May 24 '23 03:05 Colorjet3

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.

Melonadev avatar May 24 '23 05:05 Melonadev

@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?

Colorjet3 avatar May 24 '23 17:05 Colorjet3

@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

Melonadev avatar Aug 06 '23 12:08 Melonadev

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 avatar Dec 09 '23 05:12 JamesRichards22

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.

JamesRichards22 avatar Jun 26 '24 10:06 JamesRichards22