I'm trying to make my layouts more landscape friendly, and a common pattern I have is to add a LinearLayout with some buttons (e.g. OK | Cancel) and just set a value for layout_weight so that the space is evenly distributed. The problem is that when you use a phone or (especially) a tablet in landscape mode, you end up with humongous buttons that look ridiculous. I tried setting maxWidth on the buttons and on the linear layout but to no avail. What would be the easiest way to achieve this? Namely, setting a maximum horizontal size for the view so that it does not grow to the whole width. I tried a bunch of different things, but none worked.
Here's a sample layout:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="6dp"
android:paddingBottom="6dp">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:enabled="false"
android:textStyle="bold"
android:text="#string/button1" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button2" />
</LinearLayout>
Note: I know I can create a new layout file for landscape and do magic there. I want to keep the specialized layout files to a minimum, and I would hope this does not require them.
After messing around quite a bit with relative layouts, I stumbled upon this answer, which is what I ended up using.
I don't have Eclipse here to test it, but I would use a RelativeLayout instead, something like:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<View
android:id="#+id/centerView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
/>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/centerView"
android:enabled="false"
android:textStyle="bold"
android:text="#string/button1"
/>
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/centerView"
android:text="#string/button2"
/>
</RelativeLayout>
As I said, I can't test it right now, but you can work around this idea.
On a side note, unless your layout is very simple, I usually create separate layouts for landscape. It's a little more work, but you can optimize the views much better that way. Specially, if you plan to support larger screens.
<RelativeLayout
android:id="#+id/rlMain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp">
<View
android:id="#+id/vCenter"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerHorizontal="true"
android:layout_marginRight="5dp"
android:layout_marginLeft="5dp"/>
<Button
android:id="#+id/btnOne"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_toLeftOf="#id/vCenter"
<!--Change this for different widths-->
android:minWidth="200dp"/>
<Button
android:id="#+id/btnTwo"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_toRightOf="#id/vCenter"
<!--Change this for different widths-->
android:minWidth="200dp"/>
</RelativeLayout>
Related
I made a custom row layout xml file for a ListView so I could design each row to look how I want, but I'm having trouble actually designing the UI in this xml file. I'm trying to make the the activity ultimately look like this:
As you can see there is a listView with rows, each consisting of a game with a textView as a title, two buttons, and an imageView as the background. I've been doing a lot of research through Google's UI documentation but I can't figure out how to get the elements to appear on top of each other like this while have the row scale perfectly to different screen sizes. The furthest I've gotten is using a FrameLayout to place the different views on top of each other, but from here I cannot place the views in the correct position relative to each other. Any advice on how to do this or where I can find out how to do this?
XML so far (terrible I know):
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|center_horizontal">
<ImageView
android:id="#+id/gameImageID"
android:layout_width="340dp"
android:layout_height="160dp"
android:scaleType="centerCrop"
app:srcCompat="#drawable/overwatch" />
<TextView
android:id="#+id/gameNameID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_gravity="center_horizontal"
android:layout_marginTop="15dp"
android:text="TextView" />
<Button
android:id="#+id/btnJoinLobby"
android:layout_width="88dp"
android:layout_height="wrap_content"
android:onClick="myClickHandlerJoin"
android:text="Join Lobby"
android:layout_gravity="center_horizontal"
android:layout_marginTop="15dp" />
<Button
android:id="#+id/btnCreateLobby"
android:layout_width="102dp"
android:layout_height="wrap_content"
android:onClick="myClickHandlerCreate"
android:text="Create Lobby"
android:layout_gravity="center_horizontal"
android:layout_marginTop="15dp"
android:layout_toEndOf="#+id/gameNameID" />
</RelativeLayout>
Sure that is no problem. Just use weight to handle spacing and you don't need the frame layout just use relative as a root.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|center_horizontal">
<ImageView
android:id="#+id/gameImageID"
android:layout_width="match_parent"
android:layout_height="160dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:scaleType="centerCrop"
app:srcCompat="#drawable/overwatch" />
<TextView
android:id="#+id/gameNameID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_gravity="center_horizontal"
android:layout_marginTop="15dp"
android:text="TextView" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:weightSum="2">
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content">
<Button
android:id="#+id/btnJoinLobby"
android:layout_width="102dp"
android:layout_height="wrap_content"
android:onClick="myClickHandlerJoin"
android:text="Join Lobby"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content">
<Button
android:id="#+id/btnCreateLobby"
android:layout_width="102dp"
android:layout_height="wrap_content"
android:onClick="myClickHandlerCreate"
android:text="Create Lobby"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
You could also just use two nested Relative Layouts with gravity bottom left and bottom right and hold your buttons in there and align buttons to right with margins from side. Also don't use the "endOF" aligning as that will force a left alignment and make larger gaps on the right side of the screen even if you make it look good for one phone it will look bad on another. Aesthetics matter.
Or you could just float your buttons to the bottom left and bottom right with margins from side and make both set to match_parent so they fill the space but use padding to shrink the button look inside the space, but this can get messy. So I prefer the implementation above although some people won't like the extra layouts. It's just a matter of opinion though as the performance diff of using extra nested layouts is so tiny that no one can actually argue performance with a straight face haha.
<RelativeLayout
android:layout_width="340dp"
android:layout_height="160dp"
android:scaleType="centerCrop"
android:background="#drawable/overwatch" >
<TextView
android:id="#+id/gameNameID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_gravity="center_horizontal"
android:layout_marginTop="15dp"
android:text="TextView" />
<Button
android:id="#+id/btnJoinLobby"
android:layout_width="88dp"
android:layout_height="wrap_content"
android:onClick="myClickHandlerJoin"
android:text="Join Lobby"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="15dp" />
<Button
android:id="#+id/btnCreateLobby"
android:layout_width="102dp"
android:layout_height="wrap_content"
android:onClick="myClickHandlerCreate"
android:text="Create Lobby"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="15dp"
android:layout_toEndOf="#+id/btnJoinLobby" />
</RelativeLayout>
Try this. And let me know if that helps.
I found a lot of question were asked on supporting different screen size where the screen size are varies from Tablet to phone and etc. I am writing my first android application and when I am looking at the layout in different phone, All of them are not relatively scalable to screen.
I am pasting a small RelativeLayout code here to understand how to make it proper scalable in less changes. I also followed the android official doc and learn two things
drawable images for different screen
use sp for mentioning text size and for rest of them use dp
But it's not helping me
Code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffd5d6d6">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="48dp"
android:background="#ffffffff"
android:elevation="#dimen/abc_action_bar_default_height_material">
<ImageView
android:id="#+id/back"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_centerVertical="true"
android:layout_marginLeft="16dp"
android:src="#drawable/ic_back" />
<TextView
android:id="#+id/profileDesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Test"
android:textColor="#ff3c3f41"
android:textSize="15dp" />
<ImageView
android:id="#+id/flag"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_alignParentEnd="true"
android:layout_alignParentLeft="false"
android:layout_alignParentStart="false"
android:layout_alignWithParentIfMissing="false"
android:layout_centerVertical="true"
android:layout_marginRight="16dp"
android:src="#drawable/temp_ic_share" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="52dp">
<TextView
android:id="#+id/roommate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="false"
android:layout_centerHorizontal="true"
android:layout_marginTop="40dp"
android:text="Who are you?"
android:textColor="#ff3c3f41"
android:textSize="18dp" />
<Button
android:id="#+id/foodie"
style="#style/Widget.AppCompat.ButtonBar"
android:layout_width="60dp"
android:layout_height="38dp"
android:layout_alignParentStart="false"
android:layout_marginLeft="56dp"
android:layout_marginTop="80dp"
android:background="#fa6425"
android:text="Foodie"
android:textColor="#fff4f4f4"
android:textSize="12dp" />
<Button
android:id="#+id/button4"
style="#style/Widget.AppCompat.ButtonBar"
android:layout_width="80dp"
android:layout_height="38dp"
android:layout_marginLeft="15dp"
android:layout_marginTop="80dp"
android:layout_toEndOf="#+id/foodie"
android:background="#fa6425"
android:text="Beach bum"
android:textColor="#fff4f4f4"
android:textSize="12dp" />
<Button
android:id="#+id/button5"
style="#style/Widget.AppCompat.ButtonBar"
android:layout_width="80dp"
android:layout_height="38dp"
android:layout_alignTop="#+id/button4"
android:layout_marginLeft="15dp"
android:layout_toEndOf="#+id/button4"
android:background="#fa6425"
android:text="Tree hugger"
android:textColor="#fff4f4f4"
android:textSize="12dp" />
</RelativeLayout>
<Button
android:id="#+id/button"
style="#style/Widget.AppCompat.ButtonBar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:background="#fa6425"
android:text="Send"
android:textColor="#fff4f4f4" />
</RelativeLayout>
As you can see that I am including two Parallel RelativeLayout in one main RelativeLayout. here the views on three different size:
nexus one
nexus 5
nexus 6
Best alignment is in Nexus 5 screen. Do I need to create different layout folder i.e. hdpi, mdpi and etc? If I am not wrong then I don't need to because my application is going to run only on phone devices (in portrait mode only).
How can I make scalable screen layouts. Any help would be appreciable :)
If you want to force all the views to have the same ration on screen the only way is to give it a size dynamically after you calculated the ratio between the desired pixels and the screen density, which is not really a solution, What you need to understand is when working with various screen sizes, each one suppose to behave differently, a Tablet screen is expected to be bigger and thus having more room for elements to show up on screen, a phone screen is smaller and less elements should be showed on screen, you need to adjust your view to support all of these screens and the proper way is to write a different layout for tablets and phones, or even different layout by screen dpi.
I am pretty new, I am using Android Studio, is that what you are using? First thing first, if you always want you activity to be in portrait mode, use this code in your manifest, you have to add the code to each activity you want to stay in portrait mode. If you don't, and you don't add code to handle the switch in screen orientation, the phone will likely crash.
<activity
android:name=".TitleActivity"
android:label="#string/title_activity"
android:screenOrientation="portrait" >
</activity>
Instead of a relative view, Try the Linear Layout.
You would have your Main Layout, with a few nested Linear Layouts.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/example">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Title Here"
android:id="#+id/Title"
android:layout_gravity="top|center_horizontal"
android:layout_marginTop="20dp"
android:gravity="center_horizontal"
android:layout_marginBottom="20dp" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginBottom="50dp">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button"
android:layout_weight="1"
android:layout_marginLeft="10dp" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button2"
android:layout_weight="1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button3"
android:layout_weight="1"
android:layout_marginRight="10dp" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:layout_gravity="center_horizontal"
android:background="#drawable/test"
android:layout_margin="50dp" />
</LinearLayout>
This layout has A title Above the three buttons, Then three buttons, then an image view below, it scales from 3.7 to 7.0. Larger than 7, I would make another layout.
You need an image named test in your drawable file.
use this Library will help you to set a Responsive scalable Views for all the devices Layouts
https://github.com/intuit/sdp
irs really easy and simpl just replace.
android:layout_width="50dp"
android:layout_height="60dp"
with.
android:layout_width="50sdp"
android:layout_height="60sdp"
and for textView
android:textSize="60ssp"
instead of. sp
I don't know if you guys use this type of layout for most times but it drives me crazy.
for example when I put a button in the middle of screen and then put a textview near button suddenly IDE reorders them and textview goes on top and button on right.
it can make problems when using too many elements on screen.
since that time I use linear layout but it also has some limitations.
Thanks, I'm new into android development (4 days starting to learn) so I hope you guys can help me.
I rarely use RelativeLayout to be the main layout of a activity. It is recommended to use LinearLayout and set android:weightSum so your app could have a larger support for the screens. As you know there's a huge variety of devices running Android with different screen sizes. Use RelativeLayout only if you want that view in that specific place with that fixed size.
See this example of using LinearLayouts to create a activity with many elements, as your refered:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:baselineAligned="false"
android:padding="#dimen/padding_small"
android:weightSum="3"
tools:ignore="HardcodedText" >
<LinearLayout
android:id="#+id/picker_time_hour"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/picker_time_hour_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/hours"
android:textAppearance="?android:attr/textAppearanceMedium" />
<Button
android:id="#+id/picker_time_hour_up"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:text="+" />
<EditText
android:id="#+id/picker_time_hour_value"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:inputType="number" />
<Button
android:id="#+id/picker_time_hour_down"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:text="-" />
</LinearLayout>
<LinearLayout
android:id="#+id/picker_time_minute"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/picker_time_minute_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/minutes"
android:textAppearance="?android:attr/textAppearanceMedium" />
<Button
android:id="#+id/picker_time_minute_up"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:text="+" />
<EditText
android:id="#+id/picker_time_minute_value"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:inputType="number" />
<Button
android:id="#+id/picker_time_minute_down"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:text="-" />
</LinearLayout>
<LinearLayout
android:id="#+id/picker_time_second"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/picker_time_second_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/seconds"
android:textAppearance="?android:attr/textAppearanceMedium" />
<Button
android:id="#+id/picker_time_second_up"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:text="+" />
<EditText
android:id="#+id/picker_time_second_value"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:inputType="number" />
<Button
android:id="#+id/picker_time_second_down"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/padding_medium"
android:layout_marginRight="#dimen/padding_medium"
android:gravity="center"
android:text="-" />
</LinearLayout>
</LinearLayout>
And the result is:
As you can see my opinion is that you should use LinearLayouts, but read this topic, it can also help you choosing.
To my experience, you should not use the eclipse drag&drop ui builder. It will cause only confusion and problems. It's not yet mature enough (even if it has made a great progress in the last years).
Especially as a beginner, you should work directly with the xml. This will give you a much better understanding of the layouting mechanisms. I don't know a single android developer, who is seriously working with the ide builder.
Relative Layout has proven the most often used Layout for me. Besides the fact that is really customizable (although maybe is less straightforward than LinearLayout) it is also quite "fast". "Fast" means that there is a certain overhead when you use nested LinearLayouts,that you can avoid by using a RelativeLayout. Specifically:
Sticking to the basic features is unfortunately not the most efficient
way to create user interfaces. A common example is the abuse of
LinearLayout, which leads to a proliferation of views in the view
hierarchy. Every view — or worse, every layout manager — that you add
to your application comes at a cost: initialization, layout and
drawing become slower. The layout pass can be especially expensive
when you nest several LinearLayout that use the weight parameter,
which requires the child to be measured twice.
Ok, this problem has been hounding me for about 2 weeks now and with all the research I've done, I still can't figure this out. I have 6 buttons in the form of a pie chart. When I do the layout in the XML, I can make them look fine.
When I change it to a tablet size or another size screen all my buttons move and look horrible.
How do I make these Buttons stationary across any screen size? I know that I will have to have different image sizes in the approriate folders and I plan to do that, but I need to know if there is a way to lock these in a certain position in the XML file or what I need to do to make this work properly. As always any and all help is greatly appreciated and I will answer any questions if I am not clear enough on my question. THANKS
Here is my XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/mainback" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="25dp"
android:background="#drawable/ipadcollegesm" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/button1"
android:layout_alignRight="#+id/button1"
android:layout_marginBottom="92dp"
android:background="#drawable/ipadmusicsm" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/button2"
android:layout_marginLeft="5dp"
android:layout_toRightOf="#+id/button1"
android:background="#drawable/ipadfamilysm" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button3"
android:layout_alignTop="#+id/button1"
android:background="#drawable/ipadyouthsm" />
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button4"
android:layout_below="#+id/button3"
android:layout_marginTop="14dp"
android:background="#drawable/ipadlinkssm" />
<Button
android:id="#+id/button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button5"
android:layout_alignBottom="#+id/button5"
android:layout_toLeftOf="#+id/button4"
android:background="#drawable/ipadpodcastsm" />
</RelativeLayout>
You've provided a fixed dp for each button, different devices have different resolutions.
To make this work on multiple devices with the least amount of work, I'd suggest adding another relative layout as the root, and setting the gravity as center. This way, the layout is always in the center of the screen.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:background="#drawable/mainback">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
*** Your buttons would be here ***
</RelativeLayout>
</RelativeLayout>
Another way is having a dimens file for each screen size, but above is probably the easiest way of doing it.
As, the header says, I'm working on an Android application with a Layout View and two rows of buttons for accomplishing various tasks. One row of buttons is across the top and one is across the bottom, and I like the way that looks.
Now for the unfortunate part: I used a pair of tools you're just not supposed use any more to accomplish this: an AbsoluteLayout, and button locations (and sizes) in px rather than dp or sp.
The thing is, even if I had used more advanced layout tools, I have no idea how I would've placed the set of buttons at the bottom of the screen. And that's for just one screen size, much less a 2nd one (which is what I've got now...)
Now, this isn't ever going to be a publicly-available application, so I'm not terribly worried about universal compatibility, but does anybody have suggestions for a simple layout XML description of one row of 5 buttons across both the top and bottom of the screen (which is fixed in landscape mode)???
Additionally, does anybody know if its possible to locate layout widgets at run time? It's very easy to re-size them, but not to change their locations, as far as I can tell?
Thanks,
R.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout android:id="#+id/linearLayout1" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="top">
<Button android:text="Button" android:id="#+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1"></Button>
<Button android:text="Button" android:id="#+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1"></Button>
<Button android:text="Button" android:id="#+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1"></Button>
<Button android:text="Button" android:id="#+id/button5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1"></Button>
<Button android:id="#+id/button4" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Button" android:layout_weight="1"></Button>
</LinearLayout>
<LinearLayout android:id="#+id/linearLayout2" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="bottom" android:layout_gravity="bottom" android:layout_weight="1">
<Button android:text="Button" android:id="#+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="bottom"></Button>
<Button android:text="Button" android:id="#+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1"></Button>
<Button android:text="Button" android:id="#+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1"></Button>
<Button android:text="Button" android:id="#+id/button5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1"></Button>
<Button android:id="#+id/button4" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Button" android:layout_weight="1"></Button>
</LinearLayout>
</LinearLayout>
There's really no good short answer for your question. Your best bet would be to read of a tutorial that explains and shows you what's going on. I thought that this one was a great starting point for me.
There's a few ways you could accomplish what you're talking about but I'd probably use a RelativeLayout. There's a good explanation of how you can use them on Romain Guy's blog. In short, one set of buttons would each have layout_alignParentTop="true" set, and the others would have layout_alignParentBottom set to true - problem solved. You could also set android:ids on the buttons so you can position them to the left/right of each other with android:layout_toLeftOf/android:layout_toRightOf, or you can stick each set of buttons in a LinearLayout with android:orientation="horizontal".
As far as repositioning elements at runtime, you can definitely do that - but you have to do it via the element's LayoutParams (either creating a new LayoutParams object of the appropriate type and assigning it to the View, or by calling getLayoutParams() and modifying the returned object). For children of a RelativeLayout, see RelativeLayout.LayoutParams.
Yes, this is easy to do using FrameLayout and layout_gravity.
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"/>
...
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"/>
...
</LinearLayout>
</FrameLayout>
Sandwiching a view in between the two button bars may require changing the FrameLayout to LinearLayout and setting the layout_weight on the center view to 1 while not specifying the weight of the button bars.