B4A Library [B4X] SpinnerX is a custom B4X library that allows you to create up to 6 different types of spinners.

Overview

SpinnerX is a custom B4X library that allows you to create up to 6 types of spinners with high visual and functional flexibility.
Compatible with B4A and B4J, it offers an intuitive interface for manipulating numerical values in your applications.

Note: SpinnerX is not compatible with B4I due to a lack of test hardware.


Events
ChangeValue

Triggered each time the spinner's value changes.
Typical uses: updating a label, triggering an action, etc.


Functions

Min Value: Sets the minimum allowed value
Max Value: Sets the maximum allowed value
Default Value: Initial value displayed at startup
Step Incremental: Increment between each value
Position: Choose from 6 positions for the buttons and the value
Border Type: Border applied to each element or to the entire set
Border Size: Border thickness
Border Color: Border color
Corner Radius: Corner radius
TypeFace: Font used: Default, FontAwesome, Material Icons
Minus Color: Color of the decrement button
Minus Text Color: Color of the text on the decrement button
Minus Text: Text displayed on the decrement button
Plus Color: Color of the increment button
Plus Text Color: Color of the text on the increment button
Plus Text: Text displayed on the increment button
Value Color: Background color of the displayed value
Value Text Color: Color of the text on the displayed value


Properties

Positioning: Split Horizontal, Split Vertical, Left Horizontal, Left Vertical, Right Horizontal, Right Vertical
Borders: No Border, All Elements, Each Elements
Typography: Default Text, FontAwesome, Material Icons


Spinner Types

SpinnerX allows you to create up to 6 spinner variations based on your chosen layout and style.
Each type can be configured using the properties above to suit your design.

Dependencies
For B4J:
ByteConverter
JFX
CSSUtils

For B4A:
ByteConverter
XUI View

Have fun!

b4a.png


b4j.png
 

Attachments

  • SpinnerX.zip
    15.9 KB · Views: 88
  • SpinnerX.b4xlib
    4.3 KB · Views: 78
Last edited:

AKJammer

Active Member
Licensed User
Longtime User
2 additional spinner.
Top Vertical
Bottom Vertical
Updated in first post.

View attachment 168193
Zed, This really is what I've been looking for, but apparently I'm not experienced enough to see how to use this.
Your example code runs fine in B4J, and one of my instances of B4A, the other is giving me a signature error, but I'll figure that one out later.
The problem is that I can't see where the code is. The example only has the events to log when someone clicks. The Designer has the layout, but I need to change the values in the program (spinner type 1, min value x - .9, max value x + .9, increment .1) setting the value of x anywhere from 1 to 100.

I creating a private SpinnerX1 as SpinnerX, but the functions associated with it don't match your list.

Can you give an example of how you'd manipulate a SpinnerX in code?

Thanks,
Jim Dolan
 

zed

Well-Known Member
Licensed User
All values are integers. Therefore, it's not possible to have values ranging from 0.1 to 0.9.
It seems the DesignerProperty doesn't accept doubles.
 

PaulMeuris

Well-Known Member
Licensed User
The B4XPlusMinus view doesn't have properties for setting the numeric range.
It has a method SetNumericRange (StartRange As Double, EndRange As Double, Interval As Double)
You could add such a method to your library and not use the designer properties.
1763208118707.png

The test application (in B4J) could look like this:
B4X:
Sub Class_Globals
    Private Root As B4XView
    Private xui As XUI
    Private SpinnerX1 As SpinnerX
    Private SpinnerX2 As SpinnerX
    Private SpinnerX3 As SpinnerX
    Private SpinnerX4 As SpinnerX
    Private SpinnerX5 As SpinnerX
    Private SpinnerX6 As SpinnerX
End Sub
Public Sub Initialize
'    B4XPages.GetManager.LogEvents = True
End Sub
Private Sub B4XPage_Created (Root1 As B4XView)
    Root = Root1
    Root.LoadLayout("MainPage")
    SpinnerX1.SetNumericRange(0.0,10.0,0.1)
    SpinnerX2.SetNumericRange(0.0,10.0,0.5)
    SpinnerX3.SetNumericRange(0.0,10.0,0.5)
    SpinnerX4.SetNumericRange(0.0,10.0,0.5)
    SpinnerX5.SetNumericRange(0.0,10.0,0.5)
    SpinnerX6.SetNumericRange(0.0,10.0,0.5)
End Sub
You can set the interval value to a double value.
The display doesn't handle the number of decimal places correct yet.
My testversion (SpinnerXpm.b4xlib) of the library is in the attachment.
I changed the range variable types to double.
 

Attachments

  • SpinnerXpm.b4xlib
    4.2 KB · Views: 40

PaulMeuris

Well-Known Member
Licensed User
One more small fix:
In the HandleMinus and HandlePlus subroutines you can change the lbl_value.text to a rounded SpinnerValue.
B4X:
lbl_value.Text = Round2(SpinnerValue,1)
This will display the value without the ... when the interval is 0.1
The modified version is attached.
 

Attachments

  • SpinnerXpm.b4xlib
    4.3 KB · Views: 45

AKJammer

Active Member
Licensed User
Longtime User
And one more comment. I needed the value to start in the middle of the range, not at the minimum value. I was going to edit the library then realized I just needed to set the value AFTER you set the range. Then the library works as expected. Great little piece of code.
 
Top