common UI for all the device irrespective of size

290 views Asked by At

My application works fine on the handset but when I am running it onto the TAB UI becomes too small.But I want size of the UI to be relative to the size of device. Do I need to add anything in manifest .Whats wrong I am doing.Here is My XML

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" 
android:orientation="vertical">

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Select The Game Level" />

<Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Level1" />

<Button
    android:id="@+id/button2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="level2" />

<Button
    android:id="@+id/button3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="level3" />
 </LinearLayout>
Handset UI appearence

Handset UI appearence

Tablet UI appearence

Tablet UI appearence

1

There are 1 answers

2
Vaiden On BEST ANSWER

Let's try and explore your presumptions here:

  1. Your buttons size is set to "wrap_content". Meaning that it's dependant on the size of the text it wraps.

  2. You want your buttons to change visual size depending on the visual size of the screen your displaying your app on.

  3. Therfore: you're basically expecting the font size to change depending on your devices's screen.

I do not feel this is the right approach in achieving what you want. There are several tools that can help you here, let's explore one: the weight attribute: What does android:layout_weight mean?

Here is an example of an array of buttons, that would look visually similar on any screen (the emphasize is on "similar" here. But this is what you're trying to achieve):

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/btnMainMenuTestUSB"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Button1" />

        <Button
            android:id="@+id/btnMainMenuSetLocationNew"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Button2" />
    </LinearLayout>

     <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/btnLineOfSight"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Button3" />

               <Button
            android:id="@+id/btnTargetScreen"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Button4" />
    </LinearLayout>