android9图片制作
① Android-.9图详解
Android设备适配,图片方面很重要的一部分就是.9图的使用了,我们今天就来记录一下。
.9.png图片本质上还是png图片,区别是.9.png图比正常的png图片在最外围多了1px的边框,这就允许我们在这个1px的边框上定义图片的可拉伸区域以及图片的内容区域。这也就是说.9.png的制作实际上就是我们在这1px的边框上按我们的需求,把对应位置设置为黑线,然后系统帮我们自动拉伸了。
正常图片都有四个边,.9图的左上(左边和上边两条边)表示可以拉伸区域,其中上面黑线(或者点)表示横向可拉伸的区域;左边黑线(或者点)表示纵向可拉伸的区域.在图片拉伸时只有黑线区域内的图像会被拉伸,黑线两边的图像保持原状。
右下(右边和下边两条边)表示间隔区域,其中下边表示横向填放内容的区域;右边表示纵向填放内容的区域,在图片拉伸时,控件内部的文字上下左右边界只能放在黑线区域(有点类似垂直居中显示)。
如果你还用eclipse开发,在你sdk中的tools文件夹找Draw9patch.bat文件,这是一个Windows 批处理文件,双击进入界面,拖入图片开始制作.
如果是studio直接以.9.png为后缀,双击编辑进入图片界面,选择左下角的9-patch即可开始制,或者图片右击在列表选则Create 9-Patch file即可。
我们就以一个TextView为例,给其设置一个图片背景,效果如下:
直接设置为背景:
.9图各边框含义
完毕!
② ps怎么绘制安卓开发.9.png图
一、点九图,是Android开发中用到的一种特殊格式的图片,文件名以”.9.png“结尾。这种图片能告诉程序,图像哪一部分可以被拉升,哪一部分不能被拉升需要保持原有比列。拍纤运用点九图可以保证图片在不模糊变形的前提下做到自适应。点九图常用于对话框背景图片中。
二、photoshop是专用于处理位图图形的软件,如果要做成自适应的图片,需要使用专用的ILLUSTRATOR或者CorelDRAW软件。
三、Adobe illustrator是一种应用于出版、多媒体和在线图像的工业标准矢量插画的软件,作为一款非常好的图片处理工具,Adobe Illustrator广做贺首泛应用于印刷出版、海报书籍排版、专业插画、多媒体图像处理和互联网页面的制作等,也可以为线稿提供较高的精度和控制,适合生产任何小型设计到大型的复杂项目。
四、CorelDRAW Graphics Suite是加拿大Corel公司的平面设计软件;该软件是Corel公司出品的矢量图形制作工具软件,这个图形工具给设计师提供了矢量动画、页面设计、网站制作、位图编辑和网页动画等多种功能。
该图像软件是一套屡获殊荣的图形、图像编辑软件,它包含两个绘图应用程序:一个用于矢量图及页面设计,一个用于图像编辑。这套绘图软件组合带给用户强大的交互式工具,使用户可创作出多种富于动感的特殊效果及点阵图像即时效果在简单的纯数操作中就可得到实现——而不会丢失当前的工作。通过Coreldraw的全方位的设计及网页功能可以融合到用户现有的设计方案中,灵活性十足。
五、制作方法:
1、下载安装九图神器App,并启动。
2、划开左侧菜单栏,打开wifi共享,并在在浏览器上访问提示的地址。
注意:必须保证手机连接的wifi和电脑连接的wifi在同一局域网内才行,或者使用同一个路由器。
回答不容易,希望能帮到您,满意请帮忙采纳一下,谢谢
③ 用Android Studio制作点9图
选择需要制作点9图的文件。直接右键
点击确定 会在列表显示一张该图片的点9图。打开
打开点9图进行编辑
左侧是原图,也就是编辑区。右侧是预览区。预览区分三个部分。一个是横向拉伸,一个是纵向拉伸,一个是横纵都拉伸。
编辑区下方有个zoom。直接拉到800%。然后就可以直接在你需要拉伸的地方,直接单击,就可以选择拉伸区域了。
设置完拉伸区域后,可以在预览区实时看到拉伸效果
④ 在Android Studio中画点9图
在实际项目中经常会遇到在某些手机上特别是大屏幕手机上出现毛边,边界看起来模糊不清的情况。这是因为界面上的图形会因为长宽的变化而产生拉伸,造成图形的失真变形。
这种情况下,我们可以UI设计师多切出几套分辨率的图偶来适配,但是这样会导致apk体积增加,有没有一张图就能解决的好办法呢,android平台下的点9PNG就应运而生了。点9图可以将图片横向和纵向同时进行拉察银芹伸,以实现在多分辨率下的完美显示效果。
首先看一下普通图片和点9图片的区别
布局文件如下
实际显示效果图
图中可以看出经过我处理的图片,边角变得不模糊了,虽然不是那么很好看,但这里只是做个例子来说明其作用。
下面来讲讲在android studio中怎么去根据自己实际需求去画这个点9图
先找到图片右键败毕
然后修改图片名称,选择目录,注意必须要放在drawable目录里面,不然引用studio会报错
然后进入点9图编辑界面
最后讲解怎么编辑点9图
只需要在图片边缘鼠标单击即可,一般我们只需要设置左边和上边来调节拉伸区域。
变成黑色表示拉伸的坐标点。图中粉红色的交叉点原本是白色,故而拉伸的区域都在白色点区域。
所以当拉伸时大家就看到了谷歌机器人的外部四个绿色边角区域没有了毛边,实际就是保持其不被拉伸而形成的结果。
L1与T1交叉区域,L2与T2交叉区域,表图片在拉伸的时候只会拉伸所以示只拉伸该区域。
至于右边下边 要搏戚是边框是透明色区域则表示这块区域占据空间不被别的内容遮挡,
黑色区域表示可以显示别的内容的区域,比如一个textview放这张图片做背景,如果下面左边一半设置透明色,右边一半设置黑色,那么最后文字只会在黑色区域。
如下图
以上就是点9图的部分介绍。
⑤ Android的.9图制作
先来认识一下界面,并可以看到不管是横纵向拉升都使得图片失真
下面四个小选项分别是
从上图我们可以看到,不对图片进行任何修改,图片在某一方向拉伸时都是整体缩放的. 缩放同时,图片圆角也会跟埋圆着缩放,导致最终展示效果很差.
在编辑区可以看到要编辑的图片四周多了一像素的内容,这就是我们可以操作的区域了。
绘制小黑点 :只需要在四边需要的位置左键单击绘制小黑点,或者拖动绘制小黑线(其实是连续的多个小黑点)
删除小黑点 :按shift键,并左键单击或拖动进行删除操作,也可以按住鼠标右键进行擦除。
小黑点在png图最外层有一像素宽的边,除了四个顶角,小黑点可以绘制在png最外边的任一点处,
每个小黑点占据一像素
小黑点绘制之后。其规定一个区域,即小黑点处,垂直于所在边,且一像备液清素宽的区域
顶部:在水平拉伸的时候,保持其他位置不动,只在这个点代表区域做无限的延伸
左边:在竖直拉伸的时候,保持其他位置不动,只在这个点代表区域做无限的延伸
底部:在水平拉伸的时候,指定图片里的内容显示的区域
右边:在竖直拉伸的时候,指定图片里的内容显示的区域
从上图可以看出拉伸后我们希望的箭头区域没有失真,并且而且箭头距离右边距与上边距的距离没有变因此,保证了想要部分不失真
首先没有本质上的区别,下面通过一个例子来理解
假如有一个5px 5px大小的图片,横向上需要拉伸至20px
那么就是要横向拉升H=15px
假如横向上画了一个小黑点--则每个小黑点所代表区域拉伸h=15px h=H/1
假如横向上画了三个小黑点--则每个小黑点所代表区域拉伸h=5px h=H/3
因此 每条边上的每个小黑点所代表区域拉伸的宽度是一样的 *
所以要合理的布置我们的小喝仿前点以至png图能够达到我们想要的方向伸缩
点击左上file- save,保存文件,自动生成一张后缀名为“*.9.png”格式的图片,图片上下左右各增加了1px的黑线。
9patch图片是andriod app开发里一种特殊的图片形式,文件的扩展名为:.9.png
“点九”也是由于Android平台多种分辨率需适配的需求下,发展出来的一种独特的技术。它可以将图片横向和纵向随意进行拉伸,而保留像素精细度、渐变质感和圆角的原大小,实现多分辨率下的完美显示效果,同时减少不必要的图片资源,可谓切图利器。
.9.PNG确实是标准的PNG格式,只是在最外面一圈额外增加1px的边框,这个1px的边框就是用来定义图片中可扩展的和静态不变的区域。特别说明,left和top边框中交叉部分是可拉伸部分,未选中部分是静态区域部分。right和bottom边框中交叉部分则是内容部分
无论是left和top,还是right和bottom都是把图片分成9块 (边角四块是不能缩放的,其他的四块则是允许缩放的),所以叫做9.PNG。
.9.png图片,android系统程序有对其优化的算法。
参考
http://www.jianshu.com/p/3fd048644e3f
http://bbs.itheima.com/thread-251222-1-1.html
http://www.yimui.com/archives/117
⑥ android 开发中有渐变色的图片做.9图片怎么能让它拉伸不变形
如图这样画,上面和左边的黑线表示要拉伸的宽和高,下面和右边的黑线表示填充内容的宽和高
⑦ Android Studio制作 .9.png
注意:一般会把图片的宽高减去2个像素(例如 750x1334 的 png图的大小设置为748x1332)
因为生成.9.png的时候会加上2个像素
直接生成.9.png图片
保存之后能看到.9.png图片了
可以看到 右边预览的区域发生了变形
一般启动图都是中间部分保留 四边拉伸
四个边操作之后的结果是这样的
这就是四个边的拉伸区域 中间部分不会被拉伸 (可以看右边的预览效果图)