Android - Support different screen size

Question

I've already seen this thread but it says things that I already know.

My problem is that my layout stretches in a wrong way in different sized phones, but seems like setting different layout folders (layout-small/medium/large) don't work.

Here's the layout seen on a large, medium and small screen: https://i.stack.imgur.com/UgE4y.jpg

As you can see the main problem are the true and false button. Here's the xml file:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.quizone_v3.GameActivity1$PlaceholderFragment" >

<!-- Body -->

<Button
    android:id="@+id/btn_true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/btn_false"
    android:layout_alignLeft="@+id/g3"
    android:layout_alignParentRight="true"
    android:layout_alignTop="@+id/btn_false"
    android:layout_marginLeft="-10dp"
    android:background="@drawable/btn_true_bg"
    android:src="@drawable/barra_dx" />

<ImageView
    android:id="@+id/question_bar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginLeft="10dp"
    android:layout_marginTop="15dp"
    android:layout_marginRight="10dp"
    android:adjustViewBounds="true"
    android:src="@drawable/question_bar" />

<TextView
    android:id="@+id/question_tv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/question_bar"
    android:layout_alignRight="@+id/question_bar"
    android:layout_alignTop="@+id/question_bar"
    android:layout_marginLeft="2dp"
    android:layout_marginRight="13dp"
    android:layout_toRightOf="@+id/question_number"
    android:gravity="center"
    android:text="Allin v2"
    android:textColor="@android:color/primary_text_dark" />

<Button
    android:id="@+id/btn_false"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/info_tv"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/question_tv"
    android:layout_marginBottom="30dp"
    android:layout_marginTop="15dp"
    android:layout_marginRight="-10dp"
    android:layout_toLeftOf="@+id/g4"
    android:adjustViewBounds="true"
    android:background="@drawable/btn_false_bg"
    android:src="@drawable/barra_sx" />

<ImageView
    android:id="@+id/question_number"
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:layout_alignParentLeft="true"
    android:layout_alignTop="@+id/question_tv"
    android:layout_marginLeft="5dp"
    android:layout_marginTop="-7dp"
    android:src="@drawable/nr_domanda_1" />

<!-- Info -->

<ImageView
    android:id="@+id/line_invi"
    android:layout_width="280dp"
    android:layout_height="1dp"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="42dp"
    android:visibility="invisible"
    android:src="@drawable/linea" />

<TextView
    android:id="@+id/info_tv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/info_btn"
    android:layout_alignRight="@+id/line_invi"
    android:layout_alignTop="@+id/info_btn"
    android:layout_toRightOf="@+id/info_btn"
    android:layout_marginLeft="20dp"
    android:text="TextView" />

<!-- Progression -->

 <ImageView
    android:id="@+id/line"
    android:layout_width="280dp"
    android:layout_height="1dp"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="42dp"
    android:src="@drawable/linea" />

<ImageView
    android:id="@+id/g2"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g1"
    android:layout_marginRight="18dp"
    android:layout_toLeftOf="@+id/g3"
    android:src="@drawable/g2" />

<ImageView
    android:id="@+id/v2"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g1"
    android:layout_marginRight="18dp"
    android:layout_toLeftOf="@+id/g3"
    android:visibility="gone"
    android:src="@drawable/v2" />

<ImageView
    android:id="@+id/r2"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g1"
    android:layout_marginRight="18dp"
    android:layout_toLeftOf="@+id/g3"
    android:visibility="gone"
    android:src="@drawable/r2" />

<ImageView
    android:id="@+id/g3"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g4"
    android:layout_centerHorizontal="true"
    android:src="@drawable/g3" />

<ImageView
    android:id="@+id/v3"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g4"
    android:layout_centerHorizontal="true"
    android:visibility="gone"
    android:src="@drawable/v3" />

<ImageView
    android:id="@+id/r3"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g4"
    android:layout_centerHorizontal="true"
    android:visibility="gone"
    android:src="@drawable/r3" />

<ImageView
    android:id="@+id/g1"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/line"
    android:layout_marginRight="18dp"
    android:layout_marginTop="9dp"
    android:layout_toLeftOf="@+id/g2"
    android:src="@drawable/g1" />

<ImageView
    android:id="@+id/v1"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:visibility="gone"
    android:layout_alignTop="@+id/line"
    android:layout_marginRight="18dp"
    android:layout_marginTop="5dp"
    android:layout_toLeftOf="@+id/g2"
    android:src="@drawable/v1" />

<ImageView
    android:id="@+id/r1"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/line"
    android:layout_marginRight="18dp"
    android:layout_marginTop="5dp"
    android:visibility="gone"
    android:layout_toLeftOf="@+id/g2"
    android:src="@drawable/r1" />

<ImageView
    android:id="@+id/g4"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_marginLeft="18dp"
    android:layout_alignTop="@+id/g5"
    android:layout_toRightOf="@+id/g3"
    android:src="@drawable/g4" />

<ImageView
    android:id="@+id/v4"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_marginLeft="18dp"
    android:layout_alignTop="@+id/g5"
    android:layout_toRightOf="@+id/g3"
    android:visibility="gone"
    android:src="@drawable/v4" />

<ImageView
    android:id="@+id/r4"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_marginLeft="18dp"
    android:layout_alignTop="@+id/g5"
    android:layout_toRightOf="@+id/g3"
    android:visibility="gone"
    android:src="@drawable/r4" />

<ImageView
    android:id="@+id/g5"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g2"
    android:layout_marginLeft="18dp"
    android:layout_toRightOf="@+id/g4"
    android:src="@drawable/g5" />

<ImageView
    android:id="@+id/v5"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g2"
    android:layout_marginLeft="18dp"
    android:layout_toRightOf="@+id/g4"
    android:visibility="gone"
    android:src="@drawable/v5" />

<ImageView
    android:id="@+id/r5"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_alignTop="@+id/g2"
    android:layout_marginLeft="18dp"
    android:layout_toRightOf="@+id/g4"
    android:visibility="gone"
    android:src="@drawable/r5" />

<ImageView
    android:id="@+id/info_btn"
    android:layout_width="75dp"
    android:layout_height="75dp"
    android:layout_above="@+id/line_invi"
    android:layout_alignLeft="@+id/line_invi"
    android:layout_marginBottom="31dp"
    android:src="@drawable/ic_info" />

</RelativeLayout>

Do you know how can I fix this problem? Thank you in advance!

i haven't tried it but here is an idea,have you tried for instance to work with sizes that you will give for start and programaticlly scale them up or down if necessary by screen size,for example: if most devices are 480x800 and your user's device size is 800x1280 just divide 1280/800(height) 800/480(width) and multiply by the scales that you got from dividing the heights and widths,if it will work for you i could try with code. — user1779374, Jun 19 '14 at 15:29

score 0 · Answer 1 · answered Jun 19 '14 at 15:36

0

One easy way is to put your Relative Layout in a ScrollView.

answered Jun 19 '14 at 15:36

Zsombor

41
1
5

Android - Support different screen size

1 Answers1