4

I want to create some kind of row image that looks like that

enter image description here

but I want it to scale with the screen size and density. So reading this http://developer.android.com/guide/developing/tools/draw9patch.html and this http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch I startet creating a Nine-patch image.

But when I import it and use it in my android project it looks like that

enter image description here

As you can see the little black line that was drawn with the draw 9 patch tool is still visible. Why?

Here is the 9.png image

enter image description here

3 Answers 3

7

Are you using the draw9patch tool that comes with the sdk? it is quite handy.
Anyway:

  • It is vital that every pixel except the black ones are completely transparent.
  • The black pixels should be at the absolute top/bottom/left/right of the image.
  • The image should be named filename.9.png.
Sign up to request clarification or add additional context in comments.

9 Comments

I created the image in photoshop as png interlaced image, the background is transparent. I placed the black pixels at the very top/bottom/left/right of the image. still got the black pixels when I run my app
and you did name your image something.9.png, the .9 is very important. You can see if it helps if you import your saved image in draw9patch (android-sdk/tools/draw9patch) and save it out again.
J did "save 9-patch" and just copied into eclipse, the name is row.9.png
I tried using it in a layout, and it worked without problem. The only thing I can think of is that android haven't updated your resource properly. You can try to refresh your res folders, and clean the project (and make sure that you don't have any other files with the same name).
Oh, and by the way, if you do get it to work, you can shrink your image even more, all you really need is the rounded corners and one pixel in the centre to stretch.
|
4

I have found the best and the simplest answer to make 9-patch image.

This is best link to create 9-patch image for all the resolutions - XHDPI, HDPI, MDPI, LDPI in just one click.

Let me know if you have any queries, and do upvote it, if it was helpful to you.

enter image description here

2 Comments

I had created 9 patch image using this link itself, still black lines are visible on my android UI, can you help me how to avoid those black lines on android UI.
that link is now dead, which is why stackoverflow doesn't recommend linking to external sites.
1

If you need an image which consists of a border with rounded corners, I don't have to create a 9-patch.

All you need is an XML like this stored in the res/drawable directory

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <corners android:radius="3.0dp" /> <stroke android:width="2dp" android:color="@color/green" /> </shape> 

Read more about drawable resources

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.