B4A Library [B4A] CustomMinimalSlider - Minimalistic slider that can do slider or progress bar

Hi all,

I've wrote and used this minimalistic slider library in many of my projects, so because I've updated it for a long time and added all custom functionalities I wanted, now I've decided to release it as library.

Attached there is a library .jar and .xml, (copy these to your Addictional Libraries folder) and 2 demo projects to test it, the first is a base project that show the slider horizzontally and vertically, the second test optional animations with interpolators.

This library was completely developed on B4A and because it is a relatively simple class (simpler than others I wrote) I've decided to release the full source code as most of libraries I've developed. This is the first of a long series of libraries I will release that I've developed in last 10 years with B4X, almost all my B4A libraries have a desktop B4J counterpart, some others I only developed for a specific platform.

You can find the library source code inline in the demo 1, if you like, you can make modifications and recompile it to a library (depends on AnimationPlus library). This and other free libraries will soon be available next on my github repository here https://github.com/maxmeli123

I've developed the same library for B4J and I will release it next days.

Features:
- Fully OpenSource library, .jar and .xml provided, demo projects to test it provided, full B4A library source code provided here and on github.
- Fully resizable sliders by settting the layout in the constructor line that create it, eg. you can use small sliders or put a full screen single slider with a big bar
- Minimalistic control, only show a colored bar with borders, a Tag label that is a slider/progress name and can be used to identify any slider and a value label that show the current value
- Any slider/progress have it's parameters that can be customized separately from others
- Full multi touch, any istance of it has separate touch events, this mean that you can move five sliders the same time with five fingers (even more using two hands) and track the moved/released sliders by index in the event callback sub.
- Acts as minimal (generic non customized) slider, it has a label to show the slider name and a label that show it's value
- Acts as minimal (generic non customized) progress bar, it has a label to show the progress bar name and a label that show it's value. Touch control can be disabled
- Bar color and borders can be customized
- Click on labels it set a value 0 or MaxValue
- Fully customizable, the class returns the slider panel and both labels, so they can be customized at runtime, eg you can change labels background color or make it transparent and other things
- Support horizzontal and vertical orientations, it is auto detected by library depending on controls size. If Width > Height then it is horizontal, otherwise vertical
- Support custom max value, it can be set to an integer number, eg from 0 to 100, from 0 to 5000, from 0 to 100000 etc.
- Moved event will be raised when value changed
- Release event will be raised when finger move up
- Support animations with interpolators provided internally by a good @Informatix AnimationPlus library. Note that for B4J I've developed the jAnimationPlus library that is a desktop counterpart and I will release it next on this Forum
- One line of code can create a slider/progress
- One line of code can create a block of sliders/progress (you can access any single slider by index and by tag)
- Touch event can be enabled/disabled when control is created and after creation multiple times trasforming a slider to a progress bar or viceversa
- Events return UserChanged property that specifies if value was changed by user (touch) or by code at runtime
- Main visiblily and/or (indipendent) labels visiblility can be set by code

As I said I've used it on many of my projects and sometime I customized it for a specific project.
I've used it to do some sophysticated things like control a drone and a RC car machine controlled by ESP8266/ESP32 over WiFi from my phone, control some domotics like lights intensity, thermostat temperature etc. I've used it to remotely control my 3D printer over internet and move 5 sliders (at same time) of my motorized midi mixer (I'm musician) and other things.

Changelog

• 1.15 First release. Works well but there are touch conflicts when placed on top of AHViewPager due to touch event conflicts on horizontal sliders
• 1.16 - Fixed touch conflict issue on horizontal sliders when placed on top of AHViewPager. The library now internally disable/enable paging when required, no user intervention, just put this after AHViewPager initialization:
  CustomMinimalSlider1.UseViewPager(Pager) ' Pager is an initialized instance of AHViewPager. With slider blocks you can iterate by index in a for loop to set it. Note that this only required for horizontal sliders, for verticals you can set it but it do nothing.
  - Now all controls have _Moved and _Released events. Sometime the slider value require just to be retrieved only when slider is released, this is a case eg. if you want send a value over socket, the _Moved event in this case send a lots of data because fires every time the slider change value. With _Release event you can send data once the slider is released. Eventually you can disable these two events separately if you do not need to fire it, this can be done just by comment the event sub you do not need (or not add at all to your project), or by code this way:
  CMS1.FireEventMove(False) ' We can disable _Move event, and then reenable it multiple times if needed. (By default True)
  CMS1.FireEventRelease(False)  ' We can disable _Release event, and then reenable it multiple times if needed. (By default True)
  - Added new demo that show use on top of AHViewPager

Enjoy it

 

[max123]

Hi all,

yesterday I modified the CustomMinimalSlider class to fix the issue when on top of AHViewPager, now it support by default both _Move and _Release events and both can be disabled separately this way if not needed:

CMS1.FireTouchEventMove(False)
CMS1.FireTouchEventRelease(False)

or just comment the event callback sub.

Now the touch on horizontal slider do not conflicts, sometime it fails if slider moved fast because the _Release event have a strange latency, but maybe because I still use B4ABridge. I will try directly from USB.

I've added as @teddybear suggestion here:
https://www.b4x.com/android/forum/threads/ahviewpager-touch-event-conflict.141216/
lines to Enable/Disable pager change, but now I've a very strange problem, when I move the
slider to a min or max value, the _Release event fires, here I've put:

 Pager.PagingEnabled=True

but very strangely it do not reenable, so not possible to change pages.

To make it to work I need to set a value between min and max, eg. from 1 to 99 in an interval 0 - 100 (default).

This is a strange issue, I even put a Log, the event is fired, Pager.PagingEnabled is true after changing it, but Paging remain disabled.
The issue is only on horizontal slider and only happen if I put the slider to min or max value, all values in the middle correctly reenable it when finger released.

Probably this is something that happen when I release the finger on the slider out of its bounds because if I click labels to set zero value or max value it is working.

Attached a zip project to reproduce the issue.

The CustomMinimalSlider class is inline, just need a reference of AnimationPlus library because depends on it for animations.

Can someone help me to fix it please ?

 

[max123]

1.16 released Fixed the the compatibility with AHViewPager, see changelog.

 

[max123]

The same library is out for B4J, it will use my jAnimationPlus that is a B4J counterpart of B4A AnimationPlus.
Next days I will release both.