Android九点图(Nine-Patch)制作及应用
你可能之前还没有听说过Nine-Patch这个名词,它是一种被特殊处理过PNG图片,能够指定哪些区域可以被拉伸而哪些区域不可以。
现在我将手把手教你如何去制作一张九点PNG图像。
------------------------------------------Nine_Patch制作--------------------------------------------------
素材:

首先我们试试不用九点PNG为TextView设置背景图片,XML参数如下:
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/green"/>
最终效果如下:

可以看到,由于图片的宽度不足以填满整个屏幕的宽度,整张图片被均匀地拉伸了。
这种效果非常差,用户肯定是不能容忍的,这时我们就可以使用Nine-Patch图片来进行改善。
在Android SDK目录下有一个tools文件夹,在这个文件夹中找到draw9patch.bat文件

双击打开之后,把图片拖动到窗口中,将图片加载进来,如图所示:


我们可以在图片(左边)的四个边框绘制线段,线段内的部分就表示当前图片拉伸的区域,拉伸后的效果可以在视窗(右边)观看。

图片边缘被黑色线段覆盖的范围就是图片需要拉伸的范围,当上下左右都设定好范围之后,会形成一个九宫格的布局,这也是Nine-Patch名字的由来。
如果不小心画错了,按住Shift+鼠标左键就可以清除标记部分。
图片拉伸的原则:保留细节,拉伸直线
保存图片,图片会自动添加一个.9.png的后缀,图片最终效果是这样的:

最后图像生成的黑线是什么鬼?不要激动,那是用于标记拉伸区域的特殊记号,如果没有这些黑线,这图片就与普通的PNG一样了。
等等,那是不是一张普通的PNG加上黑色标记线,就可以充当Nine-Patch图使用了呢?
除了标记线,要让Android识别这是Nine-Patch图片,还得有特殊的声明(.9.png)才行,注意不要更改文件的后缀名。
图片命名规范:图片样式+制作者+编号(以保证不会与编译器冲突)
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/green_woider_01"
android:gravity="center"
android:text="你好,小娜"
android:textColor="#333"
android:textSize="18dp" />
重新运行程序,看看效果:

效果很棒不是吗?这样当图片需要拉伸的时候,就可以只拉伸指定的区域,程序在外观上也是有了很大的改进。
有了这个知识储备之后,试试下面的界面:

Android九点图(Nine-Patch)制作及应用的更多相关文章
- Android:res之shape制作圆角、虚线、渐变
xml控件配置属性 android:background="@drawable/shape" 标签 corners ----------圆角gradient ----------渐 ...
- android recovery模式及ROM制作
转自android recovery模式及ROM制作 1.总述 为了方便客户日后的固件升级,本周研究了一下android的recovery模式.网上有不少这类的资料,但都比较繁杂,没有一个系统的介绍与 ...
- android使用html+javascript来制作页面
一般的android界面使用的是XML.但是XML如果要制作很高级的UI,会很复杂.如果使用HTML老进行UI设计就会简单很多. android早就提供了这样的借口. WebView.addJavas ...
- Android 使用Fragment,ViewPagerIndicator 制作csdn app主要框架
转载 转载请注明出处:http://blog.csdn.net/lmj623565791/article/details/23513993 本来准备下载个CSDN的客户端放手机上,没事可以浏览浏览资 ...
- [置顶] 修改Android开机画面之rle制作
第一个动画: Bootloader开机使用的图片是linux.bmp,长高分别是120*120,色度是32,所以可以拿相同格式图片替换,进行编译烧写即可. 第二个图片:内核logo 这个修改方式,我在 ...
- 【转】Android进阶2之 阴影制作(Shadow)
阴影制作:包括各种形状(矩形,圆形等等),以及文字等等都能设置阴影. 阴影制作是什么原理呢? 其实很简单,你需要设置阴影的东西被看作一个主层.然后在主层下面画一个阴影层. 阴影制作涉及到一个重要函数: ...
- Android引导指示层的制作 (ViewStub + SharePreference)
引导指示界面是个什么鬼东西?一张图即明了:
- Unity3d NGUI的使用(九)(UIScrollView制作滑动列表)
UIScrollView制作滑动列表,可横向,竖直展示一些列表在固定可视范围内 UIScrollVIew只是一个可滑动的UI组件 如果需要制作复杂的可视区域UI需要配合使用UIPanel与UIGrid ...
- 【Android】用Cubism 2制作自己的Live2D——官方App样例源码学习(1)!
前言- 上几篇文章,我们一个一个的研究了Cubism官方提供的Android使用Live2D的简单例子,但是依旧和大家平时见到的还是有很大差距的.在研究了代码差不多一周以后,我决定还是用文字的形式记录 ...
随机推荐
- C#创建用户控件 - IPv4地址输入框
根据网上的改写:http://blog.csdn.net/jhqin/article/details/5823363 控件属性: Text:获取或设置string类型的IP地址 Value:获取或设置 ...
- 【经典】C++&RPG对战游戏
博文背景: 还记大二上学期的时候看的这个C++&RPG游戏(博主大一下学期自学的php,涵盖oop内容),一个外校的同学他们大一学的C++,大二初期C++实训要求做一个程序填空,就是这个 RP ...
- 项目管理知识框架PMBOK(文字版)
项目管理知识框架PMBOK 项目整体管理[I](Integration) 1. 制定项目章程(Develop Project Charter) 2. 制定项目初步范围说明书(Develop Pre ...
- memcached命令行操作详解,命令选项的详细解释
连接到memcached命令行下: telnet 127.0.0.1 11211 1.set / add / replace : 格式:<command> <key> < ...
- html 表格head头部不动 body部分滚动,每格宽同内容增加
如下图同Excel表格首行固定: <style> .table{ width: 100%; border-collapse:collapse; border-spacing:0;} .ta ...
- Effective Objective-C 2.0 — 第二条:类的头文件中尽量少引入其他头文件
第二条:类的头文件中尽量少引入其他头文件 使用向前声明(forward declaring) @class EOCEmployer 1, 将引入头文件的实际尽量延后,只在确有需要时才引入,这样就可以减 ...
- yii2 如何用命名空间方式使用第三方类库
原文地址:http://www.yiichina.com/tutorial/395 Yii 2.0最显著的特征之一就是引入了命名空间,因此对于自定义类的引入方式也同之前有所不同.这篇文章讨论一下如何利 ...
- JQuery-EasyUI与EXTjs有什么区别?
一.ExtJS1.ExtJS可以用来开发RIA也即富客户端的AJAX应用,是一个用javascript写的,主要用于创建前端用户界面,是一个与后台技术无关的前端ajax框架.因此,可以把ExtJS用在 ...
- move_upload_file 因为文件字符集编码iconv引起的问题
对 包含中文的文件 进行操作时提示 Invalid argument? 包括: 这里的move_uploaded_file和 fopen等操作都是如此. 而且用了字符编码转换后, iconv('utf ...
- Linux命令笔记(一)
vi 有三种模式,输入模式,编辑模式,“:”命令模式vi 进入以后默认是编辑模式vi 编辑模式默认的快捷键 上下左右分别是 J K H Lvi 在编辑模式使用 i 可以进入输入模式vi 输入模式只能输 ...