6

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>
Northern Captain
  • 1,147
  • 3
  • 25
  • 32

2 Answers2

6

You can use:

android:adjustViewBounds="true"

and set fill_parent to height for example

<ImageView 
...
android:layout_height="fill_parent"
...>

adjustViewBounds for my details

coffee
  • 3,048
  • 4
  • 32
  • 46
2

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.

Mister Smith
  • 27,417
  • 21
  • 110
  • 193
  • Again, the effect is the same. As I tried to explain, I can not use parents sizes because on 480x800 ratio = 1.66 and on 480x854 ratio = 1,77 but I need to keep layout always in 1.5 ratio and fill the lowest size of the screen. – Northern Captain Jul 08 '11 at 12:57
  • @Northern Captain: Don't use absolute values in pixels, try relative values as I told you above. The alignment part is not achievable just with weight, you should look to gravity or use RelativeLayout to fit your requirements. – Mister Smith Jul 08 '11 at 13:00
  • If I remove layout_width and height from children then they disappear. – Northern Captain Jul 08 '11 at 13:00
  • I do not use pixels at all, I mention them only as example. The layout I presented here is simplified and I doubt I can use relative layout for my whole layout. – Northern Captain Jul 08 '11 at 13:04
  • Don't remove them, just don't use absolute values. Use wrap_content on height and fill_parent in width. – Mister Smith Jul 08 '11 at 13:05
  • I edited the post to reflect your advice, but there is no effect that I want to achieve. – Northern Captain Jul 08 '11 at 13:25
  • Sometimes it takes a bit of playing to get the dessired effect, but there's no impossible GUI, specially on Android. Try starting first gluing the two images, perhaps tunning gravity. Once you get that, start with scaling. Scaling can be performed on the image views or in the container views. If you find this difficult, and the two images are not expected to change independently, you can always combine the two images with an external editor, so you have to scale just one instead of two. – Mister Smith Jul 11 '11 at 06:17