TouchGFX - Range slider

[COSEBE]

Hi,

Does someone have a suggestion to create a range slider with touchGFX like this

 

Thanks

[JTP1]

Hello Cosebe

I would probably make custom container which includes all elements and use this extension to draggable- class:

https://community.st.com/t5/stm32-mcus-touchgfx-and-gui/draggable-circle/m-p/631090#M35872

It adds the feature to limit the dragging to some exact area. It can be used for example to block vertical dragging completely and allow horizontal drag to specific area.

Then just add all necessary elements, 2 boxes on top of each other to indicate range (red/purple), 2 pointer images and some text fields. Use limited dragging for pointer images and then calculate position of pointer images based on current ranges and set limited dragging area.

You also need to implement handler for dragging events to get ranges updated.

It is maybe worth while to check slider.cpp/.hpp located in \Middlewares\ST\touchgfx\framework\source\touchgfx\containers and \Middlewares\ST\touchgfx\framework\include\touchgfx\containers folders. Maybe get some inspiration how scale ranges to coordinates and also about funtions needed for setup things. 

Hope this helps you bit forward.

Br JTP

[GaetanGodart]

Hello @COSEBE ,

 

I have bene working on a starting point for you.

In the attached example, I was able to move a circle horizontally and blocking it at the 0 position on the left and preventing it from passing the second circle on the right.
From there, I was able to get the percentage of drag (if completely left =>0, if completely right => 100).

Basically, all you have to do is to implement the same thing for the right circle, add the lines (grey and red) and display the result on textArea (using wildcards).

If you want, you can create a GitHub and I can help you if you get stuck on something.

After that, you could publish your custom widget on the thread for it : share-your-custom-widgets 

 

I started working on it before seeing @JTP1 's message, maybe his approach is better, I don't know.

 

If this message or JTP1's message solves your problem, I invite you to selected the best message as "best answer".

 

Regards,

[GaetanGodart]

Hello @COSEBE ,

 

Have you been able to move forward with your project?

If one of the previous comment helped you solve your issue, I invite you to select it as "best answer".

If you are still encountering problems, I invite you to give us more information so we can help you.

 

Regards,