CODEWITHSUNDEEP
androidlayout
hqt
hqt

Reputation: 30284

LinearLayout : design two views : one at left screen and one at right screen

I have a LinearLayout, in that there is a spinner and a imagebutton. I want that spinner is on left screen and image button is on right screen (and both in same screen). Here is my layout:

<LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:orientation="horizontal">

        <Spinner
            android:layout_height="wrap_content"
            android:layout_width="fill_parent"
            android:layout_alignParentTop="true"
            android:id="@+id/spinner_method_list"></Spinner>

        <ImageButton
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/ic_menu_refresh"/>

    </LinearLayout>

At above code, I think make ImageButton with layout_weight is 1 will work, but in fact, don't. Please tell me how to design this layout please.

Thanks :)

Upvotes: 0

Views: 388

Answers (1)

codeMagic
codeMagic

Reputation: 44571

First of all, android:layout_alignParentTop="true" is not a property of LinearLayout only RelativeLayout. Second, when using layout_weight in a horizontal LinearLayout, the layout_width should be 0dp and layout_height should be 0dp in a vertical LinearLayout.

Using a LinearLayout, one way to achieve this would be to give each View here a layout_weight of, say, 1 then create a second View in the middle that has a weight of maybe 2 but you would need to play with those to get exactly what you want.

<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="horizontal">

    <Spinner
        android:layout_height="wrap_content"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:id="@+id/spinner_method_list"/>

    <View
        android:layout_height="match_parent"
        android:layout_width="0dp"
        android:layout_weight="2"/>

    <ImageButton
        android:layout_height="wrap_content"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:background="@drawable/ic_menu_refresh"/>

</LinearLayout>

A possibly better way would be to use a RelativeLayout and use its properties alignParentLeft and alignParentRight. Something like

<RelativeLayout
    android:layout_height="wrap_content"
    android:layout_width="match_parent">

    <Spinner
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_alignParentLeft="true"   <!-- here  -->
        android:id="@+id/spinner_method_list"/>

    <ImageButton
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:background="@drawable/ic_menu_refresh"
        android:layout_alignParentRight="true"/>    <!-- and here  -->

</RelativeLayout>

If you want them each to take up half of the screen then you could just give each a layout_weight of "1" and a layout_width of "0dp".

Upvotes: 2

Related Questions