How can i made the layout that will work in both Tablet and phone?

Question

I made the layout from xml with on tablet layout of emulator size. But when open on same layout on android phone device then every thing distorted, So can i make a xml layou

Answer 1

Use Tables and weights to create the same or similar aspect ratio on a phone that would be on a tablet. I would only create different Layouts as a last resort.

<TableRow
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight=".33" >
             //Note: You will need some other TableRows fill in the difference of this Table Row..2 more of the same will equal 1.
        <TextView
            android:id="@+id/x"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_marginLeft="3dp"
            android:layout_weight=".33"
            android:background="@drawable/buttonx"
            android:gravity="center"
            android:text="Words"
            android:textColor="#ffffff"
            android:textSize="16sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/x2"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_marginLeft="3dp"
            android:layout_weight=".33"
            android:background="@drawable/buttonx2"
            android:gravity="center"
            android:text="Other Words"
            android:textColor="#ffffff"
            android:textSize="16sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/x3"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_marginLeft="3dp"
            android:layout_weight=".33"
            android:background="@drawable/buttonx3"
            android:gravity="center"
            android:text="More Words"
            android:textColor="#ffffff"
            android:textSize="16sp"
            android:textStyle="bold" />

    </TableRow>

Answer 2

Make two separate layout for mobile or tablet just go your default layout design and click on orientation for preview and after click on create tablet variation. And after will see two layout for tab and mobile this is a easiest.

Answer 3

You can create two seperate layout for your phone and Tab. What you need to do is create a layout file with "filename" for phone and for tab create a layout file by right clicking project and selecting new>android xml layout file> and then type a "filename", click next and select Size from the right pane and select x-large from drop down list. Your layout file for tab is created separately so customise your layout seperately.

Answer 4

Make your resource like this.

res/layout/my_layout.xml // layout for normal screen size ("default")

res/layout-small/my_layout.xml // layout for small screen size

res/layout-large/my_layout.xml // layout for large screen size

res/layout-xlarge/my_layout.xml // layout for extra large screen size

res/layout-xlarge-land/my_layout.xml // layout for extra large in landscape orientation

res/drawable-mdpi/my_icon.png // bitmap for medium density

res/drawable-hdpi/my_icon.png // bitmap for high density

res/drawable-xhdpi/my_icon.png // bitmap for extra high density

For more reference. reference1.

Add this in your manifest.xml

<supports-screens
            android:smallScreens="true"
            android:normalScreens="true"
            android:largeScreens= "true"
            android:anyDensity="true"
    />

Hope this will help you.