Full-Screen Android Layout with 2 Rows
I'm a complete beginner with Android Development and I'm trying to do something which I feel should be simple but doesn't seem to be (for me, anyway). The awesome ascii art below demonstrates they layout I'm trying to achieve:
---------------------
| |
| |
| |
| |
| |
| Main View |
| |
| |
| |
| |
| |
---------------------
||btn a| |btn b||
---------------------
The whole layout should fill the screen with the bottom row being docked to the bottom of the screen (gravity?) and the top row taking up the rest of the screen and it should be fluid (i.e. if the device orientation is changed it would look like this:
---------------------------
| |
| |
| Main View |
| |
| |
---------------------------
||btn a| |btn b||
---------------------------
If I were working in HTML this would be easily done with a TABLE element, two TR elements (the first with a rowspan of 2) and a couple of TD elements in the second row (the second having an align value set to right). (For the web UI guys reading this, I would use DIV elements and CSS for layout in practice).
So, my problem is getting the first row to fill the available height. I could write a simple algorithm that does this in the java code but would prefer to work with the XML for layout. Is there any easy way to do this? My code is as follows:
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1">
<TableRow>
<WebView android:id="@+id/site"
android:layout_span="3" />
</TableRow>
<TableRow>
<Button android:id="@+id/back"
android:text="btn a" />
<View android:id="@+id/filler" />
<Button
aroid:id="@+id/forward"
开发者_C百科 android:text="btn b" />
</TableRow>
</TableLayout>
Weight is the correct choice, try this out (Tested)
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1">
<LinearLayout android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:id="@+id/linearLayout2"
android:layout_weight="1">
<WebView android:layout_height="wrap_content"
android:id="@+id/site"
android:layout_width="wrap_content" />
</LinearLayout>
<LinearLayout android:id="@+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button android:layout_weight="2"
android:text="Button"
android:id="@+id/button1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"></Button>
<Button android:layout_weight="2"
android:text="Button"
android:id="@+id/button2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"></Button>
</LinearLayout>
</TableLayout>
I haven't tested it, but this should work in theory. Will look into it as soon as I get back to computer :)
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
>
<Button
android:id="@+id/btna"
android:layout_height="42dp"
android:layout_width="wrap_content"
android:layout_weight="1"
android:text="Button A""
/>
<Button
android:id="@+id/btnb"
android:layout_height="42dp"
android:layout_width="wrap_content"
android:layout_weight="1"
android:text="Button B"
/>
</LinearLayout>
</RelativeLayout>
You could try ditching the TableLayout and setting a weight on the webview:
<WebView
android:id="@+id/site"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
(**Button, filler View, Button go here**)
</LinearLayout>
I haven't tested this, but it should be close.
Using RelativeLayout seems like overkill to me, and layout_alignParentBottom
can't always be trusted.
Try:
<?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">
<WebView android:id="@+id/site"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:id="@+id/btna"
android:layout_height="42dp"
android:layout_width="wrap_content"
android:text="Button A">
<View android:id="@+id/filler"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>
<Button
android:id="@+id/btnb"
android:layout_height="42dp"
android:layout_width="wrap_content"
android:text="Button B"/>
</LinearLayout>
</LinearLayout>
You can do a lot with LinearLayout and layout_weight
.
精彩评论