Chinaunix首页 | 论坛 | 博客
  • 博客访问: 1563704
  • 博文数量: 237
  • 博客积分: 5139
  • 博客等级: 大校
  • 技术积分: 2751
  • 用 户 组: 普通用户
  • 注册时间: 2008-11-18 14:48
文章分类

全部博文(237)

文章存档

2016年(1)

2012年(4)

2011年(120)

2010年(36)

2009年(64)

2008年(12)

分类: 嵌入式

2011-07-20 10:50:52

9patch是随文字大小可以缩放的图片。 定义了拉伸区域,则除拉伸区域可变外,其他区域保持原来的形状大小不变。

9patch 九宫格 9分图 它的四个角不作任何伸展,四个边分别只作水平和垂直伸展,中间部分则是水平跟垂直同时伸展,这就是著名的9-patch图,很多作背景的时候,一个很小像素数的图就可以无限的伸展为某控件背景。

一个九宫图是可伸缩的位图,在Android中将会根据视图所处位置来自适应调整成匹配视图长宽的图形。一个非常典型的例子就是Android按钮 -按钮必须根据文本描述自适应长度。一个标准的九宫图是包含额外1像素宽边框的png图片。它必须被保存以.9.png为后缀的图片文件中,并保存在工程 的res/drawable目录里。
A NinePatchDrawable graphic is a stretchable bitmap image, which Android will automatically resize to accommodate the contents of the View in which you have placed it as the background. An example use of a NinePatch is the backgrounds used by standard Android buttons — buttons must stretch to accommodate strings of various lengths. A NinePatch drawable is a standard PNG image that includes an extra 1-pixel-wide border. It must be saved with the extension .9.png, and saved into the res/drawable/ directory of your project.

  这个边框是用来定义图片的可伸缩和静态区域。你可以在左部和上部使用1宽度的黑线来定义可伸缩的区域(其它边框必须是完全透明或者白色)。你可以有尽可能多的可伸缩区域:它们的相对长宽将保持相同,因此最大的片段将总是最大的。
The border is used to define the stretchable and static areas of the image. You indicate a stretchable section by drawing one (or more) 1-pixel-wide black line(s) in the left and top part of the border (the other border pixels should be fully transparent or white). You can have as many stretchable sections as you want: their relative size stays the same, so the largest sections always remain the largest.

  以下为可选的:你同样可以定义padding lines在边框右部和底部画1像素宽的线。如果一个视图指定了九宫图为它的背景并设置了文本,它将伸缩它自己以便所有文本将会处于由右部和底部指定的区 域中。如果padding lines没有指定,Android使用左部和顶部来定义绘制区域。
You can also define an optional drawable section of the image (effectively, the padding lines) by drawing a line on the right and bottom lines. If a View object sets the NinePatch as its background and then specifies the View’s text, it will stretch itself so that all the text fits inside only the area designated by the right and bottom lines (if included). If the padding lines are not included, Android uses the left and top lines to define this drawable area.

  为区分不同线的区别,左部和顶部线是用来定义多少像素能被重复来伸展图像。底部和右部的线是用来定义一个相对区域来填充视图的内容。
To clarify the difference between the different lines, the left and top lines define which pixels of the image are allowed to be replicated in order to stretch the image. The bottom and right lines define the relative area within the image that the contents of the View are allowed to lie within.

  以下是一个九宫图的例子来定义按钮:
Here is a sample NinePatch file used to define a button:



  这个九宫图使用左部和顶部的线来定义一个可伸缩区域和使用底部和右部来定义一个绘制区域。在上部图片中,点线表示了图片的可伸缩区域。在底部图片中粉红色方框表示内容可以填充的区域。如果内容不能很好的适应这个区域,然后图片将会自动扩展。
This NinePatch defines one stretchable area with the left and top lines and the drawable area with the bottom and right lines. In the top image, the dotted grey lines identify the regions of the image that will be replicated in order to stretch the image. The pink rectangle in the bottom image identifies the region in which the contents of the View are allowed. If the contents don’t fit in this region, then the image will be stretched so that they do.

  sdk\tools\draw9patch.bat工具提供了一个简单易行的方式使用可视化编辑工具来创建九宫图.当你定义的区域有导致像素重复的情况,它甚至会发出警告哦。
The Draw 9-patch tool offers an extremely handy way to create your NinePatch images, using a WYSIWYG graphics editor. It even raises warnings if the region you’ve defined for the stretchable area is at risk of producing drawing artifacts as a result of the pixel replication. 

Optional controls include:

    * Zoom*: Adjust the zoom level of the graphic in the drawing area.
    * *Patch scale*: Adjust the scale of the images in the preview area.
    * *Show lock*: Visualize the non-drawable area of the graphic on
      mouse-over.
    * *Show patches*: Preview the stretchable patches in the drawing
      area (pink is a stretchable patch).
    * *Show content*: Highlight the content area in the preview images
      (purple is the area in which content is allowed).
    * *Show bad patches*: Adds a red border around patch areas that may
      produce artifacts in the graphic when stretched. Visual coherence
      of your stretched image will be maintained if you eliminate all
      bad patches.
阅读(4021) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~