Discussion Forums  >  Plugins, Customizing, Source Code

Replies: 17    Views: 339

Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
06/13/13 05:24 AM (12 years ago)

Android menu button layout

Greeting, I want to have 3X3, 9 menu buttons in grid layout. Been playing on few hours already, but couldn't manage to figure out the right combination. Perhaps it require a higher level of coding for the core file custom work. By adjusting the button size and margin can only work on specific devices. ie the same setting applied on a 720X1080 resolution devices doesn't means that they look alike on other devices resolution. Android loads images from drawable/xhdpi for large devices. But the new released Sony Xperia Z and Samsung Galaxy S4 have 1280X1920 resolution. The button images became smaller on this extra extra high density screen. Not only the button sizes, but also the layout been changed. In buzztouch panel, the setting only have limited for small or for large device adjustment. I have also done adjusted the padding in BT_screen_menuButtons.java. But again. It would only work for the same resolution devices. Appreciated for any help. TableRow tr = null; if(tmpRowCounter < buttonsPerRow){ tr = new TableRow(this); tr.setLayoutParams(trLp); tr.setPadding(10, 220, 20, 0);
 
Paul Rogers
Android Fan
Profile
Posts: 2524
Reg: May 30, 2011
UK
35,740
like
06/13/13 06:08 AM (12 years ago)
Hi Cyrus, have you taken a look at using seperate layout folders for different resolutions? I haven't tried menuButtons but had some success with the menu+image plugin, so I had different layouts depending on device resolution, there's some good information here: http://developer.android.com/guide/practices/screens_support.html for example, you could have a layout folder named 'layout-sw600dp' for devices of at least 600dp, your example would be, I think, 'layout-sw1280dp', which should pull images from 'drawable-xhdpi' I had a lot of trial and error with paddings, margins, positioning etc, but got there in the end! Hope that helps a bit.
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/13/13 06:29 AM (12 years ago)
It's nice to hear from you raveyd. Very useful information from android guide. Thank you. I found a similar post on stackoverflow, but the question is, how to implement it to our beloved buzztouch? http://stackoverflow.com/questions/5046320/a-grid-layout-of-icon-text-buttons
 
Paul Rogers
Android Fan
Profile
Posts: 2524
Reg: May 30, 2011
UK
35,740
like
06/13/13 07:16 AM (12 years ago)
Same here mate, haven't seen you around for a while. Before digging into code, what I'd try first is ignore the bt control panel and just work in eclipse. Add a resolution specific layout folder to the 'res' directory (try layout-xxlarge or layout-sw1280dp) and copy/paste the screen_menuButtons.xml and menu_buttons_item.xml files into it. In menu_buttons_item.xml file, hard code the image height and width into the 'backgroundImageView', so instead of: android:layout_width="wrap_content" android:layout_height="wrap_content" try: android:layout_width="200dp" android:layout_height="200dp" Change 200dp to what button image size you want. And put your button images into a drawable-xhdpi or drawable-xxhdpi folder. I'm guessing that might do it... or more likely, you'll need to do some tweaking. Post back after you've tried it :)
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/13/13 08:30 AM (12 years ago)
@ raveyd, sorry took some time to test your method. My button images I made with 144X144 pixels (I need the images to look sharp on a high density screen). I have changed the layout width & height to 1000dp, but still, it doesn't seems to change the size of the but images. I also created an extra folder drawable-xxhdpi, but android doesn't seems to load any images from here. I have tested on emulator 720X1280 xhdpi and 1080X1920 xxhdpi, images get loads from drawable-xhdpi folder. Cheers Cyrus
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/13/13 08:35 AM (12 years ago)
The background image of my menu button screens also had been squeezed. In BT panel, on scale/position my setting was full screen preserve ratio on an 960dp x 720dp background.
 
Paul Rogers
Android Fan
Profile
Posts: 2524
Reg: May 30, 2011
UK
35,740
like
06/13/13 09:13 AM (12 years ago)
hmmm... from reading around, it looks like a layout folder "layout-xxhdpi" is needed, which pulls images from the regular "drawable-xhdpi" folder and scales them up. Hardcoding dimensions/settings in the xml should override bt settings in the control panel. I'm sure we're on the right track. Do you have the AVD settings for 1280X1920 devices? I'd like to take a better look at this, presumably before too long these'll be standard device specs.
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/13/13 09:38 AM (12 years ago)
@ raveyd, yes I manually added the Sony Xperia Z which is equivalent to Samsung Galaxy S4 AVD emulator http://developer.sonymobile.com/knowledge-base/sdks/sony-add-on-sdk/install-the-sony-add-on-sdk/
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/13/13 09:49 AM (12 years ago)
gonna get some rest, its getting late in Sydney.
 
Paul Rogers
Android Fan
Profile
Posts: 2524
Reg: May 30, 2011
UK
35,740
like
06/13/13 10:08 AM (12 years ago)
Ok mate, thanks for the link. I'll take a look later.
 
Paul Rogers
Android Fan
Profile
Posts: 2524
Reg: May 30, 2011
UK
35,740
like
06/13/13 01:52 PM (12 years ago)
I see what you mean @Cyrus. Buttons are a problem.. More digging...
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/16/13 12:16 AM (12 years ago)
Hey champ, how was digging? Any luck?
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/17/13 03:47 AM (12 years ago)
Hi raveyd, I had a major discovery, if you add drawable-sw430dp to res folder, android would recognise all the images on this folder and display on an 1080X1920 devices. Regard, Cyrus
 
Paul Rogers
Android Fan
Profile
Posts: 2524
Reg: May 30, 2011
UK
35,740
like
06/17/13 04:00 AM (12 years ago)
Excellent Cyrus! Why would that work though? It works, that's the main thing, but it seems a bit like turning a bug into a feature. Gotta love android lol! Great find anyway, I'll be trying it later as I've had no success yet. I've been trying to look at how bt detects small device vs large device in the BT_device.java file, but yours is easier!
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/17/13 04:23 AM (12 years ago)
Thank you raveyd! I'm glad to have some contribution. But the layout I still couldn't get it to work. As per your instruction. I have created layout-sw430dp and copy/paste the screen_menuButtons.xml and menu_buttons_item.xml files into it. I have changed and layout width and height to 300dp instead of wrap content. But it doesn't seems to get affected. The button image display on an 1080X1920 emulator its like a tiny bean to me. https://dl.dropboxusercontent.com/u/20163884/image_button/1.jpg https://dl.dropboxusercontent.com/u/20163884/image_button/2.jpg
 
Paul Rogers
Android Fan
Profile
Posts: 2524
Reg: May 30, 2011
UK
35,740
like
06/17/13 04:44 AM (12 years ago)
Maybe because you can put images into drawable-sw430dp and they show on xxlarge devices, maybe you could change the xml code back to: android:layout_width="wrap_content" android:layout_height="wrap_content" ?????? This is all trial and error!
 
Cyrus_8888
I hate code!
Profile
Posts: 151
Reg: Dec 24, 2011
Sydney
1,610
like
06/17/13 06:21 AM (12 years ago)
Hi raveyd, so do you mean that I just use the BT control panel to set the button size and the margin? I thought about it. But do you know where is problem is? On the buzztouch control panel, to be precise in "Button Size, Options" they were two sections, setting for small device and large device right. The number you put in there is calculated by pixel, not percentage. Therefore, if I do 300 for the button size, I'll have 3 columns and 3 rows nicely presented on a 1080X1920 screen density. But it look awful on a 720 X1080. It became 2 columns and 4 rows and its scrollable. Which is not right. is it? Vice versa to the small device. Unless the button size and margin can set in percentage. Or individual layout format for each screen density.
 
ElDorado
Aspiring developer
Profile
Posts: 41
Reg: Mar 25, 2013
Dallas
410
like
11/14/13 09:16 PM (12 years ago)
@cyrus_8888 - were you able to solve this? I am looking at the right setting to put in the control panel so that it looks good on both the 720x1080 and 1080x1920. If its just a control panel change, please let me know the button sizes.
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.