9

In a 9patch png, there are black edges in its four sides, but there is usually difference between the left to right, and the up to down side. Why? How does this difference impact?

Valentin Rocher
  • 11,667
  • 45
  • 59
Yunfei Tang
  • 496
  • 2
  • 6
  • 11

3 Answers3

20

One of simplest ans is this pic

draw the black line according to your requirement using nine patch tools.

Akram
  • 7,548
  • 8
  • 45
  • 72
7

The left and top are for scaling, and the right and bottom are for content. So the black lines on left and top will scale to fit, and the content for a button will be "inside" the black lines on the right and bottom.

Espen
  • 3,607
  • 11
  • 48
  • 75
3

Here http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch you can find a very good explanation, with images to show you that the left and top part of the black border indicate a stretchable section, while the right and bottom lines define the drawable area, where you can put your content.

Adinia
  • 3,722
  • 5
  • 40
  • 58
  • @Adinia, so the 9patch differs from the scaling of a simple png bitmap by being able to apply these extra padding and scale regions within the image? – Vass Feb 22 '12 at 14:51
  • @Vass Yes, with a 9patch you can define yourself the scaling regions of the picture and 'protect' from scaling some parts of it, instead of scaling all the png. – Adinia Feb 22 '12 at 15:34
  • @Adinia, the padding is optional; as if it is the default extra x&y points of extra space around the stretchable region? So in the environment of excessive or too little space the padding protects the image from becoming smaller? (is that correct?) – Vass Feb 22 '12 at 15:49
  • 1
    @Vass The padding is optional indeed and has no impact over the image size, but over it's content size(in the example at the link, the padding define the zone that can be occupied by the text, inside the button) – Adinia Feb 22 '12 at 16:20