B4A Library [B4X] XUI Views - Cross platform views and dialogs

Discussion in 'Additional libraries, classes and official updates' started by Erel, Dec 27, 2018.

Thread Status:
Not open for further replies.
  1. Erel

    Erel Administrator Staff Member Licensed User



    XUI Views is a b4x library (https://www.b4x.com/android/forum/threads/100383/#content). The same b4xlib library is compatible with B4A (v8.8+), B4J (v7.0+) and B4i (v5.50+).

    It is a collection of custom views and dialogs. Everything is written in B4X. The source code is included inside the b4xlib file, which is a zip file.

    Views:

    - B4XComboBox - Cross platform ComboBox / Spinner / ActionSheet.
    - ScrollingLabel - A label that scrolls the text when it is wider than the label.
    - AnotherProgressBar - Vertical or horizontal animated progress bar.
    - B4XLoadingIndicator - 6 different animated loading indicators.
    - RoundSlider - A round slider.
    - SwiftButton - 3d button
    - AnimatedCounter
    - B4XFloatTextField - A TextField / EditText with a floating hint
    - B4XSwitch - Nice looking two state control.

    Dialogs:

    - B4XDialog - A class that provides the features required to show a dialog. There are three methods to show dialogs: Show - Shows a simple dialog with text, ShowCustom - Allows you to pass a layout of your own and show it as a dialog, ShowTemplate - Shows a dialog based on a template class. See the source code for the template structure. It is quite simple.

    Available templates:

    - B4XDateTemplate - Based on AnotherDatePicker.
    - B4XColorTemplate - Nice color picker.
    - B4XLongTextTemplate - Scrollable text.
    - B4XListTemplate - A list of items. The user can choose one of the items.
    - B4XSignatureTemplate - Captures the user signature and adds a timestamp to the bitmap.
    - B4XInputTemplate - Template for text and numeric inputs.
    - B4XSearchTemplate - A list with a search field. An evolution of SearchView.
    - B4XTimedTemplate - A template that wraps other templates and creates a dialog that closes automatically after the set time with a nice animated progress bar.

    It is simple to add more templates.
    Tutorial about B4XDialogs: https://www.b4x.com/android/forum/threads/101197

    More views and templates will be added in future versions.

    The examples projects are quite simple. Don't miss the following snippets:

    B4i:
    Code:
    Private Sub Page1_Resize(Width As Int, Height As Int)
       
    If Dialog.Visible Then Dialog.Resize(Width, Height)
    End Sub

    Private Sub Application_Background
       Dialog.Close(XUI.DialogResponse_Cancel)
    End Sub
    B4A:
    Code:
    Sub Activity_KeyPress (KeyCode As Int) As Boolean 'Return True to consume the event
      If KeyCode = KeyCodes.KEYCODE_BACK And Dialog.Close(XUI.DialogResponse_Cancel) Then Return True
       
    Return False
    End Sub

    Sub Activity_Resume
       
    'required to continue the animation after the activity is paused.
       AnotherProgressBar1.Visible = True
       B4XLoadingIndicator1.Show
       B4XLoadingIndicator2.Show
       ScrollingLabel1.Text = ScrollingLabel1.Text
    End Sub

    Sub Activity_Pause (UserClosed As Boolean)
       Dialog.Close (XUI.DialogResponse_Cancel)
    End Sub
    B4J:
    Code:
    Sub MainForm_Resize (Width As Double, Height As Double)
       
    If Dialog.Visible Then Dialog.Resize(Width, Height)
    End Sub
    Updates

    V1.82 - B4XFloatTextField
    - NextField property. Pressing on enter or on the accept button will move the focus to the set B4XFloatTextField.
    - RequestFocusAndShowKeyboard method.

    V1.80 - B4XFloatTextField - Support for multiline fields and new accept button which triggers the EnterPressed event and closes the keyboard (especially important in iOS).

    [​IMG]

    V1.77 - SwiftButton.SetColors - allows changing the colors at runtime.
    V1.76 - Keyboard type option added to B4XFloatTextField. It affects the keyboard type in B4A and B4i.
    V1.75 - New B4XSwitch control:

    switch.gif

    V1.70 - New B4XTimedTemplate. This template wraps other templates and creates an auto-closing dialog:

    TimedTemplate.gif

    See the "options / select animal" dialog for an example. It is very simple to use.
    - AnotherProgressBar - The change speed can be set with ValueChangePerSecond field. This allows using the progress bar as a visual timer. For example to show 5 seconds progress:
    Code:
    AnotherProgressBar1.ValueChangePerSecond = 100 / 5
    AnotherProgressBar1.SetValueNoAnimation(
    0'set the value immediately.
    AnotherProgressBar1.Value = 100 'animate to 100. It will take 5 seconds.

    V1.67 - Tag field added to the custom views. You can set it with the designer or at runtime.
    - B4XDialog - New fields: TitleBarTextColor, TitleBarFont and ButtonsFont. See the signature dialog for an example (the buttons font is set to FontAwesome):

    [​IMG]

    - B4XDialog - All text fields of B4XDialog accept CSBuilder objects as well as strings (B4A and B4i).
    - AnotherProgressBar is no longer limited to indeterminate state. You can modify the Value field to change its position. Note that the change is animated.
    Click on the Animated Counter button in the example to see it.


    V1.66 - All mBase views are now public and their tag is set to the custom view instance. This makes it simpler to get a custom view from the layout tree.
    V1.65 - New dialog template: B4XSearchTemplate

    [​IMG]

    V1.64 - Better behavior of B4XDialog and B4XInputTemplate with short screens.
    V1.63 - Fixes an issue with B4XLongTextTemplate when the text is shorter than the dialog.
    V1.62 - Small update to B4i ListTemplate layout file.

    A custom "list of colors" dialog added to the example:

    [​IMG]

    V1.61 - Allows setting the Text property of B4XInputTemplate.

    V1.60 - B4XFloatTextField reveal button in password mode:

    reveal.gif

    V1.55 - B4XComboBox.DelayBeforeChangeEvent - Used to prevent rapid events when scrolling the list with the keyboard. Default value is 500ms in B4J and 0 in other platforms (not used).

    V1.50 - B4XInputTemplate - preset configurations for numeric inputs (ConfigureForNumbers)

    V1.45 - B4XFloatTextField:

    - EnterPressed and TextChanged events.
    - Optional clear button.
    - Bug fixes.

    V1.40 - B4XFloatTextField password mode (in the designer)

    V1.35 - New B4XFloatTextField:

    B4XFloatTextField.gif

    V1.30 - New B4XSignatureTemplate:

    signature.gif

    V1.20 - New AnimatedCounter custom view:

    [​IMG]

    V1.10 - New B4XInputTemplate - See post #2.

    Executable jar is available for download: http://www.b4x.com/b4j/files/XUI Views Example.jar - Download and double click to run.
     

    Attached Files:

    Last edited: Jan 23, 2019 at 11:00 AM
  2. Erel

    Erel Administrator Staff Member Licensed User

    V1.10 released with an input dialog:

    [​IMG]

    It has an optional validation feature based on regular expression.
     
    Cain Soft, fredo, Star-Dust and 7 others like this.
  3. Star-Dust

    Star-Dust Expert Licensed User

    What is B4i (TBD+).?
     
  4. Erel

    Erel Administrator Staff Member Licensed User

    TBD - to be determined. b4xlibs will be supported in the next version of B4i. Will probably be released during January.
     
    Johan Hormaza and Peter Simpson like this.
  5. Star-Dust

    Star-Dust Expert Licensed User

    Ok, thank's
     
  6. walterf25

    walterf25 Well-Known Member Licensed User

    Wow this very nice, Thanks @Erel

    Walter
     
  7. incendio

    incendio Well-Known Member Licensed User

    Can this lib run with B4A 8.5?

    Tried to extract XUI Views.b4xlib and add every modules manually, but got errors :
    - Unknown Member : SetBitmapToImageView
    - Unknown Type : BCPath


    Library
    - BitmapCreator 4.18
    - DateUtils 1.05
    - IME 1.10
    - xCustomListView 1.63
    - XUI 1.72
     
    Last edited: Dec 28, 2018
  8. Erel

    Erel Administrator Staff Member Licensed User

    No.

    "The same b4xlib library is compatible with B4A (v8.8+), B4J (v7.0+) and B4i (TBD+)."
     
  9. LucaMs

    LucaMs Expert Licensed User

    A cross platfom EdiText?
     
  10. scsjc

    scsjc Active Member Licensed User

    hi, i find a little problem... i'm use in some codes the name T in a module code
    when try to compile in Debug mode....
    upload_2018-12-28_15-49-8.png

    is possible fix it???
    thanks a lot
     
  11. Filippo

    Filippo Expert Licensed User

    @scsjc
    I would give you a meaningful name for your module in your place, instead of just "t". ;)
     
    ivan.tellez, KMatle and Star-Dust like this.
  12. scsjc

    scsjc Active Member Licensed User

  13. DonManfred

    DonManfred Expert Licensed User

    jimmyF likes this.
  14. scsjc

    scsjc Active Member Licensed User

    Well, if that's right;) I did not know ... well I'll have to change to another letter

    Thank you
     
  15. Erel

    Erel Administrator Staff Member Licensed User

    It is not needed once you learn how to work with B4XView. Add the EditText with the designer and change its type to B4XView.

    The problem with the T module name is that there is a conflict with a variable named the same in ScrollingLabel class.
     
    Last edited: Dec 30, 2018
  16. Erel

    Erel Administrator Staff Member Licensed User

    V1.20 released. AnimatedCounter custom view added.

    [​IMG]
     
    scsjc likes this.
  17. LucaMs

    LucaMs Expert Licensed User

    Since you are working on it... it would be useful to show a total, so to have an "AddValue" property (you can pass negative values) but with scrolling of all numbers only in one direction (better if upwards when positive value and vice versa).
     
    Last edited: Dec 30, 2018
  18. Erel

    Erel Administrator Staff Member Licensed User

    V1.30 released with a dialog signature template. See first post.
     
    Pencil3, Kiffi, jimmyF and 1 other person like this.
  19. Erel

    Erel Administrator Staff Member Licensed User

    inakigarm and DonManfred like this.
  20. Erel

    Erel Administrator Staff Member Licensed User

    V1.35 is released with a new B4XFloatTextField view:

    [​IMG]
     
Thread Status:
Not open for further replies.
Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice