android .9.png ”点九” 图片制作方法

“点九”是andriod平台的应用软件开发里的一种特殊的图片形式,文件扩展名为:.9.png

智能手机中有自动横屏的功能,同一幅界面会在随着手机(或平板电脑)中的方向传感器的参数不同而改变显示的方向,在界面改变方向后,界面上的图形会因为长宽的变化而产生拉伸,造成图形的失真变形。

我们都知道android平台有多种不同的分辨率,很多控件的切图文件在被放大拉伸后,边角会模糊失真。

OK,在android平台下使用点九PNG技术,可以将图片横向和纵向同时进行拉伸,以实现在多分辨率下的完美显示效果。

【普通拉伸和点九拉伸效果对比】

对比很明显,使用点九后,仍能保留图像的渐变质感,和圆角的精细度。

从中我们也可以理解为什么叫“点九PNG”,其实相当于把一张png图分成了9个部分(九宫格),分别为4个角,4条边,以及一个中间区域,4个角是不做拉升的,所以还能一直保持圆角的清晰状态,而2条水 平边和垂直边分别只做水平和垂直拉伸,所以不会出现边会被拉粗的情况,只有中间用黑线指定的区域做拉伸。结果是图片不会走样

二.“点九”的制作方法

方法1:使用 “draw9patch”工具绘制,流程如下

1.  安装工具

首先你需要给自己的电脑安装上java于系统的默认目录下。没有安装java的同学可以在百度搜索:jdk-6u20-windows-i586,安装包大小80M左右。

然后使用andriod模拟器—android-sdk-windows,打开SDK/tools目录下的“draw9patch.bat”文件,出现载入窗口:

2.导入并编辑

将png图片拖拽到该窗口中

如下图,自动进入编辑界面。图中介绍了每个区域的内容及功能注释。

预览右侧的视图发现,图片的边缘处于普通拉伸状态。

现在我们在图片边缘点击左键,绘制出黑线,即图片需要被拉伸的部分。如下图,对4条黑线做了注释。

如果失误多绘的部分,可按住shift键的同时点击鼠标左键擦除)。

如图所见,三种拉伸结果均已完美显示,已实现我们想要的拉伸效果,假设这是一个有显示文字的窗体,那么文字显示的区域,程序也会控制在黑线对应范围。

以下这些图片,包括异性(非规则图形)图片,也可以通过点九PNG实现横纵向的自然拉伸。

【draw9patch.bat其他功能说明】

②   Show lock:显示不可绘区域

② Show patches:预览这个绘图区中的可延伸宫格(粉红色代表一个可延伸区域)

③ Show patches:预览视图中的高亮区域(紫色区域)

④ Show bad patches:在宫格区域四周增加一个红色边界,这可能会在图像被延伸时产生人工痕迹。如果你消除所有的坏宫格,延伸视图的视觉一致性将得到维护。

3.保存和输出

点击左上file- save,保存文件,自动生成一张后缀名为“*.9.png”格式的图片,图片上下左右各增加了1px的黑线。

方法2:直接使用 PS等平面工具绘制,流程图如下

如流程图所示,相对与方法1,只需2个步骤就可得到.9.png图片,具体步骤为:

1.  确定切图后直接改变图片的画布大小,

2.  手动将上下左右各增加1px

3.  使用铅笔工具,手动绘制拉伸区域,色值必须为黑色(#000000)。

4.  存储为web所用格式,选择png-24,储存时手动将后缀名改为.9.png

不过这种方法的缺点是不能实时预览,判断并测试拉伸区域的准确性。

使用此方法需要注意以下2点:

1. 手绘的黑线拉伸区必须是#000000,透明度100%,并且图像四边不能出现半透明像素;

2. 你的.9.png必须绘有拉伸区域的黑线;

否则,图片不会通过android系统编译,导致程序报错。还有,有同学疑惑解压缩apk文件后,.9.png图片里的黑线怎么没了?

那是因为andriod程序在把文件打包成apk的时候,程序会自动把*.9.png图片边缘的黑线去掉,所以解压缩apk后看到的.9.png文件是没有黑线的。

三.使用“点九”的意义

关于下图,经过测试发现使用普通png的显示效果出现明显的变色横纹。而.9.png图片的显示效果明显优于普通png。

使用.9.png格式后,横纹问题基本已解决。因为对于.9.png图片,android系统程序有对其优化的算法。

由于android手机屏幕的材质质量差距大。很多屏幕不支持16位以上的颜色显示。

所以渲染后结果出现丢失颜色,故造成横纹显示。

经与多款android手机对比后发现,屏幕越次的手机横纹越明显。

而使用了*.9.png图片技术后,只需要采用一套界面切图去适配不同的分辨率,而且大幅减少安装包的大小。而且这样程序不需要专门做处理的就可以实现其拉伸,也减少了代码量和开发工作量。

相信每个人android平台的切图工作,会有不同的技巧和心得,非常欢迎大家能在评论中留下自己的个人经验及心得。相互交流会让我们的工作模式更灵活,更高效,同时带给大家更多优质的移动端应用:)

转载请注明出自”百度MUX”

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/539921.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

servlet3.0异步处理

Servlet3是Tomcat7出现的新特性,所以需要先安装tomcat7 微信企业号使用回调模式时: 假如企业无法保证在五秒内处理并回复,可以直接回复空串,企业号不会对此作任何处理,并且不会发起重试。这种情况下,可以…

使用svn diff的-r参数的来比较任意两个版本的差异

1 svn diff的用法1.1 对比当前本地的工作拷贝文件(working copy)和缓存在.svn下的版本库文件的区别[plain] view plaincopyprint? svn diff 1.2 对比当前本地的工作拷贝文件(working copy)和任意版本A的差异[plain] view plaincopyprint? svn diff -rA 比如,以下…

深入理解HTTP Session

session在web开发中是一个非常重要的概念,这个概念很抽象,很难定义,也是最让人迷惑的一个名词,也是最多被滥用的名字之一,在不同的场合,session一次的含义也很不相同。这里只探讨HTTP Session。为了说明问题…

Hibernate的懒加载session丢失解决方法

在web.xml加入spring提供的过滤器&#xff0c;延长session的生命周期 <!--Hibernate的懒加载session丢失解决方法 --><filter><filter-name>openSessionInView</filter-name><filter-class>org.springframework.orm.hibernate4.support.OpenSess…

Linux访问其他进程空间,Linux环境进程间通信系列(五):共享内存

共享内存可以说是最有用的进程间通信方式&#xff0c;也是最快的IPC形式。两个不同进程A、B共享内存的意思是&#xff0c;同一块物理内存被映射到进程A、B各自的进程地址空间。进程A可以即时看到进程B对共享内存中数据的更新&#xff0c;反之亦然。由于多个进程共享同一块内存区…

冲刺NO.8

Alpha冲刺第八天 站立式会议 项目进展 项目稳步进行&#xff0c;项目的基础部分如基本信息管理&#xff0c;信用信息管理等部分已相对比较完善。 问题困难 技术困难在短期内很难发生质的变化&#xff0c;而本项目由于选择了队员不太熟悉的程序框架&#xff0c;所以所以项目的交…

linux由众多微内核组成,什么是linux

大家对Linux这个词比较陌生吧&#xff0c;那么Linux是什么呢&#xff1f;Linux是什么Linux是一种自由和开放源码的类Unix操作系统。目前存在着许多不同的Linux&#xff0c;但它们都使用了Linux内核。Linux可安装在各种计算机硬件设备中&#xff0c;从手机、平板电脑、路由器和视…

浅析jQuery中常用的元素查找方法总结

$("#myELement") 选择id值等于myElement的元素&#xff0c;id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $("div") 选择所有的div标签元素&#xff0c;返回div元素数组 $(".myClass") 选择使用myClass类的css的所有…

右击菜单一键优化(增加新建office2003、新建reg和bat,删除新建公文包、新建wps、新建rar)...

右击菜单一键优化&#xff08;增加新建office2003、新建reg和bat&#xff0c;删除新建公文包、新建wps、新建rar&#xff09; Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\.doc]"Word.Document.8""Content Type""application/msword&qu…

jquery获取select选择的显示值

转载自&#xff1a;http://blog.csdn.net/a5489888/article/details/8611703 本来以为jQuery("#select1").val();是取得选中的值&#xff0c; 那么jQuery("#select1").text();就是取得的文本。 这是不正确的&#xff0c;正确做法是&#xff1a; jQuery(&qu…

克隆整个linux系统环境的软件,开源的系统克隆工具 Clonezilla(再生龙)linux、UBUNTU备份不用愁...

Clonezilla是一个很好的系统克隆工具,它基于Partimage,吸取了Norton Ghost和Partition Image的优点。即不仅支持对整个系统进行克隆,而且也可以克隆单个的分区,这种灵活性可能更能适应备份者的需要。支持GNU/Linux的文件系统 ext2、ext3、reiserfs、xfs、jfs和Windows的FAT、FA…

SqlServer2008备份与还原(完整图示版)

一、备份 1、在需要备份的数据库上&#xff0c;右键——任务——备份&#xff0c;如下&#xff1a; 2、选择备份到哪个路径和备份名字&#xff1a; 点击“添加”&#xff0c;如下&#xff0c; 3、上面点击“确定”后&#xff0c;回到第一个页面&#xff0c;选中刚才添加的路径和…

Jquery mobile问题总汇

转载&#xff1a;http://www.wglong.com/main/artical!details?id4#q6 1页面缩放显示问题 问题描述&#xff1a; 页面似乎被缩小了&#xff0c;屏幕太宽了。 解决办法&#xff1a; 在head标签内加入&#xff1a; <meta name"viewport" content"widthdevice…

Linux通过文件大小查找,linux 根据文件大小查找文件

linux下的find命令用来查找文件&#xff0c;通过man find就知道它是无所不能的。所以按照文件大小来查找文件就不在话下。从man find搜索size&#xff0c;可以看到如下信息&#xff1a;-size n[cwbkMG]File uses n units of space. The following suffixes can be used:b for 5…

DBCP连接池介绍

DBCP连接池介绍 ----------------------------- 目前 DBCP 有两个版本分别是 1.3 和 1.4。 DBCP 1.3 版本需要运行于 JDK 1.4-1.5 &#xff0c;支持 JDBC 3。 DBCP 1.4 版本需要运行于 JDK 1.6 &#xff0c;支持 JDBC 4。 1.3和1.4基于同一套源代码&#xff0c;含有所有的bug修…

linux解释名词shell环境,Linux 定时任务

实现linux定时任务有:cron、anacron、at等&#xff0c;这里主要介绍cron服务。名词解释&#xff1a;cron是服务名称&#xff0c;crond是后台进程&#xff0c;crontab则是定制好的计划任务表。软件包安装&#xff1a;要使用cron服务&#xff0c;先要安装vixie-cron软件包和cront…

Python3 实现用户登陆,输入三次密码

不加注释版 #/usr/bin/python3 import readline user "seven" passwd "123" username input("please the enter user:") for i in range(3):password input("please the enter password:")if password.isdigit():password int(pa…

linux pcre静态编译,Linux下,Nginx部署静态网站

1、准备工作选首先安装这几个软件&#xff1a;GCC&#xff0c;PCRE(Perl Compatible Regular Expression)&#xff0c;zlib&#xff0c;OpenSSL。Nginx是C写的&#xff0c;需要用GCC编译&#xff1b;Nginx的Rewrite和HTTP模块会用到PCRE&#xff1b;Nginx中的Gzip用到zlib&…

【HTML5初探之本地存储】如果没有数据库。。。

导航【初探HTML5之使用新标签布局】用html5布局我的博客页&#xff01;【HTML5初探之form标签】解放表单验证、增加文件上传、集成拖放【HTML5初探之绘制图像&#xff08;上&#xff09;】看我canvas元素引领下一代web页面【HTML5初探之绘制图像&#xff08;下&#xff09;】看…

FragmentActivity和Activity的具体区别

fragment是3.0以后的东西&#xff0c;为了在低版本中使用fragment就要用到android-support-v4.jar兼容包,而fragmentActivity就是这个兼容包里面的&#xff0c;它提供了操作fragment的一些方法&#xff0c;其功能跟3.0及以后的版本的Activity的功能一样。 下面是API中的原话&am…