Search code examples
androidnine-patch

Why my 9 patch not working properly?


i have the a 9 patch image with a magnifying glass icon on the right side for my search box,

the problem is, the image doesn't fit well while i put it as background for my edittext. (i can't upload the screenshoot yet)

the magnifying glass icon didn't work as expected, the icon got shrunk there. can someone help me fix this?

here my XML code :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ListFoodActivity"
android:padding="10dp"
android:background="@drawable/bcground"
android:src="@drawable/bcground" >

<TextView
    android:id="@+id/textView1"
    android:layout_width="100dp"
    android:layout_height="30dp"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginTop="10dp"
    android:layout_marginLeft="5dp"
    android:text="Food"
    android:textSize="20sp"
    android:textStyle="bold" />

<EditText
    android:id="@+id/editText1"
    android:layout_width="150dp"
    android:layout_height="40dp"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:layout_toRightOf="@+id/textView1"
    android:background="@drawable/search"
    android:hint="Search"
    android:textSize="20sp"
    android:textStyle="bold" />

here the 9 patch image :

enter image description here

and the image of the emulator :

enter image description here

sorry for the bad english :(


Solution

  • The problem is the 9 patch itself: it's malformed.
    The black line on the left side is simply WRONG (it "touches" the lens).
    It should be a single pixel near the lower part, so that its prolongation doesn't touch the lens.

    This is it

    enter image description here

    Note that the lens will be up-right aligned.
    If you want it centered, you have to add another black pixel near the upper left border (but you have to replace some pixels near the upper lens frame, too).

    Also not thet you don't need the horizontal part being that wide, you can make it much narrower, to save on the final patch size.