How to configure a custom size with ILI9341 LCD ?

[PKriv.1]

Dear TouchGFX Team,

first of all, thank you for providing a great tool for top notch graphics. I'm happy to play with it, and learning about gfx basics from your resources was definitely most valuable input for me.

Since I don't have any demo boards at my disposal, I decided to play with some items I already have: an STM32F411RE based Nucleo and SPI ILI9341 based LCD. The problem number one in this project is a RAM size: a full 320x240 ILI9341 compatible framebuffer requires cca 150 kB, while STM32F411RE has 128kB. But for the sake of learning, I decided to go with it, and split the screen area in half. That means, I configure my LCD to 160x240 resolution, which in RGB565 requires only 75 kB framebuffer. My ili9341 library didn't have any problems with it and all the test functions worked, displaying images at half the screen only. So far so good.

But then, when I decided to integrate TouchGFX into my basic projects, it started behaving funny. Here's what I did:

• Created new project in STM32CubeIDE, based on my previously tested .ioc file, so that SPI interface with ILI9341 will work fine.
• In CubeMX, I've set Software packs to TouchGFX v4.14, where I set 160x240 resolution, with custom interface and RGB565 pixel format.
• Upon code generation, I opened Aplication Template.touchgfx.part in TouchGFX Designer, and made a very basic screen with a circular shaped button. When the button is pressed, the background color is changed, that's it. Very simple.
• Tested it out in simulator (worked fine), and exported the code into CubeIDE Project.
• Modified functions TouchGFXHAL::flushFrameBuffer and TouchGFXHAL::copyFrameBufferBlockToLCD in TouchGFXHAL.cpp according to your documentation. I have actually used the same code the guy from this thread has been using. The only thing I have changed it the GUI WIDTH to 160 in ili9341.h
• The code builds and flashes succesfully, and I get an image on the screen. Yeah!
• (I didnt mention until now, but I have implemented the touchscreen as well, and it worked - upon button press, the background indeed changes.)

But, the image is a bit weird. First, the button, that is supposed to be centerd is offset, and duplicated. Is there something in TouchGFX that would make such an image detoriation?

Best regarsd,

Pero

[Alexandre RENOUX]

Hello,

For your case, I highly recommend to use the partial framebuffer feature (https://support.touchgfx.com/docs/development/scenarios/lowering-memory-usage-with-partial-framebuffer). This will allow you to have a full screen instead of trying to apply some graphics to only half of the screen.

For this you can refer to the documention website, link above, as well as the G0-NUCLEO Application Template available in TouchGFX Designer 4.15.0.

This project uses SPI display along with SPI external Flash and uses the partial framebuffer feature because the internal RAM is too small for an entire FB.

/Alexandre

[PKriv.1]

Hello Alexandre, thanks for the help, I really appreciate the advice. I'm going to study the topic and implement it for sure.

But before that, I want to get a better grip on how TouchGFX works, and how to adapt existing examples onto the custom board, in this case half the screen :). Do you, as a person familiar with internals of TouchGFX, have an idea why would the image look so funny in the end (a button of center, and duplicated)?

[Alexandre RENOUX]

Could you provide some images of the simulator and what you see on your actual display to have a better understanding ?

/Alexandre

[PKriv.1]

Hello Alexandre,

I think it might have been it. I modified orientation in the TGX designer from "landscape" to "portrait" and it did the job properly. However, I also needed to mofify @Martin KJELDSEN​'s original copyFrameBufferBlockToLCD function from the Documentation to this:

void TouchGFXHAL::copyFrameBufferBlockToLCD(const touchgfx::Rect rect)
{
 __IO uint16_t* ptr;
 int16_t height;
 
 // Use default implementation (CPU copy!).
 // This can be accelerated using regular DMA hardware
 for (height = 0; height < rect.height ; height++)
 {
 //ptr = getClientFrameBuffer() + rect.x + (height + rect.y) * BSP_LCD_GetXSize();
 	ptr = getClientFrameBuffer() + rect.x + (height + rect.y)*(rect.width);
 LCD_IO_WriteMultipleData((uint8_t*)ptr, rect.width+1);
 }
}

I think the reason for bad rendering was the wrong size of the framebuffer part I was feeding into the SPI DMA. Since the SPI only works with data lengths of 8 bits, while the framebuffer has 16-bit data points, I need to send twice the amount of pixels needed for single line. This "+1" at line 12 makes sure all of it sent, so that skew is avoided. Sweet.

However, another topic that might be for you, Alex. Check the video in the attachment (mp4 file in zip), please. When I press the button there is a glitch, when colors get completely messed up in the button area. This is when image of "pressed button" should appear according to the TGFX Designer. I don't think it has anything to do with my setup, but might be the actual HAL issue. What do you think?

Best regards,

Pero

[PKriv.1]

Hello @Alexandre RENOUX​ , could you please look into it? I am really curious about what could be the source of the glitch...