XML Layout Help

fraser5002 · December 12th, 2011, 04:52 PM

Hi,

Im new to android dev,
Im looking for help with layout for my main.xml file.
I am using a table layout with 3 rows

I want my first row to contain a set of radio buttons (which im using as a segment control)

The bottom row will be 2 buttons side by side .

The middle row will be a webview.

I want the buttons at the top and bot to always be visible and have the webview use whatever height is left. At the moment my bottom buttons are not visible on the screen due to the webview. How can i correct this?

Thanks

Code:

<TableLayout 
android:layout_width="fill_parent" 
android:layout_height="fill_parent" android:stretchColumns="*" 
xmlns:android="http://schemas.android.com/apk/res/android"> 
　
<TableRow >
<com.appname.app.SegmentedRadioGroup android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dip" android:orientation="horizontal" android:id="@+id/segment_text" android:layout_span="2" android:checkedButton="@+id/button_one">
<RadioButton android:id="@id/button_one" android:minWidth="40dip" android:minHeight="33dip" android:text=" Description " android:textAppearance="?android:attr/textAppearanceSmall" android:button="@null" android:gravity="center" android:textColor="@color/radio_colors" /> 
<RadioButton android:id="@+id/button_two" android:minWidth="40dip" android:minHeight="33dip" android:text=" Images " android:button="@null" android:gravity="center" android:textAppearance="?android:attr/textAppearanceSmall" android:textColor="@color/radio_colors" /> 
<RadioButton android:id="@+id/button_three" android:minWidth="40dip" android:minHeight="33dip" android:text=" Audio " android:button="@null" android:gravity="center" android:textAppearance="?android:attr/textAppearanceSmall" android:textColor="@color/radio_colors" /> 
<RadioButton android:id="@+id/button_four" android:minWidth="40dip" android:minHeight="33dip" android:text=" Weblinks " android:button="@null" android:gravity="center" android:textAppearance="?android:attr/textAppearanceSmall" android:textColor="@color/radio_colors" />
</com.appname.app.SegmentedRadioGroup>
</TableRow>  
<TableRow> 　
<WebView
android:id="@+id/webview1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_span="2" >
</WebView>
</TableRow>  
<TableRow>
<Button
android:id="@+id/main_menu_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bot button 1" /> 
<Button
android:id="@+id/scan_exhibit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bot button 2" />
</TableRow>  
</TableLayout>

ScruffyFox · December 13th, 2011, 08:21 AM

You can do this by using a relative layout instead of table rows. What you need to do is to put the content you want to be rendered first, in this case the buttons, at the top of the relative layout, then the content you want to fill the rest of the space at the bottom. Then for the top views you set alignbottominparent to true and it will move it to the bottom. For example:

Code:

<RelativeLayout
        android:layout_width="match_parent"
   	android:layout_height="match_parent"
    >
    	<!-- 
    		This view needs the height to only be as big as it needs to otherwise
			it fills the whole screen    	
    	 -->
    	<LinearLayout 
    		android:layout_width="match_parent"
    		android:layout_height="wrap_content"
    	>
    	    <!--  Your top buttons here -->
    	</LinearLayout>
    	
    	<!-- 
    		This is the view we set the align parent bottom to true, this will force
    		the view to be at the bottom of the screen
    	-->
    	<LinearLayout 
    		android:layout_width="match_parent"
   		android:layout_height="wrap_content"
   		android:layout_alignParentBottom="true"
   		android:id="@+id/container"
    	>
    	    <!--  Your bottom buttons here -->
    	</LinearLayout> 
    	
    	<!-- The webview height and width will need to fill what ever space left, we need to say what content it has to be above aswell -->
    	<WebView 
    		android:layout_width="match_parent"
   		android:layout_height="match_parent"
   		android:layout_above="@id/container"
    	/>
    </RelativeLayout>

Football Fans: Download the 2012 Schedule App from Google Play!