Start with this tutorial if you are not familiar with custom views: [B4X] Custom Views with Enhanced Designer Support
With the help of XUI it is quite simple to create custom views classes that will work with B4A, B4i and B4J.
The first step is to use a slightly modified template:
Example of a clock view:
Code:
I think that the only thing interesting here is the xui.PaintOrColorToColor method.
In B4A and B4i colors are represented as Ints (0xAARRGGBB).
In B4J colors are natively represented as Paint objects.
In the XUI library colors are represented as Ints.
The default color constants are available in the XUI type:
Back to PaintOrColorToColor, the Props map in B4J will hold Paint objects for color values. xui.PaintOrColorToColor checks the object type and converts it, if needed, to an Int representing the same color. In B4A and B4i these methods do not do anything.
Note that Base_Resize will only be called in B4J and B4i.
A more advanced example: [B4X] [XUI] [custom view] CircularProgressBar
With the help of XUI it is quite simple to create custom views classes that will work with B4A, B4i and B4J.
The first step is to use a slightly modified template:
B4X:
#DesignerProperty: Key: BooleanExample, DisplayName: Show Seconds, FieldType: Boolean, DefaultValue: True
#DesignerProperty: Key: TextColor, DisplayName: Text Color, FieldType: Color, DefaultValue: 0xFFFFFFFF, Description: Text color
Sub Class_Globals
Private mEventName As String 'ignore
Private mCallBack As Object 'ignore
Private mBase As B4XView
Private xui as XUI
End Sub
Public Sub Initialize (Callback As Object, EventName As String)
mEventName = EventName
mCallBack = Callback
End Sub
'Base type must be Object
Public Sub DesignerCreateView (Base As Object, Lbl As Label, Props As Map)
mBase = Base
End Sub
Private Sub Base_Resize (Width As Double, Height As Double)
End SubExample of a clock view:
Code:
B4X:
#DesignerProperty: Key: ShowSeconds, DisplayName: Show Seconds, FieldType: Boolean, DefaultValue: True
#DesignerProperty: Key: TextColor, DisplayName: Text Color, FieldType: Color, DefaultValue: 0xFFA2A2A2, Description: Text color
Sub Class_Globals
Private mEventName As String 'ignore
Private mCallBack As Object 'ignore
Private mBase As B4XView
Private mLbl As B4XView
Private xui As XUI
Private Timer1 As Timer
Private showSeconds As Boolean
End Sub
Public Sub Initialize (Callback As Object, EventName As String)
mEventName = EventName
mCallBack = Callback
Timer1.Initialize("Timer1", 1000)
End Sub
'Base type must be Object
Public Sub DesignerCreateView (Base As Object, Lbl As Label, Props As Map)
mBase = Base
mLbl = Lbl
mBase.AddView(mLbl, 0, 0, mBase.Width, mBase.Height)
mLbl.SetTextAlignment("CENTER", "CENTER")
mLbl.TextColor = xui.PaintOrColorToColor(Props.Get("TextColor"))
showSeconds = Props.Get("ShowSeconds")
Timer1.Enabled = True
Timer1_Tick
End Sub
Private Sub Base_Resize (Width As Double, Height As Double)
mLbl.SetLayoutAnimated(0, 0, 0, Width, Height)
End Sub
Sub Timer1_Tick
Dim t As Long = DateTime.Now
mLbl.Text = $"$2.0{DateTime.GetHour(t)}:$2.0{DateTime.GetMinute(t)}"$
If showSeconds Then
mLbl.Text = mLbl.Text & $":$2.0{DateTime.GetSecond(t)}"$
End If
End SubI think that the only thing interesting here is the xui.PaintOrColorToColor method.
In B4A and B4i colors are represented as Ints (0xAARRGGBB).
In B4J colors are natively represented as Paint objects.
In the XUI library colors are represented as Ints.
The default color constants are available in the XUI type:
B4X:
Button1.Color = xui.Color_RedBack to PaintOrColorToColor, the Props map in B4J will hold Paint objects for color values. xui.PaintOrColorToColor checks the object type and converts it, if needed, to an Int representing the same color. In B4A and B4i these methods do not do anything.
Note that Base_Resize will only be called in B4J and B4i.
A more advanced example: [B4X] [XUI] [custom view] CircularProgressBar
