B4A Library [B4X] [XUI] AS Timeline

Alexander Stolte · Jul 24, 2023

This view is a simple horizontal timeline view.

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.

AS_Timeline
Author: Alexander Stolte
Version: 1.00

AS_Timeline
- Events:
  - SelectionChanged (Item As AS_Timeline_Item)
- Fields:
  - g_ItemProperties As AS_Timeline_ItemProperties
  - lst_Items As List
  - mBase As B4XView
  - Tag As Object
- Functions:
  - AddItem (DataYear As String, DataInfo As String, Value As Object) As String
    Add a item
    DataYear - Year Text e.g. 1960
    DataInfo - Description Text
    Value - whatever you want
  - AddItemAdvanced (Item As AS_Timeline_Item) As String
  - AddItemDuration (DataYear As String, DataInfo As String, Value As Object, AutoPlayDuration As Int) As String
    Add a item with a custom duration for this item, if you are using auto play
    DataYear - Year Text e.g. 1960
    DataInfo - Description Text
    Value - whatever you want
    AutoPlayDuration - Duration in milliseconds
  - Class_Globals As String
  - CreateAS_Timeline_ItemProperties (UnReachedColor As Int, ReachedColor As Int, UnReachedFont As B4XFont, ReachedFont As B4XFont) As AS_Timeline_ItemProperties
  - CreateTimeline As String
    Call this if you change something or if you want to show it
  - DesignerCreateView (Base As Object, Lbl As Label, Props As Map)
    Base type must be Object
  - Initialize (Callback As Object, EventName As String) As String
  - IsInitialized As Boolean
    Tests whether the object has been initialized.
  - PauseAutoPlay As String
    Paused AutoPlay
  - StartAutoPlay As String
    Starts the AutoPlay
  - StopAutoPlay As String
    Stops the AutoPlay
AS_Timeline_Item
- Fields:
  - DataInfo As String
  - DataYear As String
  - Duration As Int
  - IsInitialized As Boolean
    Tests whether the object has been initialized.
  - ItemProperties As AS_Timeline_ItemProperties
  - Value As Object
- Functions:
  - Initialize
    Initializes the fields to their default value.
AS_Timeline_ItemProperties
- Fields:
  - IsInitialized As Boolean
    Tests whether the object has been initialized.
  - ReachedColor As Int
  - ReachedFont As B4XFont
  - UnReachedColor As Int
  - UnReachedFont As B4XFont
- Functions:
  - Initialize
    Initializes the fields to their default value.

Changelog

1.00
- Release
1.01
- Add Event CustomDrawItem
- Add get and set Index

Have Fun

Sergio Haurat · Jul 25, 2023

My God, every time I see you post I think... what will you surprise me with this time?

zed · Jul 25, 2023

Hi Alexander,
Can you check the version of the project.
While trying, I noticed that it's the same as the first version without the timer.
This version does not work with the library.

B4X TimeLine:

Sub Class_Globals
    Private Root As B4XView
    Private xui As XUI
    Private AS_Timeline1 As AS_Timeline
    Private xlbl_SelectedValue As B4XView
    Private xlbl_Title As B4XView
End Sub

Public Sub Initialize
    
End Sub

'This event will be called once, before the page becomes visible.
Private Sub B4XPage_Created (Root1 As B4XView)
    Root = Root1
    Root.LoadLayout("frm_main")
    
    B4XPages.SetTitle(Me,"AS Timeline Example")
    
    xlbl_Title.Text = "Notable inventions, 1910–2000"
    
    AS_Timeline1.AddItem("1910","headset","And future Call of Duty players would thank them.")
    AS_Timeline1.AddItem("1920","jungle gym","Because every kid should get to be Tarzan for a day.")
    AS_Timeline1.AddItem("1930","chocolate chip cookie","And the world rejoiced.")
    AS_Timeline1.AddItem("1940","Jeep","Because building roads is inconvenient.")
    AS_Timeline1.AddItem("1950","leaf blower","Ain’t nobody got time to rake.")
    AS_Timeline1.AddItem("1960","magnetic stripe card","Because paper currency is for noobs.")
    AS_Timeline1.AddItem("1970","wireless LAN","Nobody likes cords. Nobody.")
    AS_Timeline1.AddItem("1980","flash memory","Brighter than glow memory.")
    AS_Timeline1.AddItem("1990","World Wide Web","To capitalize on an as-yet nascent market for cat photos.")
    AS_Timeline1.AddItem("2000","Google AdWords","Because organic search rankings take work.")
    
    AS_Timeline1.CreateTimeline
    
End Sub

Private Sub AS_Timeline1_SelectionChanged(Item As AS_Timeline_Item)
    xlbl_SelectedValue.Text = Item.Value
End Sub

Here are the logs

Logger connecté à : Xiaomi M2101K7AG
--------- beginning of main
Copying updated assets files (1)
*** Service (starter) Create ***
** Service (starter) Start **
** Activity (main) Create (first time) **
Error occurred on line: 74 (AS_Timeline)
java.lang.RuntimeException: Cannot parse: null as boolean
at anywheresoftware.b4a.BA.parseBoolean(BA.java:640)
at anywheresoftware.b4a.BA.ObjectToBoolean(BA.java:710)
at com.stoltex.timeline.as_timeline._iniprops(as_timeline.java:560)
at com.stoltex.timeline.as_timeline$ResumableSub_DesignerCreateView.resume(as_timeline.java:472)
at com.stoltex.timeline.as_timeline._designercreateview(as_timeline.java:431)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.shell.Shell.runMethod(Shell.java:732)
at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:351)
at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:255)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:157)
at anywheresoftware.b4a.objects.CustomViewWrapper.AfterDesignerScript(CustomViewWrapper.java:61)
at anywheresoftware.b4a.keywords.LayoutBuilder.loadLayout(LayoutBuilder.java:147)
at anywheresoftware.b4a.objects.PanelWrapper.LoadLayout(PanelWrapper.java:134)
at anywheresoftware.b4a.objects.B4XViewWrapper.LoadLayout(B4XViewWrapper.java:329)
at com.stoltex.timeline.b4xmainpage._b4xpage_created(b4xmainpage.java:69)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.debug.Debug.CallSub4(Debug.java:318)
at anywheresoftware.b4a.debug.Debug.CallSubNew2(Debug.java:285)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.keywords.Common.CallSubDebug2(Common.java:1087)
at com.stoltex.timeline.b4xpagesmanager._createpageifneeded(b4xpagesmanager.java:1068)
at com.stoltex.timeline.b4xpagesmanager._showpage(b4xpagesmanager.java:425)
at com.stoltex.timeline.b4xpagesmanager._addpage(b4xpagesmanager.java:245)
at com.stoltex.timeline.b4xpagesmanager._addpageandcreate(b4xpagesmanager.java:259)
at com.stoltex.timeline.b4xpagesmanager._initialize(b4xpagesmanager.java:165)
at com.stoltex.timeline.main._activity_create(main.java:415)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.shell.Shell.runMethod(Shell.java:732)
at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:351)
at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:255)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:157)
at com.stoltex.timeline.main.afterFirstLayout(main.java:105)
at com.stoltex.timeline.main.access$000(main.java:17)
at com.stoltex.timeline.main$WaitForLayout.run(main.java:83)
at android.os.Handler.handleCallback(Handler.java:938)
at android.os.Handler.dispatchMessage(Handler.java:99)
at android.os.Looper.loopOnce(Looper.java:210)
at android.os.Looper.loop(Looper.java:299)
at android.app.ActivityThread.main(ActivityThread.java:8302)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:556)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1037)
** Activity (main) Resume **

Alexander Stolte · Jul 25, 2023

zed said:
Error occurred on line: 74 (AS_Timeline)
java.lang.RuntimeException: Cannot parse: null as boolean

Sorry, my mistake. I had added new designer properties without opening the designer again to save once. Just open the designer and save directly, then it should work. If you want to have the AutoPlay on directly at the start, then simply activate the AutoPlay in the designer. Otherwise you can simply do that with:

B4X:

AS_Timeline1.StartAutoPlay

zed · Jul 25, 2023

It works very well.
Very nice job.
Respect.

klaus · Jul 25, 2023

Alexander Stolte said:
Sorry, my mistake. I had added new designer properties without opening the designer again to save once.

You can avoid this by using:

B4X:

MyProperty = Props.GetDefault("MyProperty", DefaultValue)

Instead of:

B4X:

MyProperty = Props.Get("MyProperty")

Alexander Stolte · Jul 25, 2023

klaus said:
You can avoid this by using:

Thanks, but every update I do this. But since that was the 1st official release, I forgot about it.

Daica · Jul 25, 2023

These sort of libraries are a great addition to the community!

asales · Jan 23, 2024

I'm testing this (another great) library.

If I have many dates, I get this screen:

Can I made the dates scrolls, like the ASDatePickerTimeline?
And change the color of the individual circle?

Thanks again for your support.

Alexander Stolte · Jan 23, 2024

Update

1.01
- Add Event CustomDrawItem
- Add get and set Index

asales said:
Can I made the dates scrolls, like the ASDatePickerTimeline?

No, but you cann add this view on a horizontal xcustomlistview and then you have a scrolling feature. But you need to calculate the right widt by yourself.

asales said:
And change the color of the individual circle?

Yes, with the new CustomDrawItem Event
Example:

B4X:

Private Sub AS_Timeline1_CustomDrawItem(Item As AS_Timeline_Item,Views As AS_Timeline_CustomDrawItemViews)
    If Item.Index > AS_Timeline1.Index Then
        Views.xpnl_Round.Color = xui.Color_Green
    Else
        Views.xpnl_Round.Color = AS_Timeline1.g_ItemProperties.ReachedColor
    End If
End Sub

asales · Jan 23, 2024

Alexander Stolte said:
No, but you cann add this view on a horizontal xcustomlistview and then you have a scrolling feature. But you need to calculate the right widt by yourself.

Thanks again.
I'm starting to testing in this way and works fine.

Another issue:
if I check the AutoPlay in the designer I get this error below.
If I call the function StartAutoPlay (without check the option in the designer) works fine.

B4X:

java.lang.RuntimeException: java.lang.IndexOutOfBoundsException: Index 0 out of bounds for length 0

Alexander Stolte · Jan 23, 2024

asales said:
Another issue:
if I check the AutoPlay in the designer I get this error below.
If I call the function StartAutoPlay (without check the option in the designer) works fine.

I can't recreate it, please provide an example project.

asales · Jan 24, 2024

Alexander Stolte said:
I can't recreate it, please provide an example project.

I'm doing more tests here.
I saw the problem is because I load the layout - with the AS Timeline - in a customlistview.

B4A Library [B4X] [XUI] AS Timeline

Attachments

Sergio Haurat

Active Member

zed

Active Member

Attachments

Alexander Stolte

Expert

zed

Active Member

klaus

Expert

Alexander Stolte

Expert

Daica

Active Member

asales

Expert

Alexander Stolte

Expert

asales

Expert

Alexander Stolte

Expert

asales

Expert

Similar Threads

B4A Library [B4X] [XUI] AS Timeline

Attachments

Active Member

Active Member

Attachments

Expert

Active Member

Expert

Expert

Active Member

Expert

Expert

Expert

Expert

Expert

Similar Threads

Privacy & Transparency

Privacy & Transparency