B4A Library [B4X] [XUI] AS DatePicker - fast navigate to a Month - Year - Decade - Century | RangeDatePicker

This is a simple DatePicker, with which you can quickly reach your target date. With a click on the header the view changes.

I spend a lot of time in creating views, like this and to create a high quality view cost a lot of time. If you want to support me and further views, then you can do it here by Paypal or with a coffee. :)
  • In the month view, you can select a date
  • In the year view, you select a month
  • In the decade you see a range of 10 years
  • In century you can see 100 years
HBCw9HcyQl51OlUSlkTang3geQJQGCYaAtbFvJ4bHaAfHiPt9x.jpeg
MAvotbEkSVF012K5ZvMBXJBMgq0gdeN8BNFT10UVz925EIRgvN.jpeg
nVlr2QIwJribjmnzAht8UhSPd4iMa2mYrVlHtXWb5z33PdchLN.jpeg
a9iPjjQcHMfthkQ2evsSQi52cxy4CGsF1OEBRKeyykkYFbz1Pd.jpeg


1651251003803.png

SelectMode = Range
yMwZX6ytGOLhuNub4FlILMaG4alBZHio8ZxhZ9MXttbFf5bRV8.jpeg

Make sure you are using ASViewPager V2.01+
ASDatePicker
Author: Alexander Stolte
Version: 1.17

  • ASDatePicker_BodyProperties
    • Fields:
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • TextColor As Int
      • xFont As B4XFont
    • Functions:
      • Initialize
        Initializes the fields to their default value.
  • ASDatePicker_CustomDrawDay
    • Fields:
      • BackgroundPanel As B4XView
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • xlbl_Date As B4XView
    • Functions:
      • Initialize
        Initializes the fields to their default value.
  • ASDatePicker_HeaderProperties
    • Fields:
      • ButtonIconSize As Float
      • Height As Float
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • TextColor As Int
      • xFont As B4XFont
    • Functions:
      • Initialize
        Initializes the fields to their default value.
  • ASDatePicker_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.
  • ASDatePicker_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.
  • ASDatePicker_WeekNumberProperties
    • Fields:
      • Color As Int
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • Text As String
      • TextColor As Int
      • Width As Float
      • xFont As B4XFont
    • Functions:
      • Initialize
        Initializes the fields to their default value.
  • AS_DatePicker
    • Events:
      • CustomDrawDay (Date As Long, Views As ASDatePicker_CustomDrawDay)
      • SelectedDateChanged (Date As Long)
      • SelectedDateRangeChanged (StartDate As Long, EndDate As Long)
    • Fields:
      • mBase As B4XView
      • Tag As Object
    • Functions:
      • ChangeView (NewView As String)
      • Class_Globals As String
      • CreateASDatePicker_BodyProperties (xFont As B4XFont, TextColor As Int) As ASDatePicker_BodyProperties
      • CreateASDatePicker_HeaderProperties (Height As Float, xFont As B4XFont, TextColor As Int, ButtonIconSize As Float) As ASDatePicker_HeaderProperties
      • CreateASDatePicker_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 ASDatePicker_MonthNameShort
        <code>AS_DatePicker1.MonthNameShort = AS_DatePicker1.CreateASDatePicker_MonthNameShort("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sept","Oct","Nov","Dec")</code>
      • CreateASDatePicker_WeekNameShort (Monday As String, Tuesday As String, Wednesday As String, Thursday As String, Friday As String, Saturday As String, Sunday As String) As ASDatePicker_WeekNameShort
        <code>AS_DatePicker1.CreateASDatePicker_WeekNameShort("Mon","Tue","Wed","Thu","Fri","Sat","Sun")</code>
      • CreateASDatePicker_WeekNumberProperties (Width As Float, Color As Int, xFont As B4XFont, TextColor As Int, Text As String) As ASDatePicker_WeekNumberProperties
      • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
        Base type must be Object
      • getBodyColor As Int
      • getBodyProperties As ASDatePicker_BodyProperties
      • getCurrentDateColor As Int
      • getCurrentView_CenturyView As String
      • getCurrentView_DecadeView As String
      • getCurrentView_MonthView As String
      • getCurrentView_YearView As String
      • GetFirstDayOfWeek2 (Ticks As Long, FirstDayOfWeek As Int) As Long
        FirstDayOfWeek:
        Friday = 1
        Thursday = 2
        Wednesday = 3
        Tuesday = 4
        Monday = 5
        Sunday = 6
        Saturday = 7
      • getGridLineColor As Int
      • getHeaderColor As Int
      • getHeaderPanel As B4XView
        You can customize the appereance of the header
        With the following code you can customize the control elements that are visible in the header:
        <code>
        'Middle Text Label
        Dim xlbl_Header As B4XView = AS_DatePicker1.HeaderPanel.GetView(0)
        'Left Arrow Label
        Dim xlbl_ArrowLeft As B4XView = AS_DatePicker1.HeaderPanel.GetView(1)
        'Right Arrow Label
        Dim xlbl_ArrowRight As B4XView = AS_DatePicker1.HeaderPanel.GetView(2)
        </code>
      • getHeaderProperties As ASDatePicker_HeaderProperties
      • getMaxDate As Long
      • getMinDate As Long
      • getMonthNameShort As ASDatePicker_MonthNameShort
        Call Refresh if you change something
        <code>AS_DatePicker1.MonthNameShort = AS_DatePicker1.CreateASDatePicker_MonthNameShort("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sept","Oct","Nov","Dec")</code>
      • getSelectedDate As Long
      • getSelectedDateColor As Int
      • getSelectedEndDate As Long
        Only in SelectMode "Range"
      • getSelectedStartDate As Long
      • getSelectMode As String
      • getSelectMode_Day As String
      • getSelectMode_Month As String
      • getSelectMode_Range As String
      • getShowGridLines As Boolean
      • getShowWeekNumbers As Boolean
        Gets or sets the number of visible weeks
        Call Refresh to commit changes
      • GetWeekNameByIndex (Index As Int) As String
        1 = Sunday
      • getWeekNameShort As ASDatePicker_WeekNameShort
      • getWeekNumberProperties As ASDatePicker_WeekNumberProperties
        Call Refresh if you change something
        Default Values
        Width: <code>20dip</code>
        Color: <code>xui.Color_ARGB(255,32, 33, 37)</code>
        xFont: <code>xui.CreateDefaultFont(15)</code>
        TextColor: <code>xui.Color_White</code>
      • Initialize (Callback As Object, EventName As String) As String
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • Rebuild
        Clears the DatePicker and builds the DatePicker new
      • Refresh As String
      • RefreshHeader As String
        Applies the header properties if any have been changed
      • RefreshSelectedDate As String
      • Scroll2Date (Date As Long) As String
        Scrolls to the date
        Builds the view new if the date was not in range
      • setBodyColor (Color As Int) As String
      • setBodyProperties (BodyProperties As ASDatePicker_BodyProperties) As String
      • setCurrentDateColor (Color As Int) As String
      • setFirstDayOfWeek (number As Int) As String
        1-7
        Friday = 1
        Thursday = 2
        Wednesday = 3
        Tuesday = 4
        Monday = 5
        Sunday = 6
        Saturday = 7
      • setGridLineColor (Color As Int) As String
      • setHeaderColor (Color As Int) As String
      • setHeaderProperties (HeaderProperties As ASDatePicker_HeaderProperties) As String
      • setMaxDate (MaxDate As Long) As String
        Will restrict date navigations features of forward, and also cannot swipe the control using touch gesture beyond the max date range
      • setMinDate (MinDate As Long) As String
        Will restrict date navigations features of backward, also cannot swipe the control using touch gesture beyond the min date range
      • setMonthNameShort (MonthNameShort As ASDatePicker_MonthNameShort) As String
      • setSelectedDate (Date As Long) As String
      • setSelectedDateColor (Color As Int) As String
      • setSelectedEndDate (Date As Long) As String
      • setSelectedStartDate (Date As Long) As String
      • setSelectMode (Mode As String) As String
      • setShowGridLines (Show As Boolean) As String
      • setShowWeekNumbers (Show As Boolean) As String
      • setWeekNameShort (WeekNameShort As ASDatePicker_WeekNameShort) As String
        Call Refresh if you change something
        <code>AS_DatePicker1.CreateASDatePicker_WeekNameShort("Mon","Tue","Wed","Thu","Fri","Sat","Sun")</code>
      • setWeekNumberProperties (WeekNumberProperties As ASDatePicker_WeekNumberProperties) As String
    • Properties:
      • BodyColor As Int
      • BodyProperties As ASDatePicker_BodyProperties
      • CurrentDateColor As Int
      • CurrentView_CenturyView As String [read only]
      • CurrentView_DecadeView As String [read only]
      • CurrentView_MonthView As String [read only]
      • CurrentView_YearView As String [read only]
      • FirstDayOfWeek
        1-7
        Friday = 1
        Thursday = 2
        Wednesday = 3
        Tuesday = 4
        Monday = 5
        Sunday = 6
        Saturday = 7
      • GridLineColor As Int
      • HeaderColor As Int
      • HeaderPanel As B4XView [read only]
        You can customize the appereance of the header
        With the following code you can customize the control elements that are visible in the header:
        <code>
        'Middle Text Label
        Dim xlbl_Header As B4XView = AS_DatePicker1.HeaderPanel.GetView(0)
        'Left Arrow Label
        Dim xlbl_ArrowLeft As B4XView = AS_DatePicker1.HeaderPanel.GetView(1)
        'Right Arrow Label
        Dim xlbl_ArrowRight As B4XView = AS_DatePicker1.HeaderPanel.GetView(2)
        </code>
      • HeaderProperties As ASDatePicker_HeaderProperties
      • MaxDate As Long
        Will restrict date navigations features of forward, and also cannot swipe the control using touch gesture beyond the max date range
      • MinDate As Long
        Will restrict date navigations features of backward, also cannot swipe the control using touch gesture beyond the min date range
      • MonthNameShort As ASDatePicker_MonthNameShort
        Call Refresh if you change something
        <code>AS_DatePicker1.MonthNameShort = AS_DatePicker1.CreateASDatePicker_MonthNameShort("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sept","Oct","Nov","Dec")</code>
      • SelectedDate As Long
      • SelectedDateColor As Int
      • SelectedEndDate As Long
        Only in SelectMode "Range"
      • SelectedStartDate As Long
      • SelectMode As String
      • SelectMode_Day As String [read only]
      • SelectMode_Month As String [read only]
      • SelectMode_Range As String [read only]
      • ShowGridLines As Boolean
      • ShowWeekNumbers As Boolean
        Gets or sets the number of visible weeks
        Call Refresh to commit changes
      • WeekNameShort As ASDatePicker_WeekNameShort
        Call Refresh if you change something
        <code>AS_DatePicker1.CreateASDatePicker_WeekNameShort("Mon","Tue","Wed","Thu","Fri","Sat","Sun")</code>
      • WeekNumberProperties As ASDatePicker_WeekNumberProperties
        Call Refresh if you change something
        Default Values
        Width: <code>20dip</code>
        Color: <code>xui.Color_ARGB(255,32, 33, 37)</code>
        xFont: <code>xui.CreateDefaultFont(15)</code>
        TextColor: <code>xui.Color_White</code>
Changelog
  • 1.00
    • Release
  • 1.01
    • Add Scroll2Date - Scrolls to the date
    • B4J Resize BugFixes
  • 1.02
    • BugFixes
    • Add designer property InactiveDaysVisible - Displays the days that are not in the current month
      • Default: False
    • Add Type ASDatePicker_BodyProperties
      • Font of the Text
      • TextColor of the Text
    • The month view now has 6 lines instead of 5
      • It may be that if InactiveDaysVisible = False that an empty line is seen
  • 1.03
    • B4J Only - Add Designer Property MouseHoverFeedback
      • Default: True
  • 1.04
    • Add Refresh
  • 1.05
    • Added a border to the current month, year, or century in the quick navigation
  • 1.06
    • Add get and set SelectedDate
    • Add Event CustomDrawDay
    • Add Type ASDatePicker_CustomDrawDay
  • 1.07
    • BugFix
  • 1.08
    • Add get and set BodyProperties
    • Add get and set HeaderProperties
    • Function "Refresh" is now even better
      • No visual flickering
      • Changes are instant
  • 1.09 (read more)
    • Add get and set MaxDate - Will restrict date navigations features of forward, and also cannot swipe the control using touch gesture beyond the max date range
    • Add get and set MinDate - Will restrict date navigations features of backward, and also cannot swipe the control using touch gesture beyond the max date range
    • Add Rebuild - Clears the DatePicker and builds the DatePicker new
  • 1.10 (read more)
    • Add Designer property SelectMode -
      • Default: Date
  • 1.11
    • BugFixes
  • 1.12
    • Add RefreshHeader - Applies the header properties if any have been changed
    • New ASDatePicker_HeaderProperties properties
  • 1.13 (read more)
    • Add ShowWeekNumbers - Shows the week number for each week
    • Add Type ASDatePicker_WeekNumberProperties
  • 1.14 (read more)
    • Add Designer Property ShowGridLines
    • Add Designer Property GridLineColor
  • 1.15
    • Add get and set MonthNameShort
    • Add get and set WeekNameShort
  • 1.16
    • BugFixes
  • 1.17 (read more)
    • Add "Range" to SelectMode
    • Add Event SelectedDateRangeChanged
    • Debug Mode optimizations
    • Add get SelectedStartDate and SelectedEndDate
  • 1.18
  • 1.19
    • BugFixes
    • Add get and set WeekNameProperties
  • 1.20
    • BugFixes
  • 1.21
    • BugFixes
    • Add ArrowsVisible to Type HeaderProperties
  • 1.22
    • Big performance improvements
      • The view should now load much faster
  • 1.23
    • Add Event PageChanged
  • 1.24
    • Add get CurrentView
    • Add Event CustomDrawHeader
    • BugFixes
  • 1.25
    • Add "Height" to ASDatePicker_WeekNameProperties
      • Default: 20dip
    • Add "CurrentAndSelectedDayHeight" to ASDatePicker_BodyProperties
      • Default: 30dip
    • Add "SelectedTextColor" to ASDatePicker_BodyProperties
      • Default: White
  • 1.26
    • Important crash fix
  • 1.27 (read more)
    • BugFixes and Improvements
    • Add Themes - You can now switch to Light or Dark mode
      • Add set Theme
      • Add get Theme_Dark
      • Add get Theme_Light
    • Add Designer Property ThemeChangeTransition
      • Default: Fade
  • 1.28
    • Add ClearSelections - Deselect the selections
      • Updated the description text of the set Selection properties
Have Fun :)
 

Attachments

  • AS DatePicker Example.zip
    69.4 KB · Views: 1,108
  • AS_DatePicker.b4xlib
    11.7 KB · Views: 127
Last edited:

ykucuk

Well-Known Member
Licensed User
Longtime User
Thank you great library. I have some questions.

1- I changed BodyColor to white. The first 2 months' color is not white but after 2 months body background is white. Please check the screenshot. ( i'm moving one month to another. so the gray bg is April and the white one is May.

2-I changed BodyColor to white. I can't see Day's name. How to change the day's name color. Please check the screenshot.

B4X:
AS_DatePicker1.BodyProperties.TextColor = Main.ColorPrimary
AS_DatePicker1.HeaderProperties.TextColor = Colors.Magenta
AS_DatePicker1.SelectedDateColor= Main.ColorSecondary
 AS_DatePicker1.BodyProperties.xFont=xui.CreateFont2(Font.CreateNew2(Main.FontRegular,16),16)
AS_DatePicker1.HeaderProperties.xFont=xui.CreateFont2(Font.CreateNew2(Main.FontRegular,16),16)
AS_DatePicker1.CurrentDateColor=Colors.ARGB(100,100,100,100)
AS_DatePicker1.HeaderPanel.Color=Main.ColorPrimary
AS_DatePicker1.HeaderColor=Colors.Cyan
AS_DatePicker1.BodyColor=Colors.White
 

Attachments

  • Screenshot 2023-03-21 at 11.45.36 PM.png
    Screenshot 2023-03-21 at 11.45.36 PM.png
    41.9 KB · Views: 320

Alexander Stolte

Expert
Licensed User
Longtime User
Update
  • 1.19
    • BugFixes
    • Add get and set WeekNameProperties
1- I changed BodyColor to white. The first 2 months' color is not white but after 2 months body background is white. Please check the screenshot. ( i'm moving one month to another. so the gray bg is April and the white one is May.
If you change properties that change the appearance, then always call a .Refresh afterwards!
If you change anything in the header, then call .RefreshHeader
I will add this in all property descriptions in the next update, I thought it already is.
2-I changed BodyColor to white. I can't see Day's name. How to change the day's name color. Please check the screenshot.
B4X:
AS_DatePicker.WeekNameProperties.Color = xui.Color_Red
AS_DatePicker.WeekNameProperties.xFont = xui.CreateDefaultBoldFont(25)
AS_DatePicker.Refresh
 

tzfpg

Active Member
Licensed User
Longtime User
I play around the library, ramdomly get error message
error messages:
Error occurred on line: 152 (jPager)
java.lang.IndexOutOfBoundsException: Index 0 out of bounds for length 0
    at java.base/jdk.internal.util.Preconditions.outOfBounds(Preconditions.java:64)
    at java.base/jdk.internal.util.Preconditions.outOfBoundsCheckIndex(Preconditions.java:70)
    at java.base/jdk.internal.util.Preconditions.checkIndex(Preconditions.java:248)
    at java.base/java.util.Objects.checkIndex(Objects.java:373)
    at java.base/java.util.ArrayList.get(ArrayList.java:426)
    at javafx.base/com.sun.javafx.collections.ObservableListWrapper.get(ObservableListWrapper.java:89)
    at javafx.base/com.sun.javafx.collections.VetoableListDecorator.get(VetoableListDecorator.java:306)
    at anywheresoftware.b4j.objects.PaneWrapper.GetNode(PaneWrapper.java:376)
    at anywheresoftware.b4a.objects.B4XViewWrapper.GetView(B4XViewWrapper.java:518)
    at b4j.example.jpager._setindexintern(jpager.java:579)
    at b4j.example.jpager._setindex(jpager.java:369)
    at b4j.example.asviewpager._setcurrentindex2(asviewpager.java:249)
    at b4j.example.as_datepicker$ResumableSub_CreateYearView.resume(as_datepicker.java:1959)
    at anywheresoftware.b4a.shell.DebugResumableSub$DelegatableResumableSub.resumeAsUserSub(DebugResumableSub.java:47)
    at jdk.internal.reflect.GeneratedMethodAccessor5.invoke(Unknown Source)
    at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.base/java.lang.reflect.Method.invoke(Method.java:564)
    at anywheresoftware.b4a.shell.Shell.runMethod(Shell.java:629)
    at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:237)
    at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:167)
    at jdk.internal.reflect.GeneratedMethodAccessor2.invoke(Unknown Source)
    at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.base/java.lang.reflect.Method.invoke(Method.java:564)
    at anywheresoftware.b4a.BA.raiseEvent2(BA.java:111)
    at anywheresoftware.b4a.shell.ShellBA.raiseEvent2(ShellBA.java:100)
    at anywheresoftware.b4a.BA.raiseEvent(BA.java:98)
    at anywheresoftware.b4a.shell.DebugResumableSub$DelegatableResumableSub.resume(DebugResumableSub.java:42)
    at anywheresoftware.b4a.keywords.Common$2$1.run(Common.java:1051)
    at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$10(PlatformImpl.java:428)
    at java.base/java.security.AccessController.doPrivileged(AccessController.java:391)
    at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$11(PlatformImpl.java:427)
    at javafx.graphics/com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:96)
    at javafx.graphics/com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
    at javafx.graphics/com.sun.glass.ui.win.WinApplication.lambda$runLoop$3(WinApplication.java:174)
    at java.base/java.lang.Thread.run(Thread.java:832)
how to fix it? i play with date range, i pick the year 2019 and then pick month to Feb select the day, and i also set min_date to start day, after i want pick the year again show error message.
 

Attachments

  • error.png
    error.png
    6.3 KB · Views: 165
Last edited:

Theera

Well-Known Member
Licensed User
Longtime User
This is a simple DatePicker, with which you can quickly reach your target date. With a click on the header the view changes.

I spend a lot of time in creating views, like this and to create a high quality view cost a lot of time. If you want to support me and further views, then you can do it here by Paypal or with a coffee. :)
  • In the month view, you can select a date
  • In the year view, you select a month
  • In the decade you see a range of 10 years
  • In century you can see 100 years
View attachment 128054View attachment 128055View attachment 128057View attachment 128056

View attachment 128661
SelectMode = Range
View attachment 138202
Make sure you are using ASViewPager V1.31+
ASDatePicker
Author: Alexander Stolte
Version: 1.17

  • ASDatePicker_BodyProperties
    • Fields:
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • TextColor As Int
      • xFont As B4XFont
    • Functions:
      • Initialize
        Initializes the fields to their default value.
  • ASDatePicker_CustomDrawDay
    • Fields:
      • BackgroundPanel As B4XView
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • xlbl_Date As B4XView
    • Functions:
      • Initialize
        Initializes the fields to their default value.
  • ASDatePicker_HeaderProperties
    • Fields:
      • ButtonIconSize As Float
      • Height As Float
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • TextColor As Int
      • xFont As B4XFont
    • Functions:
      • Initialize
        Initializes the fields to their default value.
  • ASDatePicker_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.
  • ASDatePicker_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.
  • ASDatePicker_WeekNumberProperties
    • Fields:
      • Color As Int
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • Text As String
      • TextColor As Int
      • Width As Float
      • xFont As B4XFont
    • Functions:
      • Initialize
        Initializes the fields to their default value.
  • AS_DatePicker
    • Events:
      • CustomDrawDay (Date As Long, Views As ASDatePicker_CustomDrawDay)
      • SelectedDateChanged (Date As Long)
      • SelectedDateRangeChanged (StartDate As Long, EndDate As Long)
    • Fields:
      • mBase As B4XView
      • Tag As Object
    • Functions:
      • ChangeView (NewView As String)
      • Class_Globals As String
      • CreateASDatePicker_BodyProperties (xFont As B4XFont, TextColor As Int) As ASDatePicker_BodyProperties
      • CreateASDatePicker_HeaderProperties (Height As Float, xFont As B4XFont, TextColor As Int, ButtonIconSize As Float) As ASDatePicker_HeaderProperties
      • CreateASDatePicker_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 ASDatePicker_MonthNameShort
        <code>AS_DatePicker1.MonthNameShort = AS_DatePicker1.CreateASDatePicker_MonthNameShort("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sept","Oct","Nov","Dec")</code>
      • CreateASDatePicker_WeekNameShort (Monday As String, Tuesday As String, Wednesday As String, Thursday As String, Friday As String, Saturday As String, Sunday As String) As ASDatePicker_WeekNameShort
        <code>AS_DatePicker1.CreateASDatePicker_WeekNameShort("Mon","Tue","Wed","Thu","Fri","Sat","Sun")</code>
      • CreateASDatePicker_WeekNumberProperties (Width As Float, Color As Int, xFont As B4XFont, TextColor As Int, Text As String) As ASDatePicker_WeekNumberProperties
      • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
        Base type must be Object
      • getBodyColor As Int
      • getBodyProperties As ASDatePicker_BodyProperties
      • getCurrentDateColor As Int
      • getCurrentView_CenturyView As String
      • getCurrentView_DecadeView As String
      • getCurrentView_MonthView As String
      • getCurrentView_YearView As String
      • GetFirstDayOfWeek2 (Ticks As Long, FirstDayOfWeek As Int) As Long
        FirstDayOfWeek:
        Friday = 1
        Thursday = 2
        Wednesday = 3
        Tuesday = 4
        Monday = 5
        Sunday = 6
        Saturday = 7
      • getGridLineColor As Int
      • getHeaderColor As Int
      • getHeaderPanel As B4XView
        You can customize the appereance of the header
        With the following code you can customize the control elements that are visible in the header:
        <code>
        'Middle Text Label
        Dim xlbl_Header As B4XView = AS_DatePicker1.HeaderPanel.GetView(0)
        'Left Arrow Label
        Dim xlbl_ArrowLeft As B4XView = AS_DatePicker1.HeaderPanel.GetView(1)
        'Right Arrow Label
        Dim xlbl_ArrowRight As B4XView = AS_DatePicker1.HeaderPanel.GetView(2)
        </code>
      • getHeaderProperties As ASDatePicker_HeaderProperties
      • getMaxDate As Long
      • getMinDate As Long
      • getMonthNameShort As ASDatePicker_MonthNameShort
        Call Refresh if you change something
        <code>AS_DatePicker1.MonthNameShort = AS_DatePicker1.CreateASDatePicker_MonthNameShort("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sept","Oct","Nov","Dec")</code>
      • getSelectedDate As Long
      • getSelectedDateColor As Int
      • getSelectedEndDate As Long
        Only in SelectMode "Range"
      • getSelectedStartDate As Long
      • getSelectMode As String
      • getSelectMode_Day As String
      • getSelectMode_Month As String
      • getSelectMode_Range As String
      • getShowGridLines As Boolean
      • getShowWeekNumbers As Boolean
        Gets or sets the number of visible weeks
        Call Refresh to commit changes
      • GetWeekNameByIndex (Index As Int) As String
        1 = Sunday
      • getWeekNameShort As ASDatePicker_WeekNameShort
      • getWeekNumberProperties As ASDatePicker_WeekNumberProperties
        Call Refresh if you change something
        Default Values
        Width: <code>20dip</code>
        Color: <code>xui.Color_ARGB(255,32, 33, 37)</code>
        xFont: <code>xui.CreateDefaultFont(15)</code>
        TextColor: <code>xui.Color_White</code>
      • Initialize (Callback As Object, EventName As String) As String
      • IsInitialized As Boolean
        Tests whether the object has been initialized.
      • Rebuild
        Clears the DatePicker and builds the DatePicker new
      • Refresh As String
      • RefreshHeader As String
        Applies the header properties if any have been changed
      • RefreshSelectedDate As String
      • Scroll2Date (Date As Long) As String
        Scrolls to the date
        Builds the view new if the date was not in range
      • setBodyColor (Color As Int) As String
      • setBodyProperties (BodyProperties As ASDatePicker_BodyProperties) As String
      • setCurrentDateColor (Color As Int) As String
      • setFirstDayOfWeek (number As Int) As String
        1-7
        Friday = 1
        Thursday = 2
        Wednesday = 3
        Tuesday = 4
        Monday = 5
        Sunday = 6
        Saturday = 7
      • setGridLineColor (Color As Int) As String
      • setHeaderColor (Color As Int) As String
      • setHeaderProperties (HeaderProperties As ASDatePicker_HeaderProperties) As String
      • setMaxDate (MaxDate As Long) As String
        Will restrict date navigations features of forward, and also cannot swipe the control using touch gesture beyond the max date range
      • setMinDate (MinDate As Long) As String
        Will restrict date navigations features of backward, also cannot swipe the control using touch gesture beyond the min date range
      • setMonthNameShort (MonthNameShort As ASDatePicker_MonthNameShort) As String
      • setSelectedDate (Date As Long) As String
      • setSelectedDateColor (Color As Int) As String
      • setSelectedEndDate (Date As Long) As String
      • setSelectedStartDate (Date As Long) As String
      • setSelectMode (Mode As String) As String
      • setShowGridLines (Show As Boolean) As String
      • setShowWeekNumbers (Show As Boolean) As String
      • setWeekNameShort (WeekNameShort As ASDatePicker_WeekNameShort) As String
        Call Refresh if you change something
        <code>AS_DatePicker1.CreateASDatePicker_WeekNameShort("Mon","Tue","Wed","Thu","Fri","Sat","Sun")</code>
      • setWeekNumberProperties (WeekNumberProperties As ASDatePicker_WeekNumberProperties) As String
    • Properties:
      • BodyColor As Int
      • BodyProperties As ASDatePicker_BodyProperties
      • CurrentDateColor As Int
      • CurrentView_CenturyView As String [read only]
      • CurrentView_DecadeView As String [read only]
      • CurrentView_MonthView As String [read only]
      • CurrentView_YearView As String [read only]
      • FirstDayOfWeek
        1-7
        Friday = 1
        Thursday = 2
        Wednesday = 3
        Tuesday = 4
        Monday = 5
        Sunday = 6
        Saturday = 7
      • GridLineColor As Int
      • HeaderColor As Int
      • HeaderPanel As B4XView [read only]
        You can customize the appereance of the header
        With the following code you can customize the control elements that are visible in the header:
        <code>
        'Middle Text Label
        Dim xlbl_Header As B4XView = AS_DatePicker1.HeaderPanel.GetView(0)
        'Left Arrow Label
        Dim xlbl_ArrowLeft As B4XView = AS_DatePicker1.HeaderPanel.GetView(1)
        'Right Arrow Label
        Dim xlbl_ArrowRight As B4XView = AS_DatePicker1.HeaderPanel.GetView(2)
        </code>
      • HeaderProperties As ASDatePicker_HeaderProperties
      • MaxDate As Long
        Will restrict date navigations features of forward, and also cannot swipe the control using touch gesture beyond the max date range
      • MinDate As Long
        Will restrict date navigations features of backward, also cannot swipe the control using touch gesture beyond the min date range
      • MonthNameShort As ASDatePicker_MonthNameShort
        Call Refresh if you change something
        <code>AS_DatePicker1.MonthNameShort = AS_DatePicker1.CreateASDatePicker_MonthNameShort("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sept","Oct","Nov","Dec")</code>
      • SelectedDate As Long
      • SelectedDateColor As Int
      • SelectedEndDate As Long
        Only in SelectMode "Range"
      • SelectedStartDate As Long
      • SelectMode As String
      • SelectMode_Day As String [read only]
      • SelectMode_Month As String [read only]
      • SelectMode_Range As String [read only]
      • ShowGridLines As Boolean
      • ShowWeekNumbers As Boolean
        Gets or sets the number of visible weeks
        Call Refresh to commit changes
      • WeekNameShort As ASDatePicker_WeekNameShort
        Call Refresh if you change something
        <code>AS_DatePicker1.CreateASDatePicker_WeekNameShort("Mon","Tue","Wed","Thu","Fri","Sat","Sun")</code>
      • WeekNumberProperties As ASDatePicker_WeekNumberProperties
        Call Refresh if you change something
        Default Values
        Width: <code>20dip</code>
        Color: <code>xui.Color_ARGB(255,32, 33, 37)</code>
        xFont: <code>xui.CreateDefaultFont(15)</code>
        TextColor: <code>xui.Color_White</code>
Changelog
  • 1.00
    • Release
  • 1.01
    • Add Scroll2Date - Scrolls to the date
    • B4J Resize BugFixes
  • 1.02
    • BugFixes
    • Add designer property InactiveDaysVisible - Displays the days that are not in the current month
      • Default: False
    • Add Type ASDatePicker_BodyProperties
      • Font of the Text
      • TextColor of the Text
    • The month view now has 6 lines instead of 5
      • It may be that if InactiveDaysVisible = False that an empty line is seen
  • 1.03
    • B4J Only - Add Designer Property MouseHoverFeedback
      • Default: True
  • 1.04
    • Add Refresh
  • 1.05
    • Added a border to the current month, year, or century in the quick navigation
  • 1.06
    • Add get and set SelectedDate
    • Add Event CustomDrawDay
    • Add Type ASDatePicker_CustomDrawDay
  • 1.07
    • BugFix
  • 1.08
    • Add get and set BodyProperties
    • Add get and set HeaderProperties
    • Function "Refresh" is now even better
      • No visual flickering
      • Changes are instant
  • 1.09 (read more)
    • Add get and set MaxDate - Will restrict date navigations features of forward, and also cannot swipe the control using touch gesture beyond the max date range
    • Add get and set MinDate - Will restrict date navigations features of backward, and also cannot swipe the control using touch gesture beyond the max date range
    • Add Rebuild - Clears the DatePicker and builds the DatePicker new
  • 1.10 (read more)
    • Add Designer property SelectMode -
      • Default: Date
  • 1.11
    • BugFixes
  • 1.12
    • Add RefreshHeader - Applies the header properties if any have been changed
    • New ASDatePicker_HeaderProperties properties
  • 1.13 (read more)
    • Add ShowWeekNumbers - Shows the week number for each week
    • Add Type ASDatePicker_WeekNumberProperties
  • 1.14 (read more)
    • Add Designer Property ShowGridLines
    • Add Designer Property GridLineColor
  • 1.15
    • Add get and set MonthNameShort
    • Add get and set WeekNameShort
  • 1.16
    • BugFixes
  • 1.17 (read more)
    • Add "Range" to SelectMode
    • Add Event SelectedDateRangeChanged
    • Debug Mode optimizations(
    • Add get SelectedStartDate and SelectedEndDate
  • 1.18
  • 1.19
    • BugFixes
    • Add get and set WeekNameProperties
  • 1.20
    • BugFixes
  • 1.21
    • BugFixes
    • Add ArrowsVisible to Type HeaderProperties
Have Fun :)
I'm not Christain,Please give property of year which can changed C.E. Year to B.E. Year. (2023->2566). Thank you in advance. I'm looking for cross platform library.
 

Alexander Stolte

Expert
Licensed User
Longtime User
If possible...
Unfortunately this is not possible, I use the "DateUtils.GetMonthName" function to determine this name.
You can change this directly by calling up the label. But a PageChanged event is still missing in this lib. This is coming soon, I have already received a request in another view.
B4X:
Dim xlbl_Header As B4XView = AS_DatePicker1.HeaderPanel.GetView(0)
 

Alexander Stolte

Expert
Licensed User
Longtime User
Update
  • 1.24
    • Add get CurrentView
    • Add Event CustomDrawHeader
    • BugFixes
CustomDrawHeader
B4X:
Private Sub AS_DatePicker1_CustomDrawHeader(Date As Long,Views As ASDatePicker_CustomDrawHeader)
    If AS_DatePicker1.CurrentView = AS_DatePicker1.CurrentView_MonthView Then
        Views.xlbl_Text.Text = "Test " & DateUtils.GetMonthName(Date)
    End If
End Sub
 
Last edited:

Alexander Stolte

Expert
Licensed User
Longtime User
Update
  • 1.25
    • Add "Height" to ASDatePicker_WeekNameProperties
      • Default: 20dip
    • Add "CurrentAndSelectedDayHeight" to ASDatePicker_BodyProperties
      • Default: 30dip
    • Add "SelectedTextColor" to ASDatePicker_BodyProperties
      • Default: White
 

Aldo's

Active Member
Licensed User
Hi,
I have two problem.
I wrote this code:
B4X:
    DateTime.DateFormat="dd/MM/yyyy"
    dpData.MinDate=DateTime.DateParse("01/12/2019")
    dpData.MaxDate=DateTime.DateParse("03/12/2051")
    dpData.FirstDayOfWeek=6
    dpData.CreateASDatePicker_WeekNameShort("LU","MA","ME","GI","VE","SA","DO")
    dpData.Refresh
but it keeps the short names of the days in English and starts the week on Monday instead of Sunday.
Can you tell me where I'm wrong?
 
Top