B4A Library [B4X] AS WheelDateTimePicker - based on ASWheelPicker

This is a date and time picker in IOS picker design.

This library is based on the ASWheelPicker, without it the library will not work.

[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. https://payhip.com/b/IvqnN Thanks for your understanding. :) V3.00-Preview B4I-Preview - looks nicer and smoother in...

www.b4x.com

Use:

AS_WheelDateTimePicker1.Create

ASWheelDateTimePicker
Author: Alexander Stolte
Version: 1.00

• ASWheelDateTimePicker_MonthName
  • Fields:
    • April As String
    • August As String
    • December As String
    • February As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • January As String
    • July As String
    • June As String
    • March As String
    • May As String
    • November As String
    • October As String
    • September As String
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• ASWheelDateTimePicker_MonthNameShort
  • Fields:
    • April As String
    • August As String
    • December As String
    • February As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • January As String
    • July As String
    • June As String
    • March As String
    • May As String
    • November As String
    • October As String
    • September As String
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• ASWheelDateTimePicker_WeekNameShort
  • Fields:
    • Friday As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • Monday As String
    • Saturday As String
    • Sunday As String
    • Thursday As String
    • Tuesday As String
    • Wednesday As String
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• AS_WheelDateTimePicker
  • Events:
    • SelectedDateChanged (Date As Long)
    • SelectedTimeChanged (Hour As Int, Minute As Int)
  • Fields:
    • mBase As B4XView
    • Tag As Object
  • Functions:
    • Class_Globals As String
    • CreateASWheelDateTimePicker_MonthName (January As String, February As String, March As String, April As String, May As String, June As String, July As String, August As String, September As String, October As String, November As String, December As String) As ASWheelDateTimePicker_MonthName
    • CreateASWheelDateTimePicker_MonthNameShort (January As String, February As String, March As String, April As String, May As String, June As String, July As String, August As String, September As String, October As String, November As String, December As String) As ASWheelDateTimePicker_MonthNameShort
    • CreateASWheelDateTimePicker_WeekNameShort (Monday As String, Tuesday As String, Wednesday As String, Thursday As String, Friday As String, Saturday As String, Sunday As String) As ASWheelDateTimePicker_WeekNameShort
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • getHour As Int
    • getMinute As Int
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
  • Properties:
    • Hour As Int [read only]
    • Minute As Int [read only]

Changelog

• 1.00
  • Release
• 1.01
  • BugFixes
• 1.02
  • Add set Hour
  • Add set Minute
  • Add set Date
• 1.03
  • Add Refresh
• 1.04
  • BugFixes
  • PickerType = DatePicker - The days in the month now adjust automatically
  • Add Designer Property TextColor
  • Add Designer Property FadeColor
  • Add Designer Property HapticFeedback
• 1.05
  • Add Designer Property TodayText
    • Default: Today
  • Add get and set TodayText - Call Refresh if you change something
• 1.06
  • BugFixes
• 1.07
  • BugFixes - AM and PM mode works now as expected
  • BugFixes - setDate Number of days is now adjusted
• 1.08
  • Add get and set FadeColor
  • Add get and set TextColor
  • Add get and set SelectorColor
  • Add get and set BackgroundColor
  • MonthName now comes from the DateUtils
• 1.09
  • BugFixes
• 1.10
  • BugFixes
• 1.11
  • Add Designer Property MinuteSteps - 1-5-10-15 Block Interval
    • Default: False
• 1.12
  • BugFixes
• 1.13
  • Add get WheelPicker - gets the wheelpicker to modify font etc.
• 1.14 (read more)
  • You need AS_WheelPicker V3.15+ for this update
  • If a month has 30 or 28 days, then these are now no longer removed from the list, but the new EnabledRow is used and the affected items are deactivated.
    • This prevents the list from behaving in an unusual way.
  • Add MinDate and MaxDate - You can specify a DateRange what may be selected
• 1.15
  • You need AS_WheelPicker V3.20+
  • Breaking Change: You need to call Create
    • The view will not be built without it
    • Now you can make changes to the proepties without calling refresh at the beginning
    • Faster loading time
    • No crashes
  • Add SetDateTextOrder - You can change the text order of the date text
  • BugFixes
  • Add Event CustomDrawItemChange

Have Fun

 

[hazaal]

Hi,

Nice picker, after playing with it for a while, I have couple of questions

1) How to change the font size and style? It's a way too small for elderly people like me
And afterwards there will be a need to change the height of "rows" so that bigger font will fit there?

2) Which color settings should I use to get rid of that gray fading? I have changed every color in designer, and now there is not even a hint of gray nor black color, but still it's fading from gray to fadecolor

Br,
-Harri

 

[Alexander Stolte]

Update

• 1.13
  • Add get WheelPicker - gets the wheelpicker to modify font etc.

1) How to change the font size and style? It's a way too small for elderly people like me
And afterwards there will be a need to change the height of "rows" so that bigger font will fit there?

You need 3.14+ from AS_WheelPicker and 1.13 from AS_WheelDateTimePicker. Then do this:

    Dim ItemTextProperties As ASWheelPicker_ItemTextProperties = AS_WheelDateTimePicker1.WheelPicker.ItemTextProperties
    ItemTextProperties.TextFont = xui.CreateDefaultFont(25)
    AS_WheelDateTimePicker1.WheelPicker.ItemTextProperties = ItemTextProperties

    AS_WheelDateTimePicker1.WheelPicker.RowHeightSelected = 50dip
    AS_WheelDateTimePicker1.WheelPicker.RowHeightUnSelected = 50dip

2) Which color settings should I use to get rid of that gray fading? I have changed every color in designer, and now there is not even a hint of gray nor black color, but still it's fading from gray to fadecolor

It's called FadeColor in the designer, if you set the Alpha to 0, then there is no Shadow anymore.

 

[Alexander Stolte]

Update

• 1.14
  • You need AS_WheelPicker V3.15+ for this update
  • If a month has 30 or 28 days, then these are now no longer removed from the list, but the new EnabledRow is used and the affected items are deactivated.
    • This prevents the list from behaving in an unusual way.
  • Add MinDate and MaxDate - You can specify a DateRange what may be selected

You need AS_WheelPicker V3.15+ for this update
MinDate and MaxDate

AS_WheelDateTimePicker4.MinDate = DateUtils.SetDate(2020,2,8)
AS_WheelDateTimePicker4.MaxDate = DateTime.Now + DateTime.TicksPerDay*5
AS_WheelDateTimePicker4.Refresh

Is it possible to set a maximum and minimum date for the date picker?

Now it is possible.
I had already started the feature a few months ago and cut my teeth. I had tried to remove the inactive days/months from the list. But that had led every time to unwanted behavior of the lists. So I had discarded the whole thing again. Then I had now seen in other apps always like the solve in their WheelPicker, instead of removing the items from the list, the simply disable the inactive days. This is now a much better variant.

 

[parijs]

Hi

How do I get rid of time in


Private Sub AS_WheelDateTimePicker4_SelectedDateChanged(Date As Long)
Log("SelectedTimeChanged: " & DateUtils.TicksToString(Date))
xlbl_DateTime.Text = DateUtils.TicksToString(Date)
End Sub

 

[Alexander Stolte]

Use DateTime.Date

 

[marcick]

Hi Alexander,
when it is for example "Mon Aug 30" in England it is "Lun 30 Ago" in Italy but I have a "Lun Ago 30" instead
How to swap the day before the month ?

Besides, how to manage the TextSize ? (I need the AutoscaleAll in the designer script)
I don't see the ItemTextProperty as in AS WheelPicker

 

[Alexander Stolte]

when it is for example "Mon Aug 30" in England it is "Lun 30 Ago" in Italy but I have a "Lun Ago 30" instead
How to swap the day before the month ?

I received your request and implemented a solution yesterday. Unfortunately, the WheelPicker doesn't like me and I spent 6 hours yesterday removing unwanted behavior. I managed except for one error that only occurs in B4A and only in release mode.

Besides, how to manage the TextSize ? (I need the AutoscaleAll in the designer script)
I don't see the ItemTextProperty as in AS WheelPicker

I'll look at this in the next update.

 

[marcick]

Sorry for this trouble.
when I want to do something that looks great I always take iOS as model.
If it can help, this is how datetime picker looks in iOS out of the box. Large text and horizontally compact.
Note that if you try to increase text size in your control, it does not fit horizontally.

 

[Alexander Stolte]

Sorry for this trouble.

The xCustomListview has its different quirks on all 3 platforms.

when I want to do something that looks great I always take iOS as model.
If it can help, this is how datetime picker looks in iOS out of the box. Large text and horizontally compact

In the next update you can change the order as follows:

'Weekname - Fri
'Monthname - Jun
'DayOfMonth - 19
'Example:1,2,3 = Fri Jun 19
'Example:2,1,3 = Jun Fri 19
'Example:3,2,1 = 19 Jun Fri
AS_WheelDateTimePicker3.SetDateTextOrder(1,2,3)

 

[Alexander Stolte]

Update

• 1.15
  • You need AS_WheelPicker V3.20+
  • Breaking Change: You need to call Create
    • The view will not be built without it
    • Now you can make changes to the proepties without calling refresh at the beginning
    • Faster loading time
    • No crashes
  • Add SetDateTextOrder - You can change the text order of the date text
  • BugFixes
  • Add Event CustomDrawItemChange

Breaking Change
You must now call .Create before the view is built.

This change is necessary because a .refresh messes up a lot of things when building the view and causes crashes. Now you can change properties at the start and then they are applied directly after you have called .Create.
Example project are updated.
SetDateTextOrder

'Weekname - Fri
'Monthname - Jun
'DayOfMonth - 19
'Example:1,2,3 = Fri Jun 19
'Example:2,1,3 = Jun Fri 19
'Example:3,2,1 = 19 Jun Fri
AS_WheelDateTimePicker3.SetDateTextOrder(1,2,3)

 

[marcick]

I'm using this code in B4A to show the (already created) datepicker with a specific datetime, but it shows always "today 13:00"
wher I'm wrong ?

    DtpckrStorici.MinDate=StartDate
    DtpckrStorici.MaxDate=EndDate
    Sleep(0)
    DtpckrStorici.Date=MyDate
    DtpckrStorici.Refresh

 

[Alexander Stolte]

DtpckrStorici.Date

The date property is just for dates. If you want to change the hour then use the hour property and if you want to change the minute, then use the minute property.

 

[marcick]

MyDate in the code above is for example "2 sept 2023 15:54" (long variable), but I see today date instead. Ok for hours and minutes but the date itself is non set

DtpckrStorici.MinDate=StartDate
    DtpckrStorici.MaxDate=EndDate
    Sleep(0)
    DateTime.DateFormat="dd/MM/yyyy"
    Dim MyDate As Long=DateTime.DateParse("02/09/2023")
    DtpckrStorici.Date=MyDate
    DtpckrStorici.Refresh

 

[Alexander Stolte]

You dont need to call "Refresh" the property do the scroll for you. Just use a Sleep(0) before you set the date and time.

    AS_WheelDateTimePicker3.Create
    Sleep(0)
    AS_WheelDateTimePicker3.Date = DateUtils.SetDate(2023,12,31)

 

[marcick]

is this the correct code ?

    Dim EsportaDal as long= ... full datetime
    Sleep(0)
    DtpckrStorici.Date=DateUtils.SetDate(DateTime.GetYear(EsportaDal),DateTime.GetMonth(EsportaDal), DateTime.GetDayOfMonth(EsportaDal))
    DtpckrStorici.Hour=DateTime.GetHour(EsportaDal)
    DtpckrStorici.Minute=DateTime.GetMinute(EsportaDal)

 

[Alexander Stolte]

is this the correct code ?

does it work? if not provide an example project, then you and i won't waste so much time.

 

[marcick]

Yes, it works. I just ask confirmation that is correct all that code just to pass a long datetime.

Another problem: you recently fixed an issue introducing ".SetDateTextOrder" and it is ok. But when you set the PickerType as "DatePicker" not "TimePicker" there is not the option to set the correct order.
We have in Italy "day, month, year" but I get always "month, day, year" as for english notation.
Also, using the same code above, I always obtain "agosto 01 1900" not the expected date

Sorry to bore you so much but I have no other doors to knock ...

 

[Alexander Stolte]

Another problem: you recently fixed an issue introducing ".SetDateTextOrder" and it is ok. But when you set the PickerType as "DatePicker" not "TimePicker" there is not the option to set the correct order.
We have in Italy "day, month, year" but I get always "month, day, year" as for english notation.
Also, using the same code above, I always obtain "agosto 01 1900" not the expected date

I'm sorry, but I'm not going to include that. I've been trying for the last 2 hours, but the B4XOrderedMap suddenly stopped working as it should and kept returning the wrong sort order. Also, no matter what time zone you live in, it's more than obvious to the user what each slider is for. With date entries where there are only numbers, I understand that, but here it is more than obvious where what is.

 

[marcick]

Please do not worry. I understand things are always more difficult than what they seem. And I know you did a great effort to share this stuff almost for free. Anyway, the format the date are represented is typical of the country and should be in conformity. I’ll decide what to do and eventually come back to the built in date picker. Also I can’t see the correct date shown ( I see agosto 1 1900) but it’s for sure my fault and I’ll try again to see where I’m wrong. Bye.

 

[marcick]

I have crashes when using AsWheelDateTimePicker in conjunction with FileHandler, only running in Release, Debug works ok.
I attach a sample B4x project (look only the B4A code).
Run it and try to save the file from the MainPage (no DatePicker present), no error.
Then switch to page2 where a DatePicker is present and try again to save the file -->> crash.
Removing the DatePicker the crash disappear.

edit: Alexander, looks like the test project is too large to upload here, tell me where and I'll send you directly.

Sub Class_Globals
    Private Root As B4XView 'ignore
    Private xui As XUI 'ignore
    Private Dtpckr1 As AS_WheelDateTimePicker
End Sub

'You can add more parameters here.
Public Sub Initialize As Object
    Return Me
End Sub

'This event will be called once, before the page becomes visible.
Private Sub B4XPage_Created (Root1 As B4XView)
    Root = Root1
    Root.LoadLayout("Page2")
    Dtpckr1.Create
End Sub


Private Sub BtnSaveFile_Click
    Dim Filehandler1 As FileHandler
    Filehandler1.Initialize
    Wait For (Filehandler1.SaveAs(File.OpenInput(File.DirAssets, "testfile"), "application/octet-stream", "testfile")) Complete (Success As Boolean)
End Sub

** Activity (main) Create (first time) **
Call B4XPages.GetManager.LogEvents = True to enable logging B4XPages events.
** Activity (main) Resume **
** Activity (main) Pause event (activity is not paused). **
sending message to waiting queue (OnActivityResult)
running waiting messages (1)
** Activity (main) Resume **
** Activity (main) Pause event (activity is not paused). **
java.lang.RuntimeException: android.os.TransactionTooLargeException: data parcel size 654596 bytes
Bundle stats:
  android:viewHierarchyState [size=654332]
    android:views [size=653732]
PersistableBundle stats:
  [null]
    at android.app.servertransaction.PendingTransactionActions$StopInfo.run(PendingTransactionActions.java:146)
    at android.os.Handler.handleCallback(Handler.java:958)
    at android.os.Handler.dispatchMessage(Handler.java:99)
    at android.os.Looper.loopOnce(Looper.java:205)
    at android.os.Looper.loop(Looper.java:294)
    at android.app.ActivityThread.main(ActivityThread.java:8177)
    at java.lang.reflect.Method.invoke(Native Method)
    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:552)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:971)
Caused by: android.os.TransactionTooLargeException: data parcel size 654596 bytes
    at android.os.BinderProxy.transactNative(Native Method)
    at android.os.BinderProxy.transact(BinderProxy.java:584)
    at android.app.IActivityClientController$Stub$Proxy.activityStopped(IActivityClientController.java:1439)
    at android.app.ActivityClient.activityStopped(ActivityClient.java:96)
    at android.app.servertransaction.PendingTransactionActions$StopInfo.run(PendingTransactionActions.java:135)
    ... 8 more