Question

I have a screen that I’m trying to layout…

Basically, I’m trying to evenly distribute 4 ImageButton objects vertically on a screen… I used this here to evenly distribute the items, but now am having a terrible time getting the images to scale but maintain aspect ratio… if I use scaleType="centerInside" they don’t scale, if I use “fitXY” they don’t maintain aspect ratio… here is what the layout looks like:

and here is the code:

    <LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" android:layout_margin="0dp"
  android:padding="0dp"
  android:orientation="vertical"
  android:weightSum="5"
  >


        <ImageButton android:id="@+id/share_song" 
            android:layout_width="fill_parent" android:text=""
            android:layout_marginLeft="0dp"
            android:layout_marginTop="15dp"
            android:layout_marginRight="5dp"
            android:layout_marginBottom="5dp"
            android:gravity="left" 
            android:src="@drawable/share_song_button_sel"
            android:adjustViewBounds="true"
            android:background="#0000"
            android:scaleType="fitXY"
          android:layout_height="0dp"
          android:layout_weight="1"
            />
        <Button 
            android:layout_width="wrap_content" 
            android:text="" android:id="@+id/tag_a_song"
            android:layout_marginLeft="5dp"
            android:layout_marginTop="10dp"
            android:layout_marginRight="0dp"
            android:layout_marginBottom="5dp"
            android:gravity="right" 
            android:layout_gravity="right"
            android:background="@drawable/song_check_in_button_sel"
          android:layout_height="0dp"
          android:layout_weight="1"
            />
        <Button android:id="@+id/match_button" 
            android:layout_width="wrap_content" android:text=""
            android:layout_marginLeft="0dp"
            android:layout_marginTop="10dp"
            android:layout_marginRight="0dp"
            android:layout_marginBottom="5dp"
            android:gravity="left" 
            android:background="@drawable/music_match_button_sel"
          android:layout_height="0dp"
          android:layout_weight="1"
            />
        <Button android:id="@+id/friends_button" 
            android:layout_width="wrap_content" android:text=""
            android:layout_marginLeft="0dp"
            android:layout_marginTop="10dp"
            android:layout_marginRight="0dp"
            android:layout_marginBottom="5dp"
            android:gravity="right" 
            android:layout_gravity="right"
            android:background="@drawable/my_friends_music_button_sel"
          android:layout_height="0dp"
          android:layout_weight="1"
            />

        <LinearLayout
          xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="fill_parent"
          android:layout_height="0dp"
          android:layout_weight="1"
          android:orientation="horizontal"
          android:layout_marginRight="0dp"
          android:layout_marginLeft="0dp"
          android:layout_marginTop="0dp"
          android:padding="0dp" 
          >
        <LinearLayout
          xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="fill_parent"
          android:layout_height="65dp"
          android:orientation="horizontal"
          android:layout_marginRight="0dp"
          android:layout_marginLeft="0dp"
          android:layout_marginTop="0dp"
          android:padding="0dp" 
          android:layout_gravity="bottom"
          >
        <ImageView android:src="@drawable/trending_bar"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_gravity="top"
          android:layout_marginRight="0dp"
          android:layout_marginLeft="0dp"
          android:layout_marginTop="10dp"
          android:scaleType="fitXY"/>

            </LinearLayout>
        </LinearLayout> 

</LinearLayout>

Hopefully someone can help.

Answer 1

Set the width of the ImageButtons to fill_parent and use scaletype fitStart for the images that hug the left margin, and fitEnd for the ones on the right. Should do the trick, at least as far as your example image goes. You may have some spacing issues if the proportional width of the images exceed the screen width, but it should work for you.