CODEWITHSUNDEEP
android
silverburgh
silverburgh

Reputation: 9589

Layout Question. How can I layout 1 image view on top, 1 image on bottom

I have a vertical LinearLayout. I would like to layout 1 ImageView on top and 1 ImageView at the bottom of that LinearLayout. I tried putting 'android:gravity="top"' and 'android:gravity="bottom"' in each of the ImageView, but both ImageView appears at the top of the LinearLayout. Is there a way to fix it?

Thank you.

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

   <ImageView
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/icon"
        android:gravity="top" />

   <ImageView
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/icon"
        android:gravity="bottom" />
   </LinearLayout>

Upvotes: 4

Views: 3615

Answers (2)

Jeremy Logan
Jeremy Logan

Reputation: 47514

I agree with Erich WRT using a RelativeLayout. However, if you DO want to use a LinearLayout you should just need to tell it to "linearly" align thing vertically, instead of horizontally. You had the bit in there (android:orientation="vertical") so you should be able to drop the gravitys... this should work:

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

    <ImageView
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/icon" />

    <ImageView
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/icon" />
</LinearLayout>

If, instead, you're trying to make the layout take up the whole screen and have one image at the top of the screen and one at the bottom you'll need something more like (untested):

<LinearLayout
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <ImageView
        android:id="@+id/button1"
        android:layout_height="0dip"
        android:layout_weight="1"
        android:src="@drawable/icon" />

    <ImageView
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/icon" />
</LinearLayout>

This basically tells it to stretch the first one to fill the parent while leaving enough room for the second to wrap it's content.

Upvotes: 0

Erich Douglass
Erich Douglass

Reputation: 52002

The easiest way to do this is with RelativeLayout. Replace your LinearLayout with RelativeLayout and change the first ImageView to use android:layout_alignParentTop="true" and the second one to use android:layout_alignParentBottom="true".

Upvotes: 2

Related Questions