Do you know the "point nine" in Android?

"Point Nine" is a special form of image in the application development of the Android platform, the file name extension is:. 9.png

The smart phone has the function of automatic horizontal screen, the same interface will be in the mobile phone (or tablet computer) in the direction of the sensor in different parameters to change the direction of the display, in the interface to change the direction of the interface of the graphics will be due to the long width of the changes resulting in stretching, resulting in distorted graphics distortion.

We all know that the Android platform has many different resolutions, and that many of the control's Chettu files are blurred and distorted when they are enlarged and stretched.

OK, using the dot nine PNG technology under the Android platform, you can stretch the picture both horizontally and vertically to achieve the perfect display at multiple resolutions.

"General tensile and point nine tensile effects contrast"

The contrast is obvious, after using point nine, can still retain the image of the gradient texture, and roundness of the fineness.

From that we can also understand why it's called "Dot nine png", in fact, the equivalent of a PNG map into 9 parts (nine Sudoku), respectively, 4 corners, 4 edges, and an intermediate area, 4 corners are not to pull up, so you can always keep the rounded corners of the clear state, and 2 water The flat and vertical edges are only horizontal and vertical stretching, so there is no case where the edges will be drawn, only the middle with the area specified by the black line to stretch. The result is that the picture doesn't get distorted

　　Two. " The production method of point nine "

　Method 1: Use the "draw9patch" tool to draw the following process

　　1. Installation Tools

First you need to install your own computer in the default directory of Java in the system. Do not install Java students can search in Baidu: jdk-6u20-windows-i586, installation package size of 80M or so.

Then, using the Andriod emulator-android-sdk-windows, open the "Draw9patch.bat" file in the Sdk/tools directory, and the load window appears:

　　2. Import and edit

Drag a PNG picture to the window

The following figure automatically enters the editing interface. The diagram describes the content and functional annotations for each area.

The view to the right of the preview finds that the edge of the picture is in the normal stretch state.

Now we click the left button on the edge of the picture to draw the black line, which is the part where the picture needs to be stretched. The following figure, 4 black lines are commented.

If the error is more than painted parts, you can hold down the SHIFT key while clicking the left mouse button to erase.

As shown in the picture, three kinds of tensile results have been perfectly displayed, we have achieved the desired tensile effect, assuming that this is a form with display text, then the area of text display, the program will also control the corresponding range of the black line.

These pictures, including the opposite sex (irregular graphics) picture, can also be achieved by the point nine PNG vertical natural stretching.

"Draw9patch.bat Other Feature description"

②show Lock: Show non-painted areas

②show Patches: Preview the Extensible Sudoku in this plot area (pink represents an extensible area)

③show patches: Highlighted areas in the Preview view (purple area)

④show Bad patches: Add a red border in the Sudoku area for four weeks, which may produce artificial traces when the image is extended. If you eliminate all bad Sudoku, the visual consistency of the extended view will be maintained.

　3. Save and output

Click on the left File-save, save the file, automatic generation of a suffix named "*.9.png" format of the picture, the picture up and down each increased 1px black line.

Method 2: Directly using the PS and other planar tools to draw, flow chart as follows

　As shown in the flowchart, relative to Method 1, only 2 steps are available. 9.png picture, the steps are:

1. Determine the drawing directly changes the canvas size of the picture,

2. Manually increase the top and bottom 1px

3. Use the Pencil tool to draw the stretch area manually, and the color value must be black (#000000).

4. Save as Web format, select png-24, and manually change the suffix name to. 9.png when stored.

The disadvantage of this approach, however, is that it cannot be previewed in real time, judging and testing the accuracy of the stretch area.

　　Use this method to note the following 2 points:

1. Hand-painted black line stretch area must be #000000, transparency 100%, and the image of four edges can not appear semitransparent pixels;

2. Your 9.png must be painted with a black line stretching the area.

Otherwise, the picture will not be compiled via the Android system, causing the program to complain. Also, some students are puzzled after the decompression of apk files,. 9.png picture of the black line why not?

That is because the Andriod program in the file packaging into APK, the program will automatically *.9.png picture edge of the black line removed, so after the decompression apk see. 9.png files have no black lines.

　Three. Use the meaning of "point nine"

For the following illustration, the results of the test show that the normal PNG display effect appears to have a significant color change in the horizontal pattern. and. 9.png images show significantly better results than ordinary PNG.

After using the. 9.png format, the transverse pattern problem is basically resolved. Because of the. 9.png picture, the Android system program has an algorithm for optimizing it.

There is a big gap between the quality of the Android phone screen. Many screens do not support more than 16-bit color display.

So after rendering the result appears to lose the color, therefore causes the horizontal pattern display.

After comparing with a variety of Android phone, found that the screen more times the more mobile phone stripes more obvious.

With the use of *.9.png image technology, only need to use a set of interface Chettu to adapt to different resolutions, and significantly reduce the size of the installation package. And so the program does not need to do a special processing to achieve its stretching, but also reduce the amount of code and development effort.

I believe everyone in the Android platform to cut the map work, there will be different skills and experience, very welcome to be able to leave their own personal experience in the comments. Mutual communication will make our working mode more flexible, more efficient, at the same time bring us more high-quality mobile end applications: