Android Development: building my app to fit different types of smartphone

Question

My app consists off buttons on a screen with some text. Its really simple as that's all it needs to be.

But when I test my app in different virtual phones it looks different. Now as I'm not using images I'm assuming that as long as my images are in the drawable folder and not all accommodated in different drawable- * * folders that they won't be an issue.

But how do I code the XML to fit all SMARTPHONE screens.

XML:

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

    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:padding="@dimen/padding_medium"
        android:text="@string/welsh_libs"
        android:textColor="#FF0066"
        android:textSize="30dip"
        android:textStyle="bold"
        tools:context=".WelshLibraries" />

</LinearLayout>

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

    <Button
        android:id="@+id/button2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="18dp"
        android:background="#6088A1"
        android:textColor="#FFFFFF"
        android:text="@string/news" />

    <Button
        android:id="@+id/button3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="18dp"
        android:background="#50C0E9"
        android:textColor="#000000"
        android:text="@string/find_lib" />

    <Button
        android:id="@+id/button4"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="18dp"
        android:background="#6088A1"
        android:textColor="#FFFFFF"
        android:text="@string/free_res" />

    <Button
        android:id="@+id/button5"
        android:layout_width="285dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="18dp"
        android:background="#50C0E9"
        android:text="@string/ask_lib"
        android:textColor="#000000" />

    <Button
        android:id="@+id/button6"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="18dp"
        android:background="#6088A1"
        android:text="@string/find_book"
        android:textColor="#FFFFFF" />

    <Button
        android:id="@+id/button7"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="18dp"
        android:background="#50C0E9"
        android:text="@string/register"
        android:textColor="#000000" />

    <Button
        android:id="@+id/button8"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="18dp"
        android:background="#6088A1"
        android:text="@string/login"
        android:textColor="#FFFFFF" />

</LinearLayout>

<ImageView
    android:id="@+id/image1"
    android:layout_width="190dp"
    android:layout_height="0dip"
    android:layout_marginBottom="5dp"
    android:layout_marginLeft="70dp"
    android:layout_weight="1"
    android:contentDescription="@string/desc"
    android:src="@drawable/waglogo"
    android:visibility="visible" />

I'm using dp's as the measurement unit but I understand to be the only units possible to use so I know its not like designing a website with pxs, ems and %s available.

Any help or links people can provide would be much appreciated. Thanks, Dan

PS I'm also looking for a way to scroll down if I want to add more buttons below the 8 present when the app loads. Any ideas?

Answer 1

See the official Android Developers site, if you have not done that already. It has an article about supporting different screens: http://developer.android.com/guide/practices/screens_support.html .

Also surround with a ScrollView your LinearLayout containing the buttons if you want to scroll the buttons. Something like this:

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

<TextView
    android:id="@+id/textView1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:padding="@dimen/padding_medium"
    android:text="@string/welsh_libs"
    android:textColor="#FF0066"
    android:textSize="30dip"
    android:textStyle="bold"
    tools:context=".WelshLibraries" />

   </LinearLayout>

<ScrollView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content">

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

<Button
    android:id="@+id/button2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="18dp"
    android:background="#6088A1"
    android:textColor="#FFFFFF"
    android:text="@string/news" />

<Button
    android:id="@+id/button3"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="18dp"
    android:background="#50C0E9"
    android:textColor="#000000"
    android:text="@string/find_lib" />

<Button
    android:id="@+id/button4"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="18dp"
    android:background="#6088A1"
    android:textColor="#FFFFFF"
    android:text="@string/free_res" />

<Button
    android:id="@+id/button5"
    android:layout_width="285dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="18dp"
    android:background="#50C0E9"
    android:text="@string/ask_lib"
    android:textColor="#000000" />

<Button
    android:id="@+id/button6"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="18dp"
    android:background="#6088A1"
    android:text="@string/find_book"
    android:textColor="#FFFFFF" />

<Button
    android:id="@+id/button7"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="18dp"
    android:background="#50C0E9"
    android:text="@string/register"
    android:textColor="#000000" />

<Button
    android:id="@+id/button8"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="18dp"
    android:background="#6088A1"
    android:text="@string/login"
    android:textColor="#FFFFFF" />

 </LinearLayout>

 </ScrollView>

<ImageView
android:id="@+id/image1"
android:layout_width="190dp"
android:layout_height="0dip"
android:layout_marginBottom="5dp"
android:layout_marginLeft="70dp"
android:layout_weight="1"
android:contentDescription="@string/desc"
android:src="@drawable/waglogo"
android:visibility="visible" />