Search code examples
androidimage-scaling

android layout scaling with fixed aspect ratio on different phones


I have a layout with two ImageView inside. Each image has a fixed aspect ratio, for example first image is 320x160, second is 320x320. Layout is aligned vertically. I want this two images be glued together and scale to fit one of the screen sides (width or height) and scale the other side proprotionally. I tried to use scaleType=fitCenter, but the problem is that on different phones with different aspect ratio, images are not together, there is a black area between them. It seems that I can not use layout:weight because the screens have different ratio (480x854 and 480x800) and I need my layout stays the same scaled proportion.

Any help is appreciated.

Here is my layout for now:

<LinearLayout 
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ImageView android:src="@drawable/im_menu"
 android:adjustViewBounds="true"
 android:scaleType="fitCenter"
 android:layout_width="fill_parent" android:layout_height="wrap_content"
 android:layout_gravity="center_horizontal|top"
 android:layout_weight="0.7"
>
</ImageView>
<ImageView android:src="@drawable/im_field" 
 android:adjustViewBounds="true"
 android:scaleType="fitCenter"
 android:layout_width="fill_parent" android:layout_height="wrap_content"
 android:layout_gravity="center_horizontal|top"
 android:layout_weight="0.3"
>
</ImageView>
</LinearLayout>

Solution

  • You can use layout weight with relative values too. For example, if you want a field with 30% and other with 70%, just set the children views weight with 0.3 and 0.7, and don't specify width nor height in children. It is explained in the developer guide (tip section):

    developer guide - linear layout

    Also you may have to use RelativeLayout instead of LinearLayout.