Abnormal header bar in high screen resolution

Question

I have developed app, the header bar appear as normal according to expectation. But when the same application installed on the screen with higher resolution it header bar does not appear properly.

Following the layout code for header bar

 *<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/header_bg"
android:shrinkColumns="1"
android:stretchColumns="1" >
<TableRow
    android:gravity="center"
    android:minHeight="45dp" >
    <ImageButton
        android:id="@+id/btnTopLeft"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="20dp"
        android:padding="15dp"
        android:background="@drawable/back_bg"
        android:onClick="onClickBackButton" />
    <TextView
        android:id="@+id/txtHeader"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="3"
        android:ellipsize="end"
        android:gravity="center|center_vertical|center_horizontal"
        android:lines="1"
        android:scrollHorizontally="true"
        android:shadowColor="#ffffff"
        android:shadowDx="1"
        android:shadowDy="1"
        android:shadowRadius="1"
        android:singleLine="true"
        android:textSize="18sp"
        android:textStyle="bold" />
    <Button
        android:id="@+id/btnTopRight"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_marginBottom="5dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="5dp"
        android:layout_weight="1"
        android:background="@drawable/button_bg"
        android:onClick="onClickTopRightButton"
        android:textColor="#ffffff"
        android:visibility="invisible" />
</TableRow>
</TableLayout>*

Please tell what I can do regarding this issue ?

Thanks in Advance

Answer 1

Your header bar background is probably stretching because it is tied to the TableLayout.

One way of solving that would be using 9 Patch images. You can learn more about on this link.

Other way is just by placing an image with higher resolution on the res/hdpi/ folder. The problem is that it would still stretch when using a screen with different proportions, like a Square screen.