SVG Vector Graphics issues on stm32u5g9njhxq with larger display resolution?

[skydiver]

I am running into a difficult bug when trying to use the SVG and vector fonts on the STM32U5G9NJH6Q that may be related to this specific variant of the chip, or to the dimensions of the RGB LCD that is being driven (or both).  The problem is that SVG images (even a single basic rectangle) end up having a "shattered" look where there are many holes/tears and random lines and shapes that almost make it look like shattered glass.  It also tends to be more prominent on the top left of the image (regardless of size).  A basic square also showed an 'X' shape like it is split into four parts by a fine line (even following rotations).  The strange thing is that animations and rotations of even large SVG images work well (despite the rendering issues).

I also have an STM32U5G9J-DK2 where the SVG feature works perfectly fine.  I have built and debugged the demo 7 project in STM32CubeIDE, so my tools appear to be fine (unless this is a hardware issue with the NJH6Q package).  I have re-implemented the project with only graphics and diffed it with the DK2 demo project, and I don't see any differences in drivers or configurations that could be the issue.

The display I am driving is larger at 800x640, but I have the same issue even if I set TouchGFX to only use 800x480 (like the DK2).  I noticed that there is a bug with larger displays that was fixed by some kind of patch and a special function call in the nema_gfx setup, but with that being closed source I have no idea if that is the problem.  I do know that that nema_gfx library is identical in my project and the DK2 project.  We are using the LTDC with an RGB LCD hooked up to use RGB888, but internally using an RGB565 frame buffer.  I use the exact same config in the DK2 demo project (except for the LTDC settings to drive the 800x480 display).

Has anyone had issues like this with the vector graphics features?  This is a significant drawback that may drastically reduce the capability of our product due to the inability to use vector fonts or SVGs to reduce sizes.  I really don't want to have to give up on this feature, but I can't afford to keep debugging it.

[GaetanGodart]

Hello @skydiver ,

When you draw a simple rectangle and see it shattered, can you look at the content of the framebuffer and verify that it is also shattered?

Can you share a picture of the shattered rectangle?

Can you share your project ? Especially the .ioc file?

Regards,

[skydiver]

Hey, sorry for my late response, I've been very busy this week.

I don't have time at the moment to dig into whether the framebuffer is also shattered, but I have attached the .ioc file from my minimal project (basically just a single screen with an SVG that I can drag and rotate).

All other rendering is fine, so I don't see how the contents of the framebuffer could be whole and somehow get shattered.  The project I'm working on (with no vector graphics or fonts) is running fine at 60Hz (no tearing or similar artifacts to the ones that plague SVG and vector fonts).

I will try to get a picture sometime tomorrow if I have time.  One thing I would note is that the "shattered" defect is not static: as I drag the SVG square around the screen the holes move around within the image.  The same is also true for rotation, and at a constant position I can get a mostly whole image if I rotate it to a certain angle (but holes appear if I then move the image).

I will note that I have had to manually initialize the TouchGFX thread in my projects (it is not generating that code as I believe it is supposed to do).  I copied the exact code that is generated for the U5 dev kit.

I am using STM32CubeIDE v1.17.0 and TouchGFX Designer 4.24.1

I did see the new 4.25 came out the other day, but have not been able to find time to see if this changes anything.

[GaetanGodart]

Hello @skydiver ,

Can you try to set the DMA2D to RGB565 to match your TouchGFX framebuffer pixel format?

Can you try to set vector rendering to software?

Can you also try to increase the canvas buffer size?

Please tell me if that changed anything.

Could you actually take a video so I can see the behavior (including the difference between the top corner and the rest of the screen) and show the difference based on rotation.

Regards,

[skydiver]

See the attached video for an example of what I am seeing.

I have only one screen set up with some vector text, the default SVG image, and one SVG image that is a basic single-color rectangle.  I also added a blue box widget to show that normal rendering is working fine.  Here is how the screen looks in the Designer:

I have buttons mapped to rotate and scale the SVG images, and they are draggable.  My finger is kind of in the way in the video, but you can still see the strange effects as I drag them around.  The vector widgets do not appear to refresh themselves properly (seen when I drag them over each other).  The text completely doesn't render properly.

I have already played around with all of the various DMA2D configurations, but I changed it again just in case and it didn't have any effect.  I think TouchGFX is re-configuring it internally.

In the .ioc I sent you I had made some tweaks to set the framebuffer to be 800x480 like the DK2 example, but that had no effect on the results of the rendering, so for the attached video I changed it back to the full 800x640 resolution.

I increased the canvas buffer to 40,000 and it had no effect.

When using software vector rendering everything looks fine, but I get a much lower framerate (and it defeats the point of using it for me).

If you need to see the project files I can send them to you if there is a way to send them privately.

[GaetanGodart]

Hello @skydiver ,

Would you share the whole project please?
If it is NDA, you can send me a private message with the compressed project.

Where do you store your assets?

What is the OctoSPI used for? External flash?

Have you had time to check the framebuffer content to see if it is a rendering issue or a transferring issue?

Regards,

[skydiver]

I will send the project to you in a private message.

For this simple demo I am just using internal flash for assets, but I included the octospi configuration in case I needed to use larger images for further testing.  For this demo I re-created my whole ioc from scratch and only included the parts needed for graphics, but in our actual application we use the external flash for images.  I also use the GFXMMU in the actual application to save RAM since it is a round display, but the problem happens with or without GFXMMU.

I have not checked the framebuffer content, but I'm not exactly sure I understand the theory behind that check.  Are you thinking that the GPU is correctly rendering the images but somehow not transferring them to the framebuffer properly?  Since normal widgets and images are rendered fine I figure that rules out everything past the framebuffer from being the cause of this issue, no?

As you can see in the video it also looks like SVG images are not refreshed as a result of invalidations from other widgets (dragging the normal box over an SVG wipes it out, and it only redraws if I move the SVG image).

Some other things I've tried to no avail:

• Increasing the GPU2D Command List Size
• Double/Single buffering
• Reducing refresh rate

[GaetanGodart · Accepted solution]

Hello @skydiver ,

Here is your DCACHE2:

void MX_DCACHE2_Init(void)
{
  hdcache2.Instance = DCACHE2;
  hdcache2.Init.ReadBurstType = DCACHE_READ_BURST_INCR;
  if (HAL_DCACHE_Init(&hdcache2) != HAL_OK)
  {
    Error_Handler();
  }
}

Here is our DCACHE :

void GPU2D_DCACHE2_Init(void)
{
    hdcache2.Instance = DCACHE2;
    hdcache2.Init.ReadBurstType = DCACHE_READ_BURST_INCR;

    if (HAL_DCACHE_Init(&hdcache2) != HAL_OK)
    {
        Error_Handler();
    }

    /* Force GPU accesses to SRAM through DCACHE2 to be always uncached */
    __HAL_RCC_SYSCFG_CLK_ENABLE();
    HAL_SYSCFG_DisableSRAMCached();
}

You should add the last 2 lines to your code like so :

void MX_DCACHE2_Init(void)
{
  hdcache2.Instance = DCACHE2;
  hdcache2.Init.ReadBurstType = DCACHE_READ_BURST_INCR;
  if (HAL_DCACHE_Init(&hdcache2) != HAL_OK)
  {
    Error_Handler();
  }

    /* Force GPU accesses to SRAM through DCACHE2 to be always uncached */
    __HAL_RCC_SYSCFG_CLK_ENABLE();
    HAL_SYSCFG_DisableSRAMCached();
}

Regards,

[skydiver]

That did the trick, and I'm now able to use vector fonts and have managed to incorporate some SVGs into my project.

Thanks again.