CODEWITHSUNDEEP
androidandroid-layoutandroid-widget
TheOne
TheOne

Reputation: 11161

Right layout for basic android browser

I need to create a basic browser for the android: a WebView a toolbar at the top with a back button, and a toolbar at the bottom with some more buttons.

What would be the best way to go about doing this?

This is what I have so far:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <Button
        android:id="@+id/browserBackButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Back" />

    <WebView
        android:id="@+id/webView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <ImageButton
            android:id="@+id/backButton"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:src="@drawable/back" />

        <ImageButton
            android:id="@+id/forwardButton"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:src="@drawable/forward" />

        <ImageButton
            android:id="@+id/reloadButton"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:src="@drawable/reload" />

        <ImageButton
            android:id="@+id/browserButton"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:src="@drawable/safari" />
    </LinearLayout>

</LinearLayout>

The bottom LinearLayout of buttons doesn't show at all. Only the top back Button and the WebView.

Upvotes: 0

Views: 271

Answers (2)

vortexwolf
vortexwolf

Reputation: 14037

LinearLayout is ok.

You should change the height of the WebView control and set the weight to 1

Do it so:

<WebView android:layout_height="fill_parent" android:layout_weight="1" android:layout_width="fill_parent"

or even so, as it is recommended by the Lint tool:

<WebView android:layout_height="0dip" android:layout_weight="1" android:layout_width="fill_parent"

The weight is important, it forces the view to fill the remaining space.

If it doesn't help, you can also try to set the height of the bottom panel to some constant value, or set the height of image buttons to wrap_content, then you can be sure that it will work.

Upvotes: 1

BlackHatSamurai
BlackHatSamurai

Reputation: 23503

Personally, I don't like doing nested LinearLayouts it can hinder performance when your layouts become more complex. It might not be a big deal for something small; but, it is still good practice to use RelativeLayouts.

Also, lose the xmlns:android="http://schemas.android.com/apk/res/android" in your second LinearLayout. You don't need it.

Hope this helps.

Upvotes: 0

Related Questions