B4A Library ImageButtonsView

ImageButtonsView is simple widget i created to use with a MapView and the OSMDroid library, but could be useful in other projects.

It consists of an ImageButton that toggles the visibility of the other user added ImageButtons.

You can create an ImageButtonsView in either horizontal or vertical mode.
A HorizontalScrollView contains user added ImageButtons in horizontal mode, and a ScrollView contains user added ImageButtons in vertical mode.

Add as many ImageButtons as you require.
No matter how many buttons you add they will all be accessible as the user can scroll the View that contains them.

A click on a user added ImageButton generates a Click event, the event listener Sub is passed the clicked ImageButton ButtonId as a String.

Here's the demo code:

B4X:
'Activity module
Sub Process_Globals
End Sub

Sub Globals
   Dim ImageButtonsView1 As ImageButtonsView
End Sub

Sub Activity_Create(FirstTime As Boolean)
   Dim Height, Left, Orientation, Top, Width As Int
   
   Left=5dip
   Top=5dip
      
   If 100%x>100%y Then
      '   device is in landscape mode
      Height=-2   '   -2 is the wrap_content constant
      Orientation=ImageButtonsView1.LAYOUT_HORIZONTAL
      Width=100%x-Left
   Else
      '   device is in portrait mode
      Height=100%y-Top
      Orientation=ImageButtonsView1.LAYOUT_VERTICAL
      Width=-2   '   -2 is the wrap_content constant
   End If
   
   ImageButtonsView1.Initialize("ImageButtonsView1", Orientation, Array As String("ic_previous", "ic_next", "ic_info", "ic_refresh", "ic_mylocation", "ic_zoomin", "ic_search"))
   
   Activity.AddView(ImageButtonsView1, Left, Top, Width, Height)
   
End Sub

Sub Activity_Resume
End Sub

Sub Activity_Pause (UserClosed As Boolean)
End Sub

Sub ImageButtonsView1_Click(ButtonId As String)
   Log(ButtonId)
   Select ButtonId
      Case "ic_mylocation"
         ImageButtonsView1.SetButtonEnabled("ic_mylocation", False)
      Case "ic_search"
         ImageButtonsView1.SetButtonEnabled("ic_mylocation", True)
   End Select
End Sub

ImageButtonsView
Version: 1.1
  • ImageButtonsView
    Events:
    • Click (ButtonId as String As )
    • LongClick (ButtonId as String As )
    Fields:
    • LAYOUT_HORIZONTAL As Int
    • LAYOUT_VERTICAL As Int
    Methods:
    • BringToFront
    • GetButtonEnabled (ButtonId As String) As Boolean
      Get whether a button is enabled.
    • Initialize (EventName As String, Layout As Int, ButtonDrawableIds() As String)
      Initialize the object.
      Layout has two possible values:
      LAYOUT_HORIZONTAL
      LAYOUT_VERTICAL
      ButtonDrawableIds is an array of String resource identifiers.
      Each element in the array should be the resource name of a Drawable in your project's Drawable folder.
    • Invalidate
    • Invalidate2 (arg0 As Rect)
    • Invalidate3 (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int)
    • IsInitialized As Boolean
    • RemoveView
    • RequestFocus As Boolean
    • SendToBack
    • SetBackgroundImage (arg0 As Bitmap)
    • SetButtonEnabled (ButtonId As String, Enabled As Boolean)
      Set whether a button is enabled.
    • SetLayout (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int)
    Properties:
    • Background As Drawable
    • Color As Int [write only]
    • Enabled As Boolean
    • Height As Int
    • Left As Int
    • Tag As Object
    • Top As Int
    • UserButtonsVisible As Boolean
      Get or Set the visibility of the user added buttons.
    • Visible As Boolean
    • Width As Int

So what is the ButtonId used in these methods and event?

It is the Drawable resource name used for each button.

The demo code Initializes the ImageButtonsView with these String Array elements:

B4X:
"ic_previous", "ic_next", "ic_info", "ic_refresh", "ic_mylocation", "ic_zoomin", "ic_search"

A click on the button whose Drawable resource name is "ic_next" generates a Click event and the event listener Sub is passed "ic_next" as the clicked button's ButtonId.

So add as many or as few buttons as you require, set up your event listener Sub to handle clicks on each button and that's about it.

Library and demo project attached.

The demo project's Objects/drawable-nodpi folder contains the all Drawables and some more that the demo uses.
Be sure to make any Drawables that you add to your project read-only.

Drawables in a 'drawable-nodpi' folder are NOT scaled depending on device density - that's my preference for these ImageButtons.
If you move these Drawables to the 'drawable' folder and try the demo on low and high density devices you should see the ImageButtons change in size to contain the scaled Drawable.

Martin.
 

Attachments

  • ImageButtonsView_v_1_10.zip
    54.8 KB · Views: 1,102
Last edited:

warwound

Expert
Licensed User
Longtime User
ImageButtonsView updated to version 1.10

A quick update that was simple to implement.

A new event is now generated:

LongClick (ButtonId as String)

Generated when a user added ImageButton is LongClicked.
As with the Click event, the ButtonId is the name of the Drawable resource used as the button's Drawable.

Demo code and updated library attached to first post in this thread.

Martin.
 

luke2012

Well-Known Member
Licensed User
Longtime User
That is great! My Compliments!
One question.
Which library I have to load in order to use this class?
 

warwound

Expert
Licensed User
Longtime User
ImageButtonsView.jar and ImageButtonsView.xml are both included in the attachment to the first post in this thread.

Martin.
 

luke2012

Well-Known Member
Licensed User
Longtime User
Thanks for your reply!
If I understand well, every single image button is customizable. Correct?
 

warwound

Expert
Licensed User
Longtime User
Thanks for your reply!
If I understand well, every single image button is customizable. Correct?

Yes that's it.
You can create an ImageButtonsView with one or more buttons.
Each String element of the ButtonDrawableIds() Array passed to Initialize identifies a Drawable in your project's resources to be used for a button.

Martin.
 
Top