TouchGFX screen rotation

[MatjazF]

Hello,

In our project (STM32U5) we would like to make animation with TouchGFX (4.22) at display (320*240). We have one screen (landscape 320*240), with some pictures, text, and dynamic graph. Everything works ok. After few seconds we would like to use another screen, which is rotated for 90degrees (portrait - 240*320). But we have some problems with that.

1. TouchGFXF does not support animation with mixing landscape and portrait screens.
2. We can use new landscape screen and rotate text for 90degress, use rotated pictures but we cannot rotate graph.

Is there any other option for us?

[Mohammad MORADI ESFAHANIASL]

Hello @MatjazF ,

You can actually rotate the screen at runtime using the following function:

void ScreenWithNewOrientationView::setupScreen()
{
    touchgfx::HAL::getInstance()->setDisplayOrientation(ORIENTATION_LANDSCAPE);
    ScreenWithNewOrientationViewBase::setupScreen();
}

However, this function only rotates everything automatically, so you need to adjust the position of your widgets accordingly, so they will be shown correctly. The API for the function is available at this web page.

You also don't need to rotate your pictures manually, just need to set their rotation from the Images tab in TouchGFX.

Rotation of Images

I hope this helps you

[MatjazF]

This is good solution if you have square screen (240*240). If you have 320*240 is not good option. In this case you just rotate the landscape screen to portrait. You lost the right part of the landscape screen and lower part of the new portrait screen is empty.

 I made one example. I rotate the landscape (320*240) screen to Portrait. Then I tried to move one Image (function moveTo (X,Y) in screenView.cpp ) from point (20,20) to point (20, 240) and there is no image. I cannot move some graphics to lower part of new portrait screen. Any suggestions?

[Mohammad MORADI ESFAHANIASL]

I see the problem, sorry for my miss guidance. 
If you call the setDisplayOrientation() before moving to the new screen, the problem should be resolved. For instance, if you have a button that changes the screen, call setDisplayOrientation() in that function and not in the setupScreen of the newly rotated screen. 
It might not show properly in the simulator, but it works fine on the target.

void Screen1View::changeScreenAndOrientation()
{ 
    touchgfx::HAL::getInstance()->setDisplayOrientation(ORIENTATION_LANDSCAPE);
    application().gotoScreen2ScreenSlideTransitionEast();
}

--------------------------------------------------------------------------------------

void Screen2View::setupScreen()
{
    image1.moveTo(image1.getY(), image1.getX());

    Screen2ViewBase::setupScreen();
}

Let me know if you have more questions

[MatjazF]

Thank you. Works better! 🙂

[MatjazF]

Hello,

I still have two problems with screen rotation:

1.It is possible to use one same image in landscape and also in portrait orientation for screen?

When we rotate the screen (setDisplayOrientation(ORIENTATION_LANDSCAPE)) images are not rotated. So, we need to use new rotated images. Or it is possible how to rotate the same image? Solution is to use 2 equal images (one rotated). But it is not best solution.

2.It is possible to set different colors or alpha not just for the whole line of graph but just one part of the graph line? (example: X axis of Graph:  from 0 to 20- alpha 100, from 20 to 50- alpha 200, and from 50 to 100 -alpha 255).

We have one graph and we used image for graph line in TouchGFX (dynamicGraph-Elements-Line-Image). But when we rotated screen for 90degress, the graph is rotated but this image for graph line is not rotated (so the color of the graph line is not equal to colors of image, when graph is rotated). And also, to use image for colors of graph line is not the best solution (RAM).

[Mohammad MORADI ESFAHANIASL]

Hello again,

Unfortunately, the answer to both of your questions is no. 
The rotated images should be calculated before hand, so the solution would be to use two images while one is rotated. And for the graph, there are no direct and proper solution, but you can create a new Painter and GraphElementLine each time you want to add data (which I don't recommend using at all). 

[MatjazF]

Hello again,

We resolved almost all problems. Just one left and we do not know how to solve it.

Now almost everything works perfect. In landscape mode everything is perfect.

But when we rotate screen for 90 degrees (portrait mode) my dynamic graph is not OK (the part of the line graph at the beginning is white). For graph line we used rotated image (240*170) and there is no white spots in the image.

 Image for GraphLine!

If we use smaller image (180*170)  for graph line the graph works perfect (but no line in the end). Or if we remove some images or texts from our animation, then graph is working OK.

Also if we use just color for graph line (not image), all graphs work perfect!

Any suggestion? Memory problem? Buffers? we changed the size of some buffers for TouchGFX but there was no improvement (Memory Pool size, memory stack size for TouchGFX).