9-patch drawable behaving badly, weird artefacts - what is wrong here?

问题

so Im trying out the 9-patch images. I started out with a PNG-file where I have a semi-transparent square with rounded corners:

Then, I created the 9-patch, like this (note the little dot on top and to the left):

I thought that was enough to handle this, but when adding this 9-patch to Eclipse, I get weird results.

Result nbr 1

Based on this XML:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout6"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/taxibg3"
    android:orientation="vertical" >

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@drawable/login_square" />
</LinearLayout>

I get this result:

Result nbr 2

Based on this XML:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout6"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/taxibg3"
    android:orientation="vertical" >

    <ImageView
        android:layout_width="300dp"
        android:layout_height="158dp"
        android:background="@drawable/login_square" />

</LinearLayout>

I get this result:

I have also tried to make the "9-patch-lines" on the top and left longer, but that also gives weird artefacts.

Any ideas?

-- EDIT --

I also tried with this 9-patch (screen-shot from 9patch-tool):

which gives this bad result (note the black lines):

---- EDIT 2 ----

Leonidos told me that the 9-patch was too big, and that they cannot decrease in size. So I tried that out, with equally bad results.

This is the 9-patch (download the file here)

and this is how it looks (notice the black lines):

--- EDIT 3 ---

I took a look at "show bad patches" in the pathtoo, and this is what is shows:

But it doesnt really matter. If I change it so it looks like this:

I still get the black stripes!

Oh why oh why!? =)

回答1:

Make it small as possible. 9-patch cant shrink they can stretch. Fill right and bottom border with black color. Edit 9-patch borders with draw9patch tool to prevent errors. Your 9-patch should look similar to this one.

回答2:

Try to do 9-patch markings from all 4 sides. Also make sure you have .9.png file extension (f.i. your_cool_pic.9.png)

Here is my example

回答3:

The 1 pixel border must be either completely black (nine patch markers) or completely transparent. Basically, edit the image to cut out anything in the 1 pixel border except for the two black dots.

Also, your image can be much, much smaller in size. The point of a nine patch is that the markers on the top and left sides mark what is to be stretched. Most of that content with straight edges could be removed.

来源：https://stackoverflow.com/questions/14270042/9-patch-drawable-behaving-badly-weird-artefacts-what-is-wrong-here

标签

android

android-layout

nine-patch