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.
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.
After messing around quite a bit with relative layouts, I stumbled upon this answer, which is what I ended up using.
<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>