您的位置:首页 > 移动开发 > Android开发

android 9 patch 图片(.9.png 格式图片) 的特点和制作_oisoft 机器人图片

2011-03-29 22:45 489 查看
通常使用 9-patch drawable 一般是为了绘制出比较漂亮的带圆角背景,这样可以避免圆角及边缘被任意拉伸导致变形。
   一个NinePatchDrawable图形是一种可伸展图,android会自动调整适应观点的内容,你要把它为背景例使用NinePatch是使用android按钮背景——按钮必须标准伸展开来适应不同长度的弦一个NinePatch可画的是一个标准PNG图片,包括额外的1-pixel-wide边境它必须被保存和延伸,留到.9.png杂志/可画的/目录,你的项目 
  边境是用于定义和静态地区的可延伸的形象你可伸展部份表明画一个(或者更多个)1-pixel-wide黑线(s)在左边和顶层部分的边界(你可以有很多种可延伸部分像你希望的那样)可延伸的相对大小的部分不变,所以最大的部分永远是最大的 
  你也可以定义一个可选的可画的部分图像(有效,衬垫线画线)在右边,底线如果一个视图对象设置NinePatch为背景,然后指定观的文本,它会让自身所有的文本内容只有面积内符合规定的权利和底线(如果包括你在内)如果衬垫线,不包括机器人使用左边和顶层线,以确定这可画的区域 
  阐明了不同线路之间的差距,左边和顶层线定义像素的图像可以被复制为了伸展的形象底部和右线定义相对范围内的图像的内容所允许的范围之内的观点 
  2.使用 9-patch drawables foo.9.png [1]. 9-patch drawables 的语法跟CSS3 border image 类似 
  [2]. 根据边缘的像素宽度切割出不同的拉伸区域 
  [3]. 最好同时提供 mdpi 和 hdpi 的版本 
  译者注:drawables 在 Android 里面跟 WPF 里面的 Drawing 类似,用于定义一个可绘制的对象,包括位图,刷子,填充颜色或者以上物件的组合等等所谓 9-patch drawables,就是将一个 drawable 按照定义的 4 个边缘的宽度大小切割成9个区域,包括4个角落,4条边缘和一个中心区域,当把这个 drawable 绘制到一个任意矩形区域时,drawable 的各个区域有不同的拉伸控制(角落不拉伸,横边横向拉伸,竖边竖向拉伸,中心区域横竖向都拉伸)当然,如果你的程序里面绘制的图像和目标区域大小完全一样,就不需要那么麻烦,不过以 Android 的状况来说,为了适应多种设备,最好不要事先假设目标区域的像素大小 
  3.如何使用SDK自带工具制作.9.png图片 
  在sdk下tools工具栏有一个draw9patch.bat文件打开后倒入工程需要修改的图片 
  

 
  这个工具分左右栏 左边是图片当前像素 最下面可调试放大倍数 右边是可预览的效果! 
  

 
  接下来是开始制作图片了,用鼠标左键点击图片上的上边 和左边 这个两个面来确定什么部位进行拉伸 
  IMG style="MARGIN: 0px 10px 0px 0px" title="Android 9 patch 图片(.9.png 格式图片) 的特点和制作 How to draw NinePatch images with Photoshop - .9.PNG - 爱海涛涛 - Google Android" alt="Android 9 patch 图片(.9.png 格式图片) 的特点和制作 How to draw NinePatch images with Photoshop - .9.PNG - 爱海涛涛 - Google Android" src="http://img542.ph.126.net/E1Rdq4rJaAcerq6podIv VQ==/1388888888879521105.png"> 
  

 
  <Button 
  android:id="@+id/open_bt" 
  android:layout_width="wrap_content" 
  android:layout_height="wrap_content" 
  android:background="@drawable/box_green" 
  android:text="木蚂蚁官方团队博客" 
  android:textColor="#ffffff"/> 
  <Button 
  android:id="@+id/open_bt_2" 
  android:layout_width="wrap_content" 
  android:layout_height="wrap_content" 
  android:background="@drawable/box_green_2" 
  android:text="木蚂蚁官方团队博客" 
  android:textColor="#ffffff"/> 
  <Button 
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content" 
  android:background="@drawable/computer" 
  /> 
  <Button 
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content" 
  android:background="@drawable/computer2" 
  /> 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息