X-CUBE-TOUCHGFX 4.21.1 is out

Osman SOYKURT · ‎2023-01-23

TouchGFX 4.21.1 is now out.

Please follow this link to download it.

This version is a patch release, and include bugfixes of issues seen on TouchGFX Designer 4.21.0 version.

Release date: January 16th, 2023
Bugfixes in TouchGFX Designer:
- Fixed bug where locking a widget would cause it to appear in position (0,0) when compiling the code
- Fixed faulty memory usage when switching between screens
- Fixed case where importing a Custom Container containing a font already existing in the project could cause a crash
- Fixed a case where some widgets would not show their used images correctly when copy/pasted
Bugfixes in TouchGFX Core:
- Solid colors in SVGs would wrongly be placed in RAM.

4.21.0 Release details::

Release date: December 19th, 2022
New TouchGFX Designer Features:
- TouchGFX Stock added. Free designs, images and icons provided within TouchGFX Designer.
- Access to material icons made by Google.
- New SVG Image widget.
- New image picker for all image-related widgets.
- New preset picker for browsing themes and presets.
- Mouse coordinates shown when hovering canvas.
- New action for setting border color on box with border widget.
- Now able to navigate widget menu using arrow keys.
- Progress indicator widgets now support two new triggers, ValueUpdated and ValueUpdatedCompleted.
- Ability to close current project from file menu.
- Designer now remembers start up and save folder.
- Added tooltips for visibility and lock buttons in tree view of canvas.
- Added new icon for lock button in tree view of canvas, to make it more clear if a widget is locked or unlocked.
- Added delay property to move and fade actions.
Bugfixes in TouchGFX Designer:
- Fixed bug regarding DPI of images used in Analog clock.
- Fixed bugs regarding linespacing.
- Fixed bug with minimum and maximum check for x-range in Static Graph.
- Fixed bug regarding auto-size in TextArea widget.
- Fixed being able to set negative border width on box with border widget.
- Fixed disappearing interaction when undoing.
- Fixed bug with DPI in images used by Gauge widget.
- Fixed bug with not showing an error when deleting wildcard character in TextProgress and DigitalClock widgets.
- Fixed bug with long names in interactions.
- Fixed bug with escaped characters in text.
- Changing startup screen now results in unsaved changes.
- Fixed bug with code generation regarding ScreenAnimationEnded trigger.
- Fixed bug happening when users attempt to open a project with an unknown version.
- Text field size in Widget tree view increased.
- Fixed the ability to select multiple screens using right mouse click.
- Fixed being able to set radius of a Circle Widget to a negative number
- Fixed text for checkboxes not wrapping.
- Fixed image icon not updating when changing simulator skin image.
New TouchGFX Core Features:
- New widget: SVG Image
- Support in image converter to read basic SVG images. These are converted to binary data that can be drawn using the SVG Image widget. See the documentation for more information.
New wide text actions and redefinition of two existing formats:
- WIDE_TEXT_NONE: No change, no automatic line breaks.
  - WIDE_TEXT_CHARWRAP_DOUBLE_ELLIPSIS: No change, will add two ellipsis at end of the last line in the TextArea.
  - AbstractShape::setFillingRule() added to also allow EVEN-ODD filling, in addition to the default NON-ZERO filling.
  - As images on monochrome displays do not support alpha channel, any alpha value is now applied to each pixel before converting to BW.
  - Optimized SlideTransition and CoverTransition.
  - Class FullSolidRect has been removed from WipeTransition.
  - ImageConvert is using updated libpng 1.6.38. Generated images look the same.
- WIDE_TEXT_WORDWRAP: Changed, will keep adding line breaks and will not add ellipsis.
- WIDE_TEXT_WORDWRAP_ELLIPSIS: New, will add ellipsis as late as possible (even mid-word) on the last line in the TextArea.
- WIDE_TEXT_WORDWRAP_ELLIPSIS_AFTER_SPACE: No change, automatic line breaks, ellipsis will not be in the middle of a word.
- WIDE_TEXT_CHARWRAP: Changed, will keep adding line breaks and will not add allipsis.
- WIDE_TEXT_CHARWRAP_ELLIPSIS: New, will add ellipsis at end of last line in the TextArea.
Bugfixes in TouchGFX Core:
- Font metrics are handled better so now font height does not depend on which letters are actually being used. This means that default line spacing might be different - this can be adjusted using TextArea::setLinespacing(). For GraphLabels and ButtonWithLabel, texts might be placed better, depending on your font.
- Setting a negative radius on a Circle will set the radius to zero.
- Setting a negative line width on a Circle will set the line width to zero (causing a filled circle to be drawn).
- More robust handling of timer widgets in cases with lots of timer widgets.
- Fixed performance issue observed when upgrading to TouchGFX 4.19.0, 4.19.1, 4.20.0 (Removed Container::invalidateContent())
- Font::getSpacingAbove() return type changed from uint8_t to int16_t to prevent overflow.
Deprecated TouchGFX Core Features:
- Font::getMaxTextHeight() and Font::getMinimumTextHeight() have been replaced by Font::getHeight(). Returns the height of the font.
- Font::getFontHeight() has been replaced by Font::getBaseline(). Returns the distance to the baseline.

Attention : TouchGFX Designer 4.21.0 MUST be used with STM32CubeMX 6.7.0 or higher (link to download STM32CubeMX 6.7.0)

We strongly advice you to take a look at the new articles in the TouchGFX documentation :

Have a look also to our new article in our blog: TouchGFX 4.21: TouchGFX Stock, the largest library of graphical assets, free for STM32 MCUs

Hope you enjoy this new version!

Osman SOYKURT
ST Software Developer | TouchGFX

HTD · ‎2023-01-29

I have some issues and / or feature suggestions:

Settable SVG default color:

When I add a SVG image, there is no option to set its color. Images like material icons have their color unset, default black. The only way to change the image color is to just download SVG and edit it manually adding style attribute to the path. There should be a way to set the color (default color) in SVG image properties. The color IS settable when the image is used in a button. Sometimes that scenario is not optimal. I made a custom toolbar with clickable areas, that are not exactly buttons. You can just click some areas on the toolbar, the icon is just a decoration. I had to set the SVG icon color by manually editing SVG file. Of course I could add an icon button instead, but that would be even uglier hack adding unnecessary objects and code to the project.

Searchable icons:

When I try to enter anything in the search box, the currently selected category (from the menu on the left) is totally ignored. The search is performed on ENTIRE SVG IMAGE LIBRARY. This is super slow and practically completely unusable. Each time I need to select an icon I need just scroll the very long list that takes a lot of time. Even when I roughly know the name of the resource. Let's say it's something related to the word "user". I type "user" and I get everything, backgrounds, decorations, it would take forever to just scroll to a user icon.

Stock items in project assets:

Stock items are not listed in project assets. It's difficult to find them in my project files to edit them. When I needed to edit the color of SVG icons (not icon buttons) I needed to download the SVG files directly from Google website, add them as images to my project assets library, then edit the SVG files. It's a very inconvenient workaround for the issue, so it would be great if the stock items could be just added to the library directly.

General issues:

Linux version. As STM32CubeIDE works on Linux (and works better than Windows version, it's considerably faster, more stable and looks better), as most of the component drawing code is already written in C++ as platform independent - I think Linux version is not that impossible to make. It would allow to have a full toolset for GUI projects on Linux. I installed Linux just to test if some issues I got with STM32CubeIDE will occur on Linux and as I mentioned, it works better on Linux. Also, the code generation and code used on devices is mostly compatible with GNU toolchain, not MSVC. I've read the Designer uses WPF under the hood. Well, on Linux you can at least use cross-platform dotnet (if needed) or use Electron, as GitHub Desktop and Visual Studio Code does.
Texts, languages, translation: The categories created for texts are expanded by default and cannot be collapsed without clicking each individual category. This is very inconvenient in a large project, where I have like 50 categories with at least 10 to 50 items in each, in 5 languages.
STM32CubeIDE integration: It just doesn't work properly / stable. Maybe it's the IDE's fault, it is possible. Sometimes the links to the GUI files are not updated. So I end up with missing or invalid links that I have to update manually. I found a better workaround: I deleted the directories where Designer puts virtual links to the GUI files and added virtual directories linking to the original locations within the project. This works better and doesn't break when I add, remove or rename my screens or custom containers. However, sometimes, very rarely, the Designer "wakes up" and tries to recreate its directory with links in my Cube project, that just breaks the project (because of duplicate C++ files) and I have to intervene by either removing or hiding the directory. If you replaced the virtual file links with virtual directory links - it would just work exactly like in my workaround - that is stable, no issues for many months of a very active development.
Pixel accurate preview: If I want to see how the actual UI will be rendered on the device - I have to run simulation. The designer displays the UI as vector graphics that looks very good, but not exactly as on device. I think bitmap drawing would be much more usable. It would look uglier, but that's exactly the point - we design UIs for the specific screens, not the super high quality workstation monitor.
Color management for the target screens: Some displays, like on STM32H745I-DISCO board have a color tint very much visible on gray scale content. All grays have some blue tint that makes the resulting image differ significantly from what I see in my preview. The perfect solution would be if the color tint could be removed by applying some manual regulations in the designer to take the target display color capabilities into account. Something like RGB gamma or other regulation. It would be best if we had ready-made default profiles for known boards and displays, but just some manual controls would be fine too. My workaround for this is just tedious adjusting individual objects colors to look properly on the target.
Display initialization: On my STM32H745I-DISCO board I noticed that the display starts with the backlight on, then random artifacts appear on the screen before it's fully initialized. This is again very much visible and I needed to add 2 workarounds for it. The first was to turn the backlight off by default when the project initializes, then change the order of hardware initialization to initialize QSPI, then clear the memory used for frame buffer, then LTDC / TouchGFX. I think that should be the sane defaults for the TouchGFX generated code.
External include directories: I was unable to add external include directories to my project in a way, that TouchGFX Designer would see them when compiling the simulator preview. I could only add individual files that is problematic with some larger projects. That also forces me to use large amounts "#ifndef SIMULATOR" macros all over my GUI portions that uses includes from outside GUI scope.
Model singleton: The Model entity technically already IS a singleton, just incomplete. There is only one Model in the TouchGFX GUI. There is only one instance. I just had to add "getInstance()" method to use it as a full singleton. Now why is it needed in Model / Presenter / View architecture? It is needed because Model represents the general GUI. It "models" it. It is intuitive when I need to perform an action that is not specific to any screen. For example - I have a feature of going to the previous screen (a kind of navigation history). I implemented that feature in Model, then various screens and custom containers use it. As the model is not accessible directly from a view or custom container, it is accessible via a Presenter, but presenters are specific. Implementing the code there would require code duplication. That's why I believe the Model singleton should be a full singleton with getInstance method implemented by default.
Floating point numbers string interpolation: Why there are separate functions to render anything but floats, and floats? This is so counter intuitive! I spent much more time than it would be necessary to figure out why my "x = %.2f" string is not interpolated properly.
Project rename feature: I believe the project theoretically can be renamed from the Designer, but, similarly to the STM32CubeIDE - it would just damage the project, like I'd pressed a "self-destruct" button. What however works both in IDE and Designer is just setting the appropriate tag value directly in the XML file. I was surprised it was THAT simple. As it's simple - the rename feature could work like this. Just change the tag in project file without touching anything else.

Osman SOYKURT · ‎2023-01-31

Hello HTD,

Thanks a lot for your relevant feedback. Once again, constructive and complete messages like yours are important for us. You have indeed pointed things we're currently working on. I'll share the other ones with the team.

/Osman

Osman SOYKURT
ST Software Developer | TouchGFX

MM..1 · ‎2023-02-05

Hi Oskt
I test your idea place svg in container, but Interaction don’t show fade choice

Osman SOYKURT · ‎2023-02-06

Hi MM..1,

Yes, it doesn't show the fade choice, it's usable with code:

In .hpp :

class Screen1View : public Screen1ViewBase
{
...
protected:
    uint32_t sdramBuffer[800*480*24/8];
    uint16_t* sdram = (uint16_t*)sdramBuffer;
..
};

In .cpp :

Bitmap::setCache(sdram, 400*480*24/8, 2);
    Bitmap dynamicBitmap1 = Bitmap::dynamicBitmapCreate(400, 400, Bitmap::RGB888); 
    
    container1.setCacheBitmap(dynamicBitmap1);
    container1.enableCachedMode(true);
    container1.updateCache();
 
    container1.setAlpha(90);
    container1.invalidateContent();

/Osman

Osman SOYKURT
ST Software Developer | TouchGFX

MM..1 · ‎2023-02-06

Yes thanks, i need fade in image , then more lines not simple ...

On handling this i have sugestion, add fade in screen option over LTDC alpha ...

awiernie · ‎2023-02-10

This version crashes from time to time. It has maybe todo with change of size of widgets.

2023-02-10 13:34:54,478 [1] ERROR TouchGFXDesigner.App: Object reference not set to an instance of an object.

System.NullReferenceException: Object reference not set to an instance of an object.

at TouchGFXDesigner.Main.Project.Structure.WidgetMovementManager.UpdateFakeScreen(Application application)

at TouchGFXDesigner.Main.Project.Structure.WidgetMovementManager.HandleCanvasMove(Int32 deltaX, Int32 deltaY, Int32 deltaWidth, Int32 deltaHeight, Rect boundingBox)

at TouchGFXDesigner.Main.Project.Structure.WidgetCanvas.CanvasAdorner.ThumbsAdorner.ThumbsAdornerViewModel.ThumbDragged(Double dX, Double dY, ThumbPosition thumb)

at System.Windows.RoutedEventArgs.InvokeHandler(Delegate handler, Object target)

at System.Windows.EventRoute.InvokeHandlersImpl(Object source, RoutedEventArgs args, Boolean reRaised)

at System.Windows.UIElement.RaiseEventImpl(DependencyObject sender, RoutedEventArgs args)

at System.Windows.Controls.Primitives.Thumb.OnMouseMove(MouseEventArgs e)

at System.Windows.RoutedEventArgs.InvokeHandler(Delegate handler, Object target)

at System.Windows.EventRoute.InvokeHandlersImpl(Object source, RoutedEventArgs args, Boolean reRaised)

at System.Windows.UIElement.RaiseEventImpl(DependencyObject sender, RoutedEventArgs args)

at System.Windows.UIElement.RaiseTrustedEvent(RoutedEventArgs args)

at System.Windows.Input.InputManager.ProcessStagingArea()

at System.Windows.Input.InputProviderSite.ReportInput(InputReport inputReport)

at System.Windows.Interop.HwndMouseInputProvider.ReportInput(IntPtr hwnd, InputMode mode, Int32 timestamp, RawMouseActions actions, Int32 x, Int32 y, Int32 wheel)

at System.Windows.Interop.HwndMouseInputProvider.FilterMessage(IntPtr hwnd, WindowMessage msg, IntPtr wParam, IntPtr lParam, Boolean& handled)

at System.Windows.Interop.HwndSource.InputFilterMessage(IntPtr hwnd, Int32 msg, IntPtr wParam, IntPtr lParam, Boolean& handled)

at MS.Win32.HwndWrapper.WndProc(IntPtr hwnd, Int32 msg, IntPtr wParam, IntPtr lParam, Boolean& handled)

at MS.Win32.HwndSubclass.DispatcherCallbackOperation(Object o)

at System.Windows.Threading.ExceptionWrapper.InternalRealCall(Delegate callback, Object args, Int32 numArgs)

at System.Windows.Threading.ExceptionWrapper.TryCatchWhen(Object source, Delegate callback, Object args, Int32 numArgs, Delegate catchHandler)

Exit0815 · ‎2023-02-25

TouchGFX is crashing someimes.

It just happened again.

I created some new pages and copied the content from one page to the others which use the same container.

When i tried to move up (drag&drop) one icon in the same page from bottom to top (to have it visible) the app freeze and close without any errormessage.

Crashlog is attached. Please have a look.

Thank you.