B4A Library AMRadialMenu 1

Discussion in 'Additional libraries, classes and official updates' started by Mashiane, Jan 21, 2017.

  1. Mashiane

    Mashiane Expert Licensed User

    Hello

    Library File & Example Download

    Latest Version: 110 : All Future Updates of this component are maintained here.



    1. Each menu item can be assigned a badge.
    2. The radial menu can be placed anywhere in the screen, top left, bottom right etc. (to figure out how to center on page)

    Here is some example code...

    Code:
    Sub Globals
        
    'These global variables will be redeclared each time the activity is created.
        'These variables can only be accessed from this module.
        Private rm As AMRadialMenu
        
    Private pg As AMPage
    End Sub

    Sub Activity_Create(FirstTime As Boolean)
        
    'Do not forget to load the layout file created with the visual designer. For example:
        'Activity.LoadLayout("Layout1")
        Activity.Title = "Radial Menu"
        pg.Initialize(Me, 
    "pg",0dip,0dip,100%x,100%y)
        rm.Initialize(
    "rm","settings.png""windowsback.png"True)
        
    'rm.Position = rm.EnumRadialMenuPosition.righttop
        'rm.enableAnimation = False
        rm.BackgroundColor = "red"
        
    'rm.Radius = "100"
        'rm.renderMode = pg.EnumRenderMode.android

        
    'add individual menu items
        rm.AddMenuItem("google""Google""""google.png"True)
        rm.AddMenuItem(
    "music""Music""""music.png"True)
        rm.AddMenuItem(
    "direction""Direction""""map.png"True)
        rm.AddMenuItem(
    "message""Message""300""messaging.png"True)


        pg.AddRadialMenu(rm)
        pg.Render
        
    Activity.AddView(pg.asview, 0dip0dipActivity.Width, Activity.Height)
        
    Activity.AddMenuItem3("Tiles""cmdTiles",LoadBitmap(File.DirAssets,"tiles.png"),True)
     
    Last edited: Feb 18, 2017
  2. Mashiane

    Mashiane Expert Licensed User

    Trapping the menu click event...

    Code:
    Sub pg_MenuClicked(value As String)
        
    'show the name of the menu selected
        'value returns the index of the selected item
        Log(value)
        
    Dim menu As String = rm.GetID(value)
        
    Activity.Title = menu
    End Sub
     
  3. Wolli013

    Wolli013 Active Member Licensed User

    Nice, thank you!
     
    Mashiane likes this.
  4. zsugar

    zsugar Member Licensed User

    Hi, the downloading link is AMTileView
     
    joulongleu likes this.
  5. Mashiane

    Mashiane Expert Licensed User

    Yes, I am aware of this, the components are based on the same pot of source code i.e. javascript, however they are still separate components. Play around with the example and see.
     
    joulongleu likes this.
  6. Mashiane

    Mashiane Expert Licensed User

    Version 108, download from same location, library name is AMTileView108 The Radial Menu can now be placed in the middle of the screen. This is the Android Flavour...

    This will now be maintained and be part of the AMTileView library

    radialmenu.png
     
    Last edited: Feb 2, 2017
  7. Mashiane

    Mashiane Expert Licensed User

    The IOS Flavour / Theme..

    rmios.png
     
    joulongleu and Johan Schoeman like this.
  8. Mashiane

    Mashiane Expert Licensed User

    The Windows Theme...

    rmwindows.png
     
    joulongleu and Johan Schoeman like this.
  9. Wolli013

    Wolli013 Active Member Licensed User

    We can change the Color of Out Circle?
    Circle Transparent?
     
    joulongleu likes this.
  10. Mashiane

    Mashiane Expert Licensed User

    Will look into it...
     
    joulongleu likes this.
  11. Mashiane

    Mashiane Expert Licensed User

    What's New: Version 109 (same location as in Post #1)

    1. The WindowsTheme Outer Circle can now be transparent. As the radius for this theme is smaller, increase it

    Code:
    rm.Radius = 200
    rm.HideOuterCircle = 
    True
    HiddenCircle.png

    2. Added functionality for SubMenus, for example the Twitt menu has child buttons.. Clicking the arrow goes back to the menu. In this case, the outer circle is hidden so one has to touch just outside that button. If there are no child buttons, there is nothing to worry about. Investigating how I can just show only the arrow button if there are child buttons.

    SubMenu.png

    3. Removed the GetID method, the MenuClicked item now returns the id of the selected menu and id of child menu if it exists. For now this is still buggy and only works for the Flat and Windows themes.

    Code:
    Sub pg_MenuClicked(value As String, childIndex As String)
        
    'update the badge
        'return the clicked value and childindex
        Activity.Title = value & "," & childIndex
    End Sub
    4. Added some extra methods for the Radial Menu. Each item in the menu has an index starting from zero, in the sequence you add items to the RadialMenu in.

    4.1 DisableItemByIndex
    4.2 EnableItemByIndex
    4.3 HideBadge
    4.4 ShowBadge
    4.5 UpdateBadgeValue
    4.6 SetRenderMode
    4.7. SetPosition
    4.8 SetRadius

    Enums

    Code:
    EnumRadialMenuPosition.Initialize
        EnumRadialMenuPosition.leftcenter = 
    "leftcenter"
        EnumRadialMenuPosition.lefttop = 
    "lefttop"
        EnumRadialMenuPosition.leftbottom = 
    "leftbottom"
        EnumRadialMenuPosition.rightcenter = 
    "rightcenter"
        EnumRadialMenuPosition.righttop = 
    "righttop"
        EnumRadialMenuPosition.rightbottom = 
    "rightbottom"
        EnumRadialMenuPosition.topcenter = 
    "topcenter"
        EnumRadialMenuPosition.bottomleft = 
    "bottomleft"
        EnumRadialMenuPosition.bottomcenter = 
    "bottomcenter"
        EnumRadialMenuPosition.none = 
    ""

    EnumRenderMode.Initialize
       EnumRenderMode.windows = 
    "windows"
       EnumRenderMode.auto = 
    "auto"
       EnumRenderMode.android = 
    "android"
       EnumRenderMode.flat = 
    "flat"
       EnumRenderMode.ios7 = 
    "ios7"

    Events (linked 
    to the AMPage object)

    [CODE]
    #Event: MenuClicked (value As String, childIndex as string)
    [/CODE]
     
    Last edited: Feb 7, 2017
    joulongleu likes this.
  12. Mashiane

    Mashiane Expert Licensed User

    Adding a menu item with child menu items...

    Code:
    Dim rmi As AMMenu
        rmi.Initialize(
    "twitt","Twitt","3","twitt.png"True)
        rmi.AddSubMenu(
    "google","Google","1","google.png"True)
        rmi.AddSubMenu(
    "music""Music",  """music.png"True)
        rmi.AddSubMenu(
    "direction""Direction""""map.png"True)
        rmi.AddSubMenu(
    "message""Message""300""messaging.png"True)
        rmi.AddSubMenu(
    "mindmap","Mind Map","","mindmap.png"True)
        rm.AddMenu(rmi)
     
    joulongleu likes this.
  13. Wolli013

    Wolli013 Active Member Licensed User

    Thank You!
     
    joulongleu and Mashiane like this.
  14. javiers

    javiers Active Member Licensed User

    Congratulations for your work.
    You can use AMRadialMnu on a page other than AMPage. I would like to use this control on a page that I have already defined. Or can you put AMPage transparent?

    Thanks for your answer.
     
    Mashiane and joulongleu like this.
  15. Mashiane

    Mashiane Expert Licensed User

    @javiers

    The AMPage component itself is a webview control that renders html content. The radial menu as a javascript css based component uses that too including webviewextras to trap its events. Try the SetBackground method of AMPage with the color you want, in this case "transparent", havent tested though.
     
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