B4A Class [B4X] [XUI] AS BottomMenu

Discussion in 'Additional libraries, classes and official updates' started by Alexander Stolte, Aug 16, 2018.

  1. Peter Simpson

    Peter Simpson Expert Licensed User

  2. Alexander Stolte

    Alexander Stolte Well-Known Member Licensed User


     
    klaus likes this.
  3. sigster

    sigster Active Member Licensed User

    Thanks
     
  4. asales

    asales Well-Known Member Licensed User

    If I check this option: "Enable Middle Button As Page"
    I get this error when I click in every button.

    Code:
    java.lang.RuntimeException: Object should first be initialized (B4XBitmap).
        at anywheresoftware.b4a.AbsObjectWrapper.getObject(AbsObjectWrapper.java:
    50)
        at anywheresoftware.b4a.objects.B4XViewWrapper$B4XBitmapWrapper.getWidth(B4XViewWrapper.java:
    588)
        at 
    as.bottom.menu.asbottommenu._v5(asbottommenu.java:735)
        at 
    as.bottom.menu.asbottommenu._asbm_page_5_handler(asbottommenu.java:370)
        at 
    as.bottom.menu.asbottommenu._asbm_page_5_click(asbottommenu.java:335)
        at java.lang.reflect.Method.invoke(Native Method)
        at anywheresoftware.b4a.BA.raiseEvent2(BA.java:
    191)
        at anywheresoftware.b4a.BA.raiseEvent(BA.java:
    171)
        at anywheresoftware.b4a.objects.ViewWrapper$
    1.onClick(ViewWrapper.java:80)
        at android.view.View.performClick(
    View.java:6294)
        at android.view.View$PerformClick.run(
    View.java:24770)
        at android.os.Handler.handleCallback(Handler.java:
    790)
        at android.os.Handler.dispatchMessage(Handler.java:
    99)
        at android.os.Looper.loop(Looper.java:
    164)
        at android.app.ActivityThread.main(ActivityThread.java:
    6494)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:
    440)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:
    807)
     
  5. asales

    asales Well-Known Member Licensed User

    One suggestion:
    can we have a label to each button, like the image below?
    I think will be a great (and customizable) substitute to the NavigationDrawer.
    Thanks.

    as_buttom4.jpg
     
  6. Alexander Stolte

    Alexander Stolte Well-Known Member Licensed User

    you forgot to put an icon on the 5th page. If you enable "Enable Middle Button As Page" then the middle button is hide and a page call "page5" is added. Page5 is always called "page5", no matter if you have set 2 tabs or 4.

    that is in the planning, already have a cool idea, but still has time to realize this. (maybe on the weekend) + (with a animation on tab click)

    Alone because it is cross platform. :cool::p with the same code you can add this in B4I and B4J.

    PD: i like nice menus :)
     
    asales likes this.
  7. asales

    asales Well-Known Member Licensed User

    That was it.

    Good to know.

    +1

    Thanks!
     
  8. Alexander Stolte

    Alexander Stolte Well-Known Member Licensed User

    Possible Now 1.6:
    asbm_text_feature.gif
    Screenshot_20180912-131955__01.jpg
    Tested in B4A.

    Next Version is 2.0, because i rewrite the class, i'm now better in my skills. :rolleyes:
     
    OGmac, mindful, Johan Hormaza and 6 others like this.
  9. asales

    asales Well-Known Member Licensed User

    :) Thank you so much!
     
    Alexander Stolte likes this.
  10. mindful

    mindful Active Member Licensed User

    Hello, first of all I want to congratulate you for your awesome menu.

    I am trying to use your class but I have some kind of problems as you can see below:
    broken_height.png

    The whole view is 640 height and 400 width
    The bottom menu is 100 height, anchored vertically to the bottom with a bottom edge distance of 0
    The dashboard panel is 540 height, anchored vertically to top and bottom with a bottom edge distance of 100

    The problem as you can see is that the menu doesn't fill up to 100 px as it should it only has 62 or so px.

    I am using the latest version of b4j.
     
  11. Alexander Stolte

    Alexander Stolte Well-Known Member Licensed User

    This is Normal, because, the view is so programmed that the middle button can show whenever you need it (without resizing your layout). Even if you do not need it, you have to take this into account. Maybe I'll change it because I'm rewriting the class right now.

    The Pic looks nice, good job Alex. :cool::D:D (Fun)
     
    mindful and Johan Hormaza like this.
  12. cliv

    cliv Member Licensed User

    How can we start without first page selected...(icon color white and no slider)?

    NoSelection800.png



    Can we have a function:
    Page1Enable (True), Page2Enable (False) ......

    Enable.png
     
  13. Alexander Stolte

    Alexander Stolte Well-Known Member Licensed User

    Currently not possible.

    i set it on the feature list.
     
  14. cliv

    cliv Member Licensed User

    Thank you...

    Consider this as new feature :) .... and maybe SliderEnable function
     
  15. Alexander Stolte

    Alexander Stolte Well-Known Member Licensed User

    I write the class new in the near future, but I just have other things open.
     
    Blueforcer likes this.
  16. cliv

    cliv Member Licensed User

    Nice, thanks.
     
  17. wizard699

    wizard699 Active Member Licensed User

    Hi Alexander.
    I've updated to 1.6 versione .... but I've now an errore in sub

    Private Sub IconTabs4(Props As Map)

    EnableMiddleButtonAsPage = Props.Get("EnableMiddleButtonAsPage")

    ERROR:
    java.lang.RuntimeException: Cannot parse: null as boolean
    at anywheresoftware.b4a.BA.parseBoolean(BA.java:607)
    at anywheresoftware.b4a.BA.ObjectToBoolean(BA.java:677)
    at net.silca.appsilca.asbottommenu._icontabs4(asbottommenu.java:3014)

    What's the problem? Can you help me?

    Also your example, with 1.6 version, have the same problem.
     
  18. wizard699

    wizard699 Active Member Licensed User

    All resolved. I've to re-open the designer and save the form.
     
  19. Blueforcer

    Blueforcer Active Member Licensed User

    Richtig Geil! Danke!
     
    Alexander Stolte likes this.
  20. Brandsum

    Brandsum Well-Known Member Licensed User

    Hello everyone,

    I have added some code inside ChangeMiddleButtonSize sub to get a nice curve above the middle button.

    Screenshot (Nov 25, 2018 5_46_09 PM).jpg

    Here is the code:

    Code:
    Public Sub ChangeMiddleButtonSize(size As Double, BorderWidth As Double)
        
        asbm_add_background.Height = size
        asbm_add_background.Width = size
        asbm_add_background.SetColorAndBorder(m_BackgroundColor,BorderWidth,xui.Color_White,asbm_add_background.Height/
    2)
        
        
    '''''
        'Code for the curve starts here
        '''''
        'shapes view init
        Dim shape,shapeBack As B4XView
        
    Dim shapePanel,shapeBackPanel As Panel
        shapePanel.Initialize(
    "shape")
        shapeBackPanel.Initialize(
    "shapeBack")
        
        
    Dim BezierView,BezierBackView As BitmapCreator
        
    Dim BezierPath As BCPath
        
    Dim sWidth As Double = size+200
        
    Dim sHeight As Double = (size/3) + 20
        
        
    'draw path
        BezierPath.Initialize(0, sHeight)
        CurveTo(BezierPath, 
    60, sHeight-190, ((sHeight/3)*2)-5)
        CurveTo(BezierPath, 
    1300, sWidth/21)
        CurveTo(BezierPath, sWidth-
    1300, sWidth-90, ((sHeight/3)*2)-5)
        CurveTo(BezierPath, sWidth-
    60, sHeight-1, sWidth, sHeight)
        BezierPath.LineTo(
    0,sHeight)
        
        
    'draw background
        BezierView.Initialize(sWidth,sHeight)
        BezierView.DrawPath(BezierPath,asbm_page_background.Color,
    True,0)
        shapePanel.SetBackgroundImage(BezierView.Bitmap).Gravity = 
    Gravity.FILL
        
        
    'draw border
        BezierBackView.Initialize(sWidth,sHeight)
        BezierBackView.DrawPath(BezierPath,asbm_parting_line.Color,
    True,0)
        shapeBackPanel.SetBackgroundImage(BezierBackView.Bitmap).Gravity = 
    Gravity.FILL
        
        
    'set curve view position and background
        shape = shapePanel
        mBase.AddView(shape,(mBase.Width / 
    2 - sWidth / 2),0, sWidth, sHeight)
        shape.Top = asbm_parting_line.Top - sHeight + 
    2dip
        shape.Left = asbm_page_background.Width / 
    2 - shape.Width /2
        shapeBack = shapeBackPanel
        mBase.AddView(shapeBack,(mBase.Width / 
    2 - sWidth / 2),0, sWidth, sHeight)
        shapeBack.Top = asbm_parting_line.Top - sHeight + 
    1dip
        shapeBack.Left = asbm_page_background.Width / 
    2 - shapeBack.Width /2
        shapeBack.SendToBack
        asbm_add_background.BringToFront
        
        
    '''''
        'Code for the curve ends here
        '''''
        
        
    'Top position has been modified for the curve view
        asbm_add_background.Top = asbm_parting_line.Top - asbm_add_background.Height/3
        
        asbm_add_background.Left = asbm_page_background.Width / 
    2 - asbm_add_background.Width /2

        pnl_asbm_add_icon.Width = asbm_add_background.Width /
    2.5
        pnl_asbm_add_icon.Height = asbm_add_background.Height /
    2.5
        
        pnl_asbm_add_icon.Left = asbm_add_background.Width / 
    2 - pnl_asbm_add_icon.Width /2
        pnl_asbm_add_icon.Top = asbm_add_background.Height / 
    2 - pnl_asbm_add_icon.Height / 2
    End Sub
    For the CurveTo function check this post by @Erel
    https://www.b4x.com/android/forum/threads/b4x-drawing-with-bitmapcreator.98887/#post-622799

    I have added the code to ChangeMiddleButtonSize sub to make it flexible as per the button size. So you have to call ChangeMiddleButtonSize inside Activity_Create sub like this:

    Code:
    BottomMenu.SetIcon1(FontToBitmap(Chr(0xF015),False,35,Colors.Black))
    BottomMenu.SetIcon2(FontToBitmap(
    Chr(0xF290),False,35,Colors.Black))
    BottomMenu.SetIcon3(FontToBitmap(
    Chr(0xF0F5),False,35,Colors.Black))
    BottomMenu.SetIcon4(FontToBitmap(
    Chr(0xE536),True,40,Colors.Black))
    BottomMenu.SetMiddleButtonIcon(FontToBitmap(
    " SOS ",True,20,Colors.White))
    BottomMenu.ChangeMiddleButtonSize(
    140,0)
    BottomMenu.SetPageClickColor(
    Colors.ARGB(20,10,170,146))
    NOTE: You need BitmapCreator V4.50.
     
    inakigarm, Erel and Alexander Stolte like this.
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