ANDROID layout gets messed up from emulator to tablet

I've recently developed an android game using Eclipse. I'm r开发者_开发知识库eally a newbie at this so forgive me if what I will ask is too simple. >.<

The application runs and looks perfectly in the Android emulator installed in Eclipse. However, when we tried to install it in a Samsung Galaxy tab which obviously has a bigger screen than the emulator, the layout gets messed up. Buttons are not in their right order etc. I do have screens using XML layouts and some are simple canvases with sprites. Any idea how I could retain the original layout in the emulator to the tablet? I've tried using RelativeLayout instead of LinearLayout but it still doesn't work.

Any help would be appreciated. Thank you!

One XML file code and it's corresponding screen from emulator shown below.

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
style="@style/MenuLayout" >

<Button android:id="@+id/btnNew"
    android:layout_width="140px"
    android:layout_height="65px"
    android:layout_marginTop="160px"
    android:background="@drawable/newgame"/>
<Button android:id="@+id/btnInst"
    android:layout_width="140px"
    android:layout_height="65px"
    android:background="@drawable/instructions" />
<Button android:id="@+id/btnCredits"
    android:layout_width="140px"
    android:layout_height="65px"
    android:background="@drawable/credits"/>
<Button android:id="@+id/btnExit"
    android:layout_width="140px"
    android:layout_height="65px"
    android:background="@drawable/exit"/> </LinearLayout>

You need to use dpi and not pixels. Here's a good resource. http://developer.android.com/guide/practices/screens_support.html

As others have mentioned, you should be using "dp" instead of "px". These are device independent pixels and will scale to match different screen resolutions.

You should also follow this guide on how to use a folder structure to support different screen resolutions and sizes.

Cheers

Based on your edited question, and on the comments, here is a way to change your layout to a relative one:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     style="@style/MenuLayout"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent">

    <Button android:id="@+id/btnNew"
        android:layout_width="140dip"
        android:layout_height="65dip"
        android:layout_marginTop="160dip"
        android:background="@drawable/newgame" 
        android:layout_centerHorizontal="true" 
        android:layout_above="@+id/btnInst" />

    <Button android:id="@+id/btnInst"
        android:layout_width="140dip"
        android:layout_height="65dip"
        android:background="@drawable/instructions" 
        android:layout_centerHorizontal="true" 
        android:layout_above="@+id/btnCredits"/>

    <Button android:id="@+id/btnCredits"
        android:layout_width="140dip"
        android:layout_height="65dip"
        android:background="@drawable/credits"
        android:layout_centerHorizontal="true" 
        android:layout_above="@+id/btnExit"/>

    <Button android:id="@+id/btnExit"
        android:layout_width="140dip"
        android:layout_height="65dip"
        android:background="@drawable/exit"
        android:layout_centerHorizontal="true" 
        android:layout_alignParentBottom="true" 
        android:layout_marginBottom="25dip"/> 

</RelativeLayout>

Though, if you want a perfect solution, you need to design the buttons and background pictures in 3 sizes, and put them in the respective folders drawable-hdpi, drawable-mdpi and drawable-ldpi(and for tablets, from 2.2, you can also have drawable-xhdpi!). Read carefully this article and test your layout in emulator for as many screens as possible (from ADT 10.0 it is really easy to preview your layout for different configurations directly from Graphical Layout tab in xml).

Also, android:layout_marginTop="160dip" and android:layout_marginBottom="25dip" are not really useful in a Relative Layout. I would suggest you to try a 9-patch picture for your background, with only the wood board stretchable for the buttons (though I am not sure it's working like that). Alternatively, I would have a separate picture with Main Menu, that I'd place above the buttons, and keep in the background only the trees and everything else.

itz better to provide diffrent layout for diffrent screen size . i also have same issue when developing a game.nw its done. u may have provided layout ,so u just provide layout-large,small,and xlarge.and vice verse to ur layouts u must provide drawable folders like hdpi,mdpi,ldpi,xdpi folders and u must save diffrent sized images 58*58,75*75,100*100 for following then u check it u will get it.