B4A Library [B4X] [XUI] AS WheelPicker - Spinner - a modern single/multiple choice picker view - based on xCustomListView [Payware]

Hello,
this is a modern wheel picker, like the IOS-PickerView.
WheelPicker/Spinner

This library is not free, because, it cost a lot of time and gray hair to create such views.
Donations from 5€ or 6$ are valid. (You can donate any amount you want )
Please write WheelPicker in the order description, thanks.

Thanks for your understanding.

1. Donate
2. I will send you an e-mail with the code to decrypt the .zip file
3. Done

B4J-Preview

B4I-Preview - looks nicer and smoother in real

B4I-Preview - the WheelPicker in the use in an app

B4A-Preview

NEW Seperators with text or without text

NEW Next- and Previous-Item - scrolls to the next or previous item animated and male rounded corners

Spoiler: Dependencies/Libraries you need for this view

B4j: jXUI,jBitmapCreator,jReflection,xCustomListView,XUI Views
B4a: XUi,BitmapCreator,Reflection,xCustomListView,XUI Views
B4i: iXUI,iBitmapCreator,xCustomListView,XUI Views

On B4I you need the GestureRecognizer or download a version without errors down below. No longer needed V1.06+
Examples:

Dim tmp_lst As List : tmp_lst.Initialize 'Create and Initialize the list
    'Fill the list with dummy items
    For i = 0 To 50 -1
    'text - the text to display in the wheel
    'value - any value you want to identify the text E.g. a id
    tmp_lst.Add(CreateMap("text":"Test " & i,"value":i))
Next
ASWheelPicker1.AddWheelAdvanced(tmp_lst)'adds the list to the view and adds a wheel

'gets the item of the first wheel
'use this function when you have added the wheel with AddWheelAdvanced
Dim tmp_m As Map = ASWheelPicker1.GetSelectedItemAdvanced(0)
Log("Text: " & tmp_m.Get("text"))
Log("Value: " & tmp_m.Get("value"))

'use this function when you have added the wheel with AddWheel
Log("Text: " & ASWheelPicker1.GetSelectedItem(0))

ASWheelPicker
Author: Alexander Stolte
Version: 2.05

• ASWheelPicker
  • Events:
    • BaseResize (Width As Float)
    • ItemChange (WheelIndex As Int, ListIndex As Int)
    • ItemSnapped (wheel_index As Int, list_index As Int)
    • WheelReachEnd (wheel_index As Int)
  • Fields:
    • InactiveDuration As Int
    • mBase As B4XView
    • Tag As Object
  • Functions:
    • AddSeperator (wheel_index As Int, width As Float, text As String) As String
      wheel_index - after wich wheel do you want to show the seperator - set it to -1 to place it before the first wheel
      width - the width of the seperator
      text - if you want text, then set the text here
    • AddWheel (lst_text As List) As String
      Add a wheel with a list of text
      Full Example
      <code>Dim tmp_lst As List : tmp_lst.Initialize
      For i = 0 To 50 -1
      tmp_lst.Add("Test " & i)
      Next
      ASWheelPicker1.AddWheel(tmp_lst)</code>
    • AddWheelAdvanced (lst_text_map As List) As String
      Add a wheel with a list of maps with the content
      Required map:
      <code>CreateMap("text":"YourText","value":1)</code>
      text - a string
      value - a object, you can store whatever you want
      Full Example:
      <code>Dim tmp_lst As List : tmp_lst.Initialize
      For i = 0 To 50 -1
      tmp_lst.Add(CreateMap("text":"Test " & i,"value":i))
      Next
      ASWheelPicker1.AddWheelAdvanced(tmp_lst)</code>
    • Base_Resize (Width As Double, Height As Double) As String
    • Class_Globals As String
    • CreateASWheelPicker_ItemTextProperties (TextColor As Int, TextFont As B4XFont, TextAlignment_Vertical As String, TextAlignment_Horizontal As String, BackgroundColor As Int) As ASWheelPicker_ItemTextProperties
    • CreateASWheelPicker_SeperatorProperties (Width As Float, BackgroundColor As Int, TextColor As Int, TextFont As B4XFont, TextAlignment_Horizontal As String, index As Int) As ASWheelPicker_SeperatorProperties
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • getBase As B4XView
      gets the base view (mBase)
    • getBottomFadePanel As B4XView
    • getEvents As Boolean
    • GetIndex (wheel_index As Int) As Int
      gets the selected index
    • getItemTextProperties As ASWheelPicker_ItemTextProperties
      gets or sets the global Item Text Properties
    • getNumberOfLists As Int
      the number of lists you have added via AddWheel
    • getNumberOfSeperators As Int
      the number of seperators
    • GetSelectedItem (wheel_index As Int) As String
      Returns a string with the item text of the selected index of a wheel
      <code>Log("Text: " & ASWheelPicker1.GetSelectedItem(0))</code>
    • GetSelectedItemAdvanced (wheel_index As Int) As Map
      Returns a map with the item of the selected index of a wheel
      <code>Dim tmp_m as Map = ASWheelPicker1.GetSelectedItemAdvanced(0)
      Log("Text: " & tmp_m.Get("text"))
      Log("Value: " & tmp_m.Get("value"))</code>
    • getSeparatorWidthActAsWheel As Boolean
    • getSeperatorProperties As ASWheelPicker_SeperatorProperties
      gets or sets the global Seperator Properties
    • GetTextAt (wheel_index As Int, lst_index As Int) As String
      Get the text from a specific index
      wheel_index - the index from the order where you added AddWheel
      lst_index - the position in the list you want to have
    • getTopFadePanel As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • NextItem (wheel_index As Int, animated As Boolean)
      scrolls to the next item, jump to the first item if the next item is out of index
    • PreviousItem (wheel_index As Int, animated As Boolean)
      scrolls to the previous item, jump to the last item if the previous item is out of index
    • RemoveSeperatorAt (index As Int) As String
      removes a seperator
      <code>ASWheelPicker1.RemoveSeperatorAt(0)</code>
    • RemoveWheelAt (wheel_index As Int) As String
      removes a wheel
      <code>ASWheelPicker1.RemoveWheelAt(0)</code>
    • Scroll2Index (wheel_index As Int, item_index As Int)
      scrolls to an item on a wheel
    • setBackgroundColor (clr As Int) As String
      sets the background color
    • setCornerRadius (radius As Int) As String
      sets the corner radius of the view
    • setEvents (Enabled As Boolean) As String
      Enables or disables the events
      Default: True
    • setFadeColor (clr As Int) As String
    • setFadeEnabled (enable As Boolean) As String
      set it to false to disable the fade effect on top and bottom
    • setHapticFeedback (enabled As Boolean) As String
    • setHapticFeedbackOnSnapIn (enabled As Boolean) As String
    • SetList (wheel_index As Int, lst As List) As String
      set a list and the ScrollView is updated
      wheel_index - the index of the wheel you want, to have in the order you added the wheels
    • SetListAdvanced (wheel_index As Int, lst_text_map As List) As String
      set a list of map and the ScrollView is updated
      wheel_index - the index of the wheel you want, to have in the order you added the wheels
    • setRowHeightSelected (height As Float) As String
      sets the Selected RowHeight default is 30dip - and changes the wheel items height + selector
    • setRowHeightUnSelected (height As Float) As String
      sets the Unselected RowHeight default is 30dip - and changes the wheel items height
    • setSelectionBarColor (clr As Int) As String
    • setSeparatorWidthActAsWheel (ActAsWheel As Boolean) As String
      If false then a separator has no influence on the width of the other wheels
      Default: True
    • SetWheelWidth (WheelIndex As Int, WheelWidth As Float) As String
      Sets the width of an wheel
      Only working if you set the Width Mode to Manual
    • Size (wheel_index As Int) As Int
      gets size of a list
    • UpdateStyleOfAllWheels As String
      update the style of all wheels - changes the style to the properties of this: ItemTextProperties
      <code>ASWheelPicker1.UpdateStyleOfAllWheels</code>
    • UpdateStyleOfWheel (wheel_index As Int) As String
      update the style of a particular wheel - changes the style to the properties of this: ItemTextProperties
      <code>ASWheelPicker1.UpdateStyleOfWheel(0)</code>
  • Properties:
    • BackgroundColor
      sets the background color
    • Base As B4XView [read only]
      gets the base view (mBase)
    • BottomFadePanel As B4XView [read only]
    • CornerRadius
      sets the corner radius of the view
    • Events As Boolean
      Enables or disables the events
      Default: True
    • FadeColor
    • FadeEnabled
      set it to false to disable the fade effect on top and bottom
    • HapticFeedback
    • HapticFeedbackOnSnapIn
    • ItemTextProperties As ASWheelPicker_ItemTextProperties [read only]
      gets or sets the global Item Text Properties
    • NumberOfLists As Int [read only]
      the number of lists you have added via AddWheel
    • NumberOfSeperators As Int [read only]
      the number of seperators
    • RowHeightSelected
      sets the Selected RowHeight default is 30dip - and changes the wheel items height + selector
    • RowHeightUnSelected
      sets the Unselected RowHeight default is 30dip - and changes the wheel items height
    • SelectionBarColor
    • SeparatorWidthActAsWheel As Boolean
      If false then a separator has no influence on the width of the other wheels
      Default: True
    • SeperatorProperties As ASWheelPicker_SeperatorProperties [read only]
      gets or sets the global Seperator Properties
    • TopFadePanel As B4XView [read only]
• ASWheelPicker_ItemTextProperties
  • Fields:
    • BackgroundColor As Int
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • TextAlignment_Horizontal As String
    • TextAlignment_Vertical As String
    • TextColor As Int
    • TextFont As B4XFont
    • WheelWidth As Float
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• ASWheelPicker_SeperatorProperties
  • Fields:
    • BackgroundColor As Int
    • index As Int
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • TextAlignment_Horizontal As String
    • TextColor As Int
    • TextFont As B4XFont
    • Width As Float
  • Functions:
    • Initialize
      Initializes the fields to their default value.

Changelog

• 1.00
  • Release
• 1.01
  • Adds the Type ASWheelPicker_ItemTextProperties - hold the style propterties for the wheel text
    • Adds get ItemTextProperties - change the properties before you add a new wheel
  • Adds set RowHeight - changes the row height of the items and the selector
  • Adds UpdateStyleOfWheel - update the style of a particular wheel - changes the style to the properties of this: ItemTextProperties
  • Adds UpdateStyleOfAllWheels - update the style of all wheels - changes the style to the properties of this: ItemTextProperties
  • Adds RemoveWheelAt - removes a wheel
• 1.02
  • Adds FadeEnabled - set it to false to disable the fade effect on top and bottom
  • Adds RowHeightSelected - sets the Selected RowHeight default is 30dip - and changes the wheel items height + selector
  • Adds RowHeightUnSelected - sets the Unselected RowHeight default is 30dip - and changes the wheel items height
  • Removed RowHeight - use RowHeightSelected and RowHeightUnSelected
• 1.03
  • Add get Base - gets the base view (mBase)
  • Add Scroll2Index - scrolls to an item on a wheel
  • Add get Index - gets the selected index
• 1.04
  • Add Size - gets size of a list
  • the index of a list now starts at 0
• 1.05
  • Add AddSeperator - adds an seperator after a wheel. IF you want a placeholder before the first wheel, then set the index to -1
    • seperators can display text
    • seperators can be customized
  • Add RemoveSeperatorAt - removes a seperator
• 2.00
  • Better Handling if you set an invalid wheel_index as parameter to the functions
  • Add get TopFadePanel
  • Add get BottomFadePanel
  • Fade Panels are now above and under the selector panel
  • Add Next - scrolls to the next item, jump to the last item if the next item is out of index
    • 
  • Add Previous - scrolls to the previous item, jump to the last item if the previous item is out of index
  • Add set CornerRadius - sets the corner radius of the view
    • Add Designer Property CornerRadius
  • SnapIn Improved - Immediately snaps into place without moving again
  • BugFixes
  • new depency: XUIViews, is needed for the HapticFeedback
• 2.01
  • Add get NumberOfSeperators - the number of seperators
  • BugFix View Resizing
• 2.03
  • Add Event BaseResize - Triggers as soon as the width in the view has changed
  • Add Event ItemChange - Triggers when an item reaches the center while scrolling, so you can display the results e.g. in a label instant
  • B4I Item snap is now smooth
• 2.04 (read more)
  • Complete rework of the wheel sizing
  • Add Designer Property WidthMode - Default: Automatic
    • Automatic - You don't have to worry about anything, the view calculates the right size for all wheels
    • Manual - Set the wheel sizes you need via "SetWheelWidth"
  • Add WheelWidth to ItemTextProperties - This allows you to set the width of a wheel manually, only working if WidthMode = Manual - Default: 0
  • Add SetWheelWidth - Sets the width of an wheel, only working if WidthMode = Manual
  • Add get and set Events - Enables or disables the events
  • Haptic feedback disabled if you call Scroll2Index
  • BugFixes
• 2.06
  • BugFixes
  • GestureRecognizer is now inside the B4XLib

Have Fun

 

[angel_]

I have the same problem (iOS 12.5.2)

Application_Start
*** mainpage: B4XPage_Created
*** Assertion failure in -[UIImpactFeedbackGenerator initWithConfiguration:coordinateSpace:], /BuildRoot/Library/Caches/com.apple.xbs/Sources/UIKitCore/UIKit-3698.140/UIFeedbackGenerator.m:124
Error occurred on line: 87 (ASWheelPicker)
Invalid configuration class (null) for generator <UIImpactFeedbackGenerator: 0x280671440: prepared=0>
Stack Trace: (
  CoreFoundation       <redacted> + 252
  libobjc.A.dylib      objc_exception_throw + 56
  CoreFoundation       <redacted> + 0
  Foundation           <redacted> + 112
  UIKitCore            <redacted> + 372
  UIKitCore            <redacted> + 192
  UIKitCore            <redacted> + 84
  CoreFoundation       <redacted> + 144
  CoreFoundation       <redacted> + 292
  B4i Example          +[B4I runDynamicMethod:method:throwErrorIfMissing:args:] + 1608
 B4i Example          -[B4INativeObject RunMethod::] + 216
 B4i Example          -[b4i_aswheelpicker _initialize::::] + 1364
 CoreFoundation       <redacted> + 144
 CoreFoundation       <redacted> + 292
 B4i Example          +[B4I runDynamicMethod:method:throwErrorIfMissing:args:] + 1608
 B4i Example          -[B4IShell runMethod:] + 448
 B4i Example          -[B4IShell raiseEventImpl:method:args::] + 2172
 B4i Example          -[B4IShellBI raiseEvent:event:params:] + 1580
 B4i Example          -[B4ICustomViewWrapper AfterDesignerScript] + 1828
 B4i Example          -[B4ILayoutBuilder loadLayout:::] + 2696
 B4i Example          -[B4IPanelWrapper LoadLayout::] + 204
 B4i Example          -[B4XViewWrapper LoadLayout::] + 100
 B4i Example          -[ResumableSub_b4xmainpage_B4XPage_Created resume::] + 676
 B4i Example          -[b4i_b4xmainpage _b4xpage_created::] + 548
 CoreFoundation       <redacted> + 144
 CoreFoundation       <redacted> + 292
 B4i Example          +[B4I runDynamicMethod:method:throwErrorIfMissing:args:] + 1608
 B4i Example          -[B4ICommon CallSubDebug4::::] + 1080
 B4i Example          -[B4ICommon CallSubDebug2::::] + 372
 B4i Example          -[b4i_b4xpagesmanager _createpageifneeded::] + 1152
 B4i Example          -[b4i_b4xpagesmanager _showpage::] + 828
 B4i Example          -[b4i_b4xpagesmanager _addpage:::] + 1428
 B4i Example          -[b4i_b4xpagesmanager _addpageandcreate:::] + 640
 B4i Example          -[b4i_b4xpagesmanager _initialize:::] + 1892
 B4i Example          -[b4i_main _application_start:] + 700
 CoreFoundation       <redacted> + 144
 CoreFoundation       <redacted> + 292
 B4i Example          +[B4I runDynamicMethod:method:throwErrorIfMissing:args:] + 1608
 B4i Example          -[B4IShell runMethod:] + 448
 B4i Example          -[B4IShell raiseEventImpl:method:args::] + 2172
 B4i Example          -[B4IShellBI raiseEvent:event:params:] + 1580
 B4i Example          __33-[B4I raiseUIEvent:event:params:]_block_invoke + 60
 libdispatch.dylib    <redacted> + 24
 libdispatch.dylib    <redacted> + 16
 libdispatch.dylib    <redacted> + 1068
 CoreFoundation       <redacted> + 12
 CoreFoundation       <redacted> + 1924
 CoreFoundation       CFRunLoopRunSpecific + 436
 GraphicsServices     GSEventRunModal + 104
 UIKitCore            UIApplicationMain + 212
 B4i Example          main + 128
 libdyld.dylib        <redacted> + 4
)
Application_Active

In Ipad (iOS 14.4.2.), it works fine

 

[Erel]

Alexander, you can use XUIViewsUtils.PerformHapticFeedback.

 

[Alexander Stolte]

ok, i did it, it is the "soft" variant of the vibrate, this is IOS 13+, i changed i to 0 = light.
Please redownload the lib.

i am currently working on an update to cover another usecase with this view, but currently i still have problems with the ListView at B4A. But I am confident to fix this in the next days.

 

[Alexander Stolte]

Alexander, you can use XUIViewsUtils.PerformHapticFeedback.

i know, but i wanted the "soft" feedback, but to be honest, that makes no difference.
I will add it in the next update.

 

[Alexander Stolte]

Big Update
2.00

• Better Handling if you set an invalid wheel_index as parameter to the functions
• Add get TopFadePanel
• Add get BottomFadePanel
• Fade Panels are now above and under the selector panel
• Add Next - scrolls to the next item, jump to the last item if the next item is out of index
  • 
    
    
• Add Previous - scrolls to the previous item, jump to the last item if the previous item is out of index
• Add set CornerRadius - sets the corner radius of the view
  • Add Designer Property CornerRadius
• SnapIn Improved - Immediately snaps into place without moving again
• BugFixes
• new depency: XUIViews, is needed for the HapticFeedback

Example Project with the new features you can find here

[B4X] AS WheelPicker PlusMinus Example

This is an example project to demonstrate what is possible with the beautiful ASWheel. From version 2.0 it is possible per function animated (also possible without animations) to go steps forward and back. Other customization options like making the corners round or hiding everything that is...

www.b4x.com

A backup with the previous version in case of problems, you can find in the 1st post.

 

[Cyan]

Sorry dumb question from me, but according to the documentation, doesn't ItemTextProperties also need a setter? Currently it's a readonly property but the description mentions that it also sets the value.

 

[Alexander Stolte]

but according to the documentation, doesn't ItemTextProperties also need a setter?

no because, you call "ItemTextProperties." and you have listed all the properties, you can set a value to this properties.

 

[Cyan]

no because, you call "ItemTextProperties." and you have listed all the properties, you can set a value to this properties.

Thank you for your quick reply! Okay great, I was just confused by the "gets or sets" method description. Brilliant control by the way - thank you.

 

[Lisa I]

Hi I got the demo project up and running but I want to implement the ASWheelPicker into an existing B4A project. It is quite a large project and isn't built on B4APages.
I am struggling to work out if I can add a ASWheelpicker to this project, is it possible?

If so can you give me some pointers on how to get it going.

Thank you

 

[Alexander Stolte]

I am struggling to work out if I can add a ASWheelpicker to this project, is it possible?

I don't see why that shouldn't work.
There is nothing in the example project that is B4XPage only.

1. Add the wheelpicker to a form
2. add "wheels" like in the demo project
3. done

 

[Lisa I]

I don't see why that shouldn't work.
There is nothing in the example project that is B4XPage only.

1. Add the wheelpicker to a form
2. add "wheels" like in the demo project
3. done

I have added the ASWheelPicker in the designer and generated members but keep getting the error
java.lang.RuntimeException: Class instance was not initialized (aswheelpicker)

Dim carlist1 As List
    carlist1.Initialize
    carlist1.AddAll(Array As String("All",1,2,3))
    ASWheelPicker1.AddWheel(carlist1)
    ASWheelPicker1.ItemTextProperties.TextAlignment_Horizontal = "RIGHT"
    ASWheelPicker1.SeperatorProperties.BackgroundColor = ASWheelPicker1.mBase.Color
    ASWheelPicker1.SeperatorProperties.TextAlignment_Horizontal = "LEFT"
    ASWheelPicker1.SeperatorProperties.TextFont = xui.CreateDefaultBoldFont(15)

If I initialize it myself

ASWheelPicker1.Initialize("me", "Me")

I get the error
java.lang.RuntimeException: Object should first be initialized (B4XView).

Have I missed something?

 

[Alexander Stolte]

Are you sure the form where the view is on it was loaded?

like activity.loadlayout("yourform")

 

[Lisa I]

I have added the ASWheelPicker in the designer and generated members but keep getting the error
java.lang.RuntimeException: Class instance was not initialized (aswheelpicker)

Dim carlist1 As List
    carlist1.Initialize
    carlist1.AddAll(Array As String("All",1,2,3))
    ASWheelPicker1.AddWheel(carlist1)
    ASWheelPicker1.ItemTextProperties.TextAlignment_Horizontal = "RIGHT"
    ASWheelPicker1.SeperatorProperties.BackgroundColor = ASWheelPicker1.mBase.Color
    ASWheelPicker1.SeperatorProperties.TextAlignment_Horizontal = "LEFT"
    ASWheelPicker1.SeperatorProperties.TextFont = xui.CreateDefaultBoldFont(15)

If I initialize it myself

ASWheelPicker1.Initialize("me", "Me")

I get the error
java.lang.RuntimeException: Object should first be initialized (B4XView).

Have I missed something?

So sorry I realised my mistake, I was calling the wrong page layout - duhhhh

 

[Lisa I]

Can you set the width of a wheel? I have a long string of text in each list entry and it is splitting it on 2 lines despite the wheelpicker being longer than the text.

Cheers

 

[Alexander Stolte]

is splitting it on 2 lines despite the wheelpicker being longer than the text.

If you have e.g. 2 wheelpickers, then the width is divided by 2, so the text looks even at the end and not shifted.

Can you set the width of a wheel?

Currently not, but I could add it, with the seperators, I do that.
I have to see if it can be integrated.

 

[Waldemar Lima]

can u post source code ?
i would like to become a well b4x layout maker like yours ...

 

[Alexander Stolte]

can u post source code ?

buy the view, then you have the source code, pass on or share, I forbid. But I will not give the knowhow for free, the view cost me more than 48 hours of work...

 

[Waldemar Lima]

buy the view, then you have the source code, pass on or share, I forbid. But I will not give the knowhow for free, the view cost me more than 48 hours of work...

how can i buy ?

 

[Alexander Stolte]

how can i buy ?

This library is not free, because, it cost a lot of time and gray hair to create such views.
Donations from 5€ or 6$ are valid. (You can donate any amount you want )
Please write WheelPicker in the order description, thanks.

Thanks for your understanding.

1. Donate
2. I will send you an e-mail with the code to decrypt the .zip file
3. Done

 

[Alexander Stolte]

Update

• 2.01
  • Add get NumberOfSeperators - the number of seperators
  • BugFix View Resizing