B4A Library AHDashboard Library

The one and only object in this library is a special Panel object that layouts the added views automatically.

With this you can add dashboard pages to your app like in Google+, Google Text and Tables or many other apps.

Just add some objects to the dashboard and see them optimally placed automatically on the screen.

The library is based on this source but I had to make some changes to make it work properly in landscape mode.

For installation copy the jar and xml file to your custom libs folder.

The example adds small panels with an image and a label to the dashboard. If you tap on an image the parent panel is made invisible and the dashboard automatically rearranges the other items. To make everything visible again just rotate the screen or restart the app.

Version History:
1.00:
- initial version

1.01:
- removed debug output
- added some documentation

1.02:
- optimized internal layout algorithm for better layout

 

[Cableguy]

Very Nice, Thanks Markus

 

[corwin42]

New version.

See first post for changes.

 

[raytronixsystems]

Very nice!

I wish I had seen this several weeks ago!

Plan on using this immediately!

 

[susu]

I try to add 12 buttons with different sizes but they were resized to the same size. How cainI fix it?

 

[corwin42]

I try to add 12 buttons with different sizes but they were resized to the same size. How cainI fix it?

Thats true. The childs are resized to the same size. Try to put all buttons on panels (should have all same size) and add the panels to the dashboard.

 

[susu]

OK, this code worked:

dashboard.Initialize("")

Dim Panel1 As Panel
Dim Button1 As Button
Dim Label1 As Label

Panel1.Initialize("")
Panel1.LoadLayout("panel1")
Panel1.Color = Colors.Transparent
Label1.Text = "Item 1"
Button1.Tag = Panel1
Button1.Width = 100dip
Button1.Height = 100dip
dashboard.AddView(Panel1, 100dip, 100dip)

Panel1.Initialize("")
Panel1.LoadLayout("panel1")
Panel1.Color = Colors.Transparent
Label1.Text = "Item 2"
Button1.Tag = Panel1
Button1.Width = 40dip
Button1.Height = 40dip
dashboard.AddView(Panel1, 40dip, 40dip)

Panel1.Initialize("")
Panel1.LoadLayout("panel1")
Panel1.Color = Colors.Transparent
Label1.Text = "Item 3"
Button1.Tag = Panel1
Button1.Width = 80dip
Button1.Height = 80dip
dashboard.AddView(Panel1, 80dip, 80dip)

Panel1.Initialize("")
Panel1.LoadLayout("panel1")
Panel1.Color = Colors.Transparent
Label1.Text = "Item 4"
Button1.Tag = Panel1
Button1.Width = 50dip
Button1.Height = 50dip
dashboard.AddView(Panel1, 50dip, 50dip)

Activity.Color = Colors.White
Activity.AddView(dashboard, 0, 0, Activity.Width, Activity.Height)

But why this code didn't work?

dashboard.Initialize("")

Dim Panel1 As Panel
Dim Button1 As Button
Dim bg As Bitmap

Panel1.Initialize("")
Button1.Initialize("")
bg.Initialize(File.DirAssets, "B4ALogo.jpg")
Button1.SetBackgroundImage(bg)
Panel1.Color = Colors.Transparent
Button1.Tag = Panel1
Button1.Width = 100dip
Button1.Height = 100dip
dashboard.AddView(Panel1, 100dip, 100dip)

Panel1.Initialize("")
Button1.Initialize("")
bg.Initialize(File.DirAssets, "B4ALogo.jpg")
Button1.SetBackgroundImage(bg)
Panel1.Color = Colors.Transparent
Button1.Tag = Panel1
Button1.Width = 40dip
Button1.Height = 40dip
dashboard.AddView(Panel1, 40dip, 40dip)


Panel1.Initialize("")
Button1.Initialize("")
bg.Initialize(File.DirAssets, "B4ALogo.jpg")
Button1.SetBackgroundImage(bg)
Panel1.Color = Colors.Transparent
Button1.Tag = Panel1
Button1.Width = 80dip
Button1.Height = 80dip
dashboard.AddView(Panel1, 80dip, 80dip)


Panel1.Initialize("")
Button1.Initialize("")
bg.Initialize(File.DirAssets, "B4ALogo.jpg")
Button1.SetBackgroundImage(bg)
Panel1.Color = Colors.Transparent
Button1.Tag = Panel1
Button1.Width = 50dip
Button1.Height = 50dip
dashboard.AddView(Panel1, 50dip, 50dip)

Activity.Color = Colors.White
Activity.AddView(dashboard, 0, 0, Activity.Width, Activity.Height)

 

[corwin42]

Because with LoadLayout() you always get a new instance of the button (assuming that you have the button on the panel1 layout file).

In the not working code you work with only one button. You have to Dim it again before initializing.

 

[susu]

OK, I got it. Thank you Markus.

 

[boastrike]

Markus,

Thank you for sharing this library, very nice. I am still pretty new to this and it may be something simple but can I have the dashboard only take up a portion of the screen? I have a Title Panel as part of the background that takes up the top 20% of the screen. When I add buttons it places the buttons on top of the title panel. If I try to set the dashboard.top it gives an error.

Thanks again, Jim

 

[raytronixsystems]

Hi Markus!

Nice library. I have a few questions:
1 - how can I get a return value equal to the button number that was pressed?
2.- how can I keep the pressed button on the screen after it was pressed?

I am trying to implement a dashboard for my app that looks like what I had described in my posting the other day.

Here is the link: http://www.b4x.com/forum/basic4android-updates-questions/14560-need-dashboard.html#post82455

I guess you can get the overall idea of what I am looking for based upon my posting.

Thanks In Advance for you help. Keep up the good work with your libraries!

-Ray

 

[corwin42]

I am still pretty new to this and it may be something simple but can I have the dashboard only take up a portion of the screen?

You can specify the dimensions and position of the dashboard in Activity.AddView(...). dashboard.Top can only be set after it is placed on a container (Activity or Panel)

1 - how can I get a return value equal to the button number that was pressed?
2.- how can I keep the pressed button on the screen after it was pressed?

1.
If you look at the example all buttons use the same Button1_click sub and you can get the button wich raised the event with the Sender keyword. You can write an identifier to the Tag property of the button.

2.
In the Button1_click sub the panel containing the button is made invisible. Just don't do this.

You can use the AHDashboard library for your dashboard. It's exactly the use case it was created for.

 

[boastrike]

Thank you for the quick response Markus! Truly appreciative of your library and guidance. Jim

 

[raytronixsystems]

Thx for your help Markus! I'll review the example further as you have suggested and start some coding to get the data I need here. Any thoughts on writing a Tutorial for this library?

 

[corwin42]

Any thoughts on writing a Tutorial for this library?

Currently not. I think the example should explain it all.

 

[raytronixsystems]

OK, looking at the example cleared quite a few things up for me. I now have the answer to Question #2 about not making the button disappear when pressed. I commented out the line which makes it invisible in the click event and this solves my problem. By carefully specifying the number of buttons to draw and their size I can get the grid configuration that I am looking for.

Now,I still have the problem of detecting which button was pressed by the user. I put a toast message in the click event to print the tag value of the Panel pressed but it is printed as NULL since it is an object and not an integer. This made sense. I tried assigning an integer value to the Tag during initialization and received a java casting error since I was tring to cast an int to an object. This is understandable. There must be something very simple I'm missing here.Perhaps another property I am missing. I'm not sure what an "identifier to the Tag property of the button" is.

Cound you please provide an example with a toast message or otherwise how to retreive the button number? I would really appreciate it. The library looks great and will be very useful to me if I could only get this last remaining bit of information.

Thanks In Advance,
Ray

 

[raytronixsystems]

Ok here is how I got it working. I now get the button number in the click routine can can parse it out from there.

'Button1.Tag = Panel1
Button1.Tag = i ' changed from panel to button number integer

...
End Sub

Sub Button1_Click
   'Just make the panel invisible to let the dashboard redraw itself
   Dim bt As Button
   Dim p As Panel
   Dim i As Int ' this added 
   
   bt = Sender
   'p = bt.Tag ' took this out
   
   i = bt.Tag ' added this to retrieve the button number
   'p.Visible = False ' took out to keeo this button displayed 
   
   ToastMessageShow("Button value is:" & i, False)  ' show number

   '.... further processing code here...
End Sub

The Tag property no longer contains a Panel object but instead is an integer. I'd like to keep it a Panel object but not sure how I could specify the button number in the object.

-Ray

 

[yuhong]

Markus,

Thank you for sharing this library!

1.I need automatically redraw the icon by left to right, top to bottom,not auto center!
2.Support scroll.
:sign0188:

 

[corwin42]

The intention of this library is to distribute the content objects always as good as possible. Your feature request may be added in the future.

Gesendet von meinem LG-P500 mit Tapatalk

 

[corwin42]

Updated first post with version 1.02 of the library. The change is only internally but produces much better layout of the containing objects (most noticeable in landscape mode). The objects now should never overlap when it is not really necessary.