Buttons/Box with rounded corner

[Marco.R]

Hi

I have the situation, that on one screen several buttons with only one color and rounded corners has to be placed. (see screenshot) But the corners are different on every button.

The easiest way would be to generate two images (for released/pressed button) for every button, but this is very ressource intensive (memory) for such simple buttons. If possible I would like to avoid this case.

With the flex button i have the option to add a box. Is there an option to specify a radius for every corner?

Or are other concepts applicable for this situation?

Is such a feature planned for next releases of the designer (maybe in version 4.11)? When will the new release available? I've seen that this will include new text options which are very interesting for me.

Best regards

Marco

[cameronf · Accepted solution]

I ran into this same limitation a little while ago and ended up making a custom container for rounded corner boxes and a corresponding button style. Posted them here if you'd like to reference/use them:

https://github.com/cameronfyfe/touchgfx-lib

The BoxRoundedCornersButtonStyle can be used similar to how BoxWithBorderButtonStyle is used.

I'm sure there's a better/more efficient way to do the rounded corner box as a custom widget instead of a container but I haven't had issues with it yet.

[Marco.R]

@Community member​ ​Thanks a lot. I will have a look on it, but It looks good at first glance.

[Martin KJELDSEN]

Hi @Marco.R​,

There's no way to create rounded corners programatically or have the designer generate a new asset for you based on an existing one. TouchGFX was designer, originally, to be very effecient, so it simply takes what is given by a graphics artists and converts that.

Hope that answers your question.

Best regards,

Martin

[Martin KJELDSEN]

Also, i will try to keep everyone updated on 4.11.0. It's a great release, and it's ready, but we have to wait for other internal deadlines such as CubeMX.

/Martin

[Marco.R]

​Hi @Martin KJELDSEN​, thank you for your reply. I assumed such an answer, but I hoped that there will be a better solution. I will go forward with the solution of cameronf.

[Majid]

@Community member​ 

@Martin KJELDSEN​ 

[SBACO]

Hello,

I face the same issue, the FW size should also be a concern for you Touchgfx Team as you are targetting portable connected devices... which require OTA DFU, everything cannot be image, specially if not compressed in any way. Image is usefull for gradiant, shadow, complex shape, ...

@Community member​ I use mostly the same tricks as you are, but I use line with round end cap to do the top and bottom, and a single box in the middle. I assume this consume less CPU to draw. However, it only works for filled shaped.