B4J Library [B4X] [XUI] SD XUIView

I'm happy to announce the publication of my new B4XView library.
This library adds to the XUi Views the native views of the three platforms (Android / IOS / Desktop) so that they can be managed by Design, using them as XUI views without having to change its type in the Globals Sub.
With this Library the views have the same properties and identical events, and you can also access the original view and more properties, method and animation not included natively.
This will allow you to reuse the code written for a platform on the others without any changes.
Also I'm adding custom views and animations not included natively.

Included this view

​

​

Other views not included in this list (such as XCustomListView or XComboBox, B4XComboBox, LoadingIndicator, CicularProgressBar, RadarProgressView, GaugeView, RulerPicker, RoundSlider, CaptchaView, etc.. ) will not be included in the future because they already exist. Many sources have been made available just search the forum.​

​

NOTICE. Unfortunately in the IOS version it occupies more than 500Kb, so I compressed with RAR and then with ZIP. to decompress it, you must use WinRar

SD_XUIView

Author: Star-Dust
Version: 0.16

• B4XButton
  • Events:
    • DoubleOrLongClick
    • OneClick
    • Touch (Action As Int, Coordinate() As Tp_Coordinate)
  • Fields:
    • Action_Click As Int
    • Action_DoubleClick As Int
    • Action_Down As Int
    • Action_Drag As Int
    • Action_LongClick As Int
    • Action_LoseTouch As Int
    • Action_Up As Int
    • MinMoveAccept As Int
    • Tag As Object
  • Functions:
    • AddToParent (PanelToAdd As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • B4XObject As B4XView
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • GetAllViewsRecursive As List
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • NativeObject As Button
    • RemoveAllViews As String
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • Snapshot As B4XView
  • Properties:
    • Color As Int
    • Enable As Boolean
    • Font
    • Height As Int
    • Left As Int
    • Top As Int
    • Visible As Boolean
    • Width As Int
• B4XCalendarPicker
  • Events:
    • Click
  • Fields:
    • Color As Int
    • Square As Boolean
    • Tag As Object
    • TextColor As Int
    • TextSize As Int
    • Title As String
  • Functions:
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • GetAllViewsRecursive As List
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (CallBack As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • Snapshot As B4XView
  • Properties:
    • Date As Long
    • Enable As Boolean
    • Height As Int
    • Left As Int
    • Top As Int
    • Visible As Boolean
    • Width As Int
• B4XCheckBox
  • Events:
    • Click
  • Fields:
    • Action_Click As Int
    • Action_DoubleClick As Int
    • Action_Down As Int
    • Action_Drag As Int
    • Action_LongClick As Int
    • Action_LoseTouch As Int
    • Action_Up As Int
    • MinMoveAccept As Int
  • Functions:
    • AddToParent (PanelToAdd As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • GetAllViewsRecursive As List
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • RemoveAllViews As String
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • Snapshot As B4XView
  • Properties:
    • Check As Boolean
    • Color As Int
    • Enable As Boolean
    • Font
    • Height As Int
    • Left As Int
    • Top As Int
    • Visible As Boolean
    • Width As Int
• B4XEditText
  • Events:
    • DoubleOrLongClick
    • EnterPressed
    • FocusChanged
    • OneClick
    • TextChanged (Old As String, New As String)
  • Fields:
    • Action_Click As Int
    • Action_DoubleClick As Int
    • Action_Down As Int
    • Action_Drag As Int
    • Action_LongClick As Int
    • Action_LoseTouch As Int
    • Action_Up As Int
    • Tag As Object
  • Functions:
    • AddToParent (PanelToAdd As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • B4XObject As B4XView
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • GetAllViewsRecursive As List
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • NativeObjct As EditText
    • RemoveAllViews As String
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • setSelection (StartIndex As Int, EndIndex As Int) As String
    • Snapshot As B4XView
  • Properties:
    • Color As Int
    • CursorVisible
    • Ellipsize As String
    • Enable As Boolean
    • Font
    • ForceDoneButton
    • Height As Int
    • Left As Int
    • SelectionEnd As Int [read only]
    • SelectionStart As Int [read only]
    • TextIsEditable
    • TextIsSelectable
    • Top As Int
    • Typeface
    • Visible As Boolean
    • Width As Int
• B4XLabel
  • Events:
    • DoubleOrLongClick
    • OneClick
    • Touch (Action As Int, Coordinate() As Tp_Coordinate)
  • Fields:
    • Action_Click As Int
    • Action_DoubleClick As Int
    • Action_Down As Int
    • Action_Drag As Int
    • Action_LongClick As Int
    • Action_LoseTouch As Int
    • Action_Up As Int
    • MinMoveAccept As Int
    • Tag As Object
  • Functions:
    • AddToParent (PanelToAdd As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • B4XObject As B4XView
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • GetAllViewsRecursive As List
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • NativeObject As Label
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • Snapshot As B4XView
  • Properties:
    • Color As Int
    • Enable As Boolean
    • Font
    • Height As Int
    • Left As Int
    • TextAppear
    • TextFind
    • TextRoll
    • TextScroll
    • Top As Int
    • Visible As Boolean
    • Width As Int
• B4XPanel
  • Events:
    • DoubleOrLongClick
    • Moved
    • OneClick
    • Resized
    • Touch (Action As Int, Coordinate() As Tp_Coordinate)
  • Fields:
    • Action_Click As Int
    • Action_DoubleClick As Int
    • Action_Down As Int
    • Action_Drag As Int
    • Action_LongClick As Int
    • Action_LoseTouch As Int
    • Action_Up As Int
    • AllSurfaceMove As Boolean
    • MinMoveAccept As Int
    • Movible As Boolean
    • Resizable As Boolean
    • Tag As Object
  • Functions:
    • AddToParent (PanelToAdd As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • AddView (View As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • B4XObject As B4XView
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • EmbedView (View As B4XView) As String
    • GetAllViewsRecursive As List
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • NativeObject As Panel
    • RemoveAllViews As String
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • Snapshot As B4XView
  • Properties:
    • Enable As Boolean
    • Height As Int
    • Left As Int
    • Top As Int
    • Visible As Boolean
    • Width As Int
• B4XProgressBar
  • Fields:
    • Tag As Object
  • Functions:
    • AddToParent (PanelToAdd As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • Snapshot As B4XView
  • Properties:
    • BackgroundColor
    • BarColor
    • Enable As Boolean
    • Height As Int
    • Left As Int
    • Top As Int
    • Value As Float
    • Visible As Boolean
    • Width As Int
• B4XSeek_Bar
  • Events:
    • ChangeValue (Value As Float)
  • Fields:
    • Tag As Object
  • Functions:
    • AddToParent (PanelToAdd As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • Snapshot As B4XView
  • Properties:
    • Enable As Boolean
    • Height As Int
    • Left As Int
    • Top As Int
    • Value As Float
    • Visible As Boolean
    • Width As Int
• Tp_Coordinate
  • Fields:
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • x As Int
    • y As Int
  • Functions:
    • Initialize
      Inizializza i campi al loro valore predefinito.
• xRadioButton
  • Events:
    • Click
  • Fields:
    • Action_Click As Int
    • Action_DoubleClick As Int
    • Action_Down As Int
    • Action_Drag As Int
    • Action_LongClick As Int
    • Action_LoseTouch As Int
    • Action_Up As Int
    • MinMoveAccept As Int
    • Tag As Object
  • Functions:
    • AddToParent (PanelToAdd As B4XView, Left As Int, Top As Int, Width As Int, Height As Int) As String
    • BringToFront As String
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • GetAllViewsRecursive As List
    • GetBase As Panel
    • GetView (Index As Int) As B4XView
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
    • RemoveAllViews As String
    • RemoveViewFromParent As String
    • RequestFocus As String
    • ReSetEvent (Callback As Object, EventName As String) As String
    • Rotate (AngleX As Float, AngleY As Float, AngleZ As Float) As String
    • SendToBack As String
    • Snapshot As B4XView
  • Properties:
    • Check As Boolean
    • Color As Int
    • Enable As Boolean
    • Font
    • Height As Int
    • Left As Int
    • Top As Int
    • Visible As Boolean
    • Width As Int

_________________________________________________________________________

For ios download here

 

[Star-Dust]

With this library you can add the B4X XUi Views directly from Design.
It also adds new functions and methods that are not present basic to native views

Now the Trimmer class is in the XUIView2library

 

[Erel]

To avoid confusion to developers new to XUI, XUI is designed to work with the native views. You can add regular buttons, labels and any other view you like with the designer. You can then change its type in the Globals sub to B4XView and it will just work.

 

[Star-Dust]

Preview

B4A

BAI

B4J

 

[Star-Dust]

From version 0.02 it will be possible to set again after the initialization of the view the name of the event that will be raised and also the module to which the sub is related to the event. (method ReSetEvent (Callback As Object, EventName As String))
In addition I will add Ellipsize (currently only present in the Design of Android) that also effects also to IOS View.

These functions do not exist with native views, so it adds something thatcan not be done normally with native views.

 

[Star-Dust]

Update to 0.02 release

In post#1 you will find the library, from post#2 you can download examples.

 

[Star-Dust]

Available update to version 0.03

• Add to EditText
  • TextIsEditable As Boolean
  • CursorVisible As Boolean
  • TextIsSelectable As Boolean
  • setSelection(StartIndex As Int, EndIndex As Int)
  • SelectionStart As Int
  • SelectionEnd As Int
• Add funciton 3d for View (B4A & B4I)
  • Rotate(AngleX As Float, AngleY As Float , AngleZ As Float)

 

[Star-Dust]

New EmbedView(View As B4XView) method in B4XPanel.

In the design it is not possible to attach other views to the B4XPanel because there is no such function in the design.
I found a way around the obstacle.
You draw the views above the panel to which you want to attach as in the image

Write this as a code

B4XPanel1.EmbedView(B4XImageView4.GetBase)
B4XPanel1.EmbedView(B4XImageView5.GetBase)
B4XPanel1.EmbedView(B4XImageView6.GetBase)

And the method automatically hooks the views to the panel in the position you have put them in the design.

 

[Erel]

There is a simpler solution. Use the native Panel and all other native views. Then convert their type to B4XView.

It is good to add cross platform controls that do not exist as native controls.
It is a mistake to wrap existing native views. It only makes things more complicated.

 

[Star-Dust]

There is a simpler solution. Use the native Panel and all other native views. Then convert their type to B4XView.

It is good to add cross platform controls that do not exist as native controls.
It is a mistake to wrap existing native views. It only makes things more complicated.

Dear @Erel,
as you can see, this library contains several Custom Views (CalendarPicker, SeekBar, Trimmer, RadioButton).
You are pausing to look only at the native ones, not seeing the library as a whole.
Moreover, the Native Views are not just an envelope, which adds nothing to the existing ones. But they add new features and methods.

For example, think of the View FloatLabeledEditText, which you made, you can not say that it is a simple label and therefore useless, because it adds new features not available natively. Besides the fact, not negligible, that it is possible to manage everything from Design without having to intervene from code and in any case have views with Events and Methods that correspond on all platforms.

This has required a lot of work, in fact the librery is full-bodied in Kb, it would not be so if it were just a shell of already existing Views.

Probably on this point we have different views, but I hope that in the future you can see it from my own point of view.

 

[Erel]

as you can see, this library contains several Custom Views (CalendarPicker, SeekBar, Trimmer, RadioButton).

These are great cross platform views.

It is the native views such as panel and label that I think should not have been wrapped.

 

[Star-Dust]

These are great cross platform views.

It is the native views such as panel and label that I think should not have been wrapped.

I take note of your thought. And I understand what you mean because at the moment they only partially offer the Personalizations I have in mind. I have not implemented everything yet.

I hope I can change your mind as I implement everything I have in mind.

 

[Cableguy]

I can imagine you going for an extensive XUI views set, to ease the creation of cross platform apps.
Still, keep in mind that some devs like to have platform specific projects and may need a "one from the pack" view...

 

[Star-Dust]

I can imagine you going for an extensive XUI views set, to ease the creation of cross platform apps.
Still, keep in mind that some devs like to have platform specific projects and may need a "one from the pack" view...

It's true, even I still create platform-specific libraries.
These same Classes that you find in this XUI library can be found in my other specific libraries for Android. Oriented precisely to the developers you're referring to who want "one from the pack"

This library instead is addressed to other developers, and is based on XUI, so it has the goal of having View that work identically on the three platforms and have the same properties and events.

I tried to develop libraries on both the specific ways to cover every need.

Mainly I created them for me, but I hope that they can be useful to others too

 

[Star-Dust]

A preview of new transition effects for labels.

B4XLabel2.Text="Scrolling Text"
B4XLabel2.TextScroll="New Text"
B4XLabel2.TextRoll="Other Text"

 

[Michael99k]

Hello,
I´m new to B4A and I´ve troubles getting things to work. I aim at multiple platforms.
My code tries to create B4XImageViews (which are not generated in the VisualDesigner) because I need a flexible amount of views.
XUI (Version 1.70) and SD_XUIView (Version 0.03) are loaded.

I miss the .Initialize method as with normal ImageViews (produces an error here).

The 2nd problem: The panel "panRaum" doesn´t allow the .AddView - it says that the B4XImageview cannot be converted to Imageview (see the attached screenshot)
I really get confused and the sample1.zip hasn´t an B4XImageview but just other Views to look at.

Can anyone please give advice?

Sub Globals

    Private B4XImageView1 As B4XImageView
End Sub
Sub Activity_Create(FirstTime As Boolean)
Dim imgPlatz As B4XImageView
            'imgPlatz.Initialize ("imgPlatz") 'All buttons share the same event sub; now error with B4XImageView
            FillImageToView(b, imgPlatz) 'Sub from Erel from https://www.b4x.com/android/forum/threads/b4x-xui-fill-and-fit-images-without-distortion.86627/
'            imgPlatz.setBitmap(b) 'b is a bitmap-object with loaded image
'            imgPlatz.SetBackgroundImage(b).Gravity = Gravity.CENTER           
            panRaum.AddView(imgPlatz,0 + x * (breite + 0dip), 0 + y * (tiefe + 0dip), breite, tiefe)
End Sub

Thanks in advance,
Michael

 

[Star-Dust]

If you want to initialize from code then you have to use ImageView as already suggested by Erel and then assign from code to a B4XView variable.
This library is specific for those who use design.

 

[Erel]

If you want to initialize from code then you have to use ImageView as already suggested by Erel and then assign from code to a B4XView variable.
This library is specific for those who use design.

My suggestion is to use the visual designer and add a regular ImageView. You can then optionally change the type of the generated variable to B4XView. I don't see any reason to add a custom view that wraps ImageView. It goes against the design of XUI framework and custom views are less flexible than native views.

There is a place for custom views. They are very useful when you want to add a control that is not covered by B4XView. ImageView like many other controls is already covered.

 

[Erel]

I'll explain why I'm a bit obsessed here.
Lets start with an example. You want to add a Panel to your layout. However in B4A and B4i the type is named Panel and in B4J it is named Pane. If you generate the variable declaration you will get a non-cross platform type.
So a developer might think that they need to wrap it with a custom view named B4XPanel. This is the wrong conclusion.
The correct solution is to add a Pane in B4J and a Panel in B4A / B4i and then go to the declared global variable and change its type to B4XView. Everything will just work.

Another important design choice behind XUI is to never limit the developer to the cross platform features. You can always cast B4XView to the native type and access all the available features.
You can use conditional compilation for this:

#If B4i
Dim iv As ImageView = ImageView1 'a B4XView
iv.SetShadow(...)
#End If

It is nice when it is not needed but it is nicer to be able to access all the features.

There are all kinds of drawbacks with custom views. For example you cannot get a custom view directly from the views tree.

 

[Star-Dust]

I'll explain why I'm a bit obsessed here.
Lets start with an example. You want to add a Panel to your layout. However in B4A and B4i the type is named Panel and in B4J it is named Pane. If you generate the variable declaration you will get a non-cross platform type.
So a developer might think that they need to wrap it with a custom view named B4XPanel. This is the wrong conclusion.
The correct solution is to add a Pane in B4J and a Panel in B4A / B4i and then go to the declared global variable and change its type to B4XView. Everything will just work.

Another important design choice behind XUI is to never limit the developer to the cross platform features. You can always cast B4XView to the native type and access all the available features.
You can use conditional compilation for this:

#If B4i
Dim iv As ImageView = ImageView1 'a B4XView
iv.SetShadow(...)
#End If

It is nice when it is not needed but it is nicer to be able to access all the features.

There are all kinds of drawbacks with custom views. For example you cannot get a custom view directly from the views tree.

I do not see it as you, I would argue that by reasoning that xui contains the xui.CreatePanel method

But I do not want to turn this library thread into something else. And I do not even want to argue with you because I have much esteem for your work.

So I refer this conversation to another more suitable place. Maybe I can even explain my obsession with this library.

Regard StarDust