Question

I am trying to design an application and need to create a very simple menu bar with one image button i have created the image for the button for all the resolutions and an image bar of the same height for all the different resolutions but my problem is the image button which has to sit on top of the plain image is always taller and i cant figure out why, example under hdpi i have the menu bar image 1024×72 and another image for the button 72×72 but when rendered the image button is always larger I’m going crazy trying to find an answer any help would be greatly appreciated.

this is my current not working code

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    android:id="@+id/layout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_menu_menu_bar"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true" />






<ImageButton
    android:id="@+id/new_convo"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/imageView1"
    android:layout_alignParentTop="true"
    android:src="@drawable/ic_menu_new_convo" />

</RelativeLayout>

Answer 1

For a menubar a LinearLayout is the best choice. You have to specify a gradient or a 9-patch for the background, and then using your ImageButtons. On Android there’s no guarantee that the window width is 1024px, so you must change your mindset and approach the UI design in a way different from other mobile platforms. If you provided a sketch of the desired result we could understand (and help) better