Android(安卓)UI设计小知识——Nine-Patch图片
16lz
2021-01-26
Nine-Patch
Nine-Patch是一种被特殊处理的png图片,大家可能听说过这个概念,也有称之为“ .9 图片 ” 的,我们可以指定图片区域拉伸和填充内容。可能这样说大家对其的理解还是很模糊,我们通过一个例子来进行讲解。
在布局文件中我们首先定义了一个Button按钮:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button"/>LinearLayout>
但是我觉得默认按钮的背景不好看我想换一个,这时我们通过添加属性background来自定义背景:
(自定义的背景是通过画图软件画的,感觉还是不出错哒……)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@mipmap/buttonpressed_pink" android:text="Button" />LinearLayout>
添加后效果如图:
从图中我们可以看出,Button背景中被红色圈出的部分由于被拉伸已经变形了。这时我们应该通过什么样的方法来解决这个问题呢?
解决这个问题可以使用Nine-Patch图片,在我们Sdk中的tools文件夹下有draw9patch工具。通过这个工具修改制作的图片可以指定位置拉伸和显示内容。
使用方法:
- 双击打开该工具。
- 将图片拖入该工具中。
- 通过移动上下左右的四条黑线来确定拉伸的范围和填写内容的范围。其中左边和上边的黑线范围用来指定拉伸的范围,右边和下边的黑线用来制定内容(一般是文字)填写的范围。一般情况下会将左边和下面的黑线指定为一个点,让它拉伸一个点。
最后点击右上角的File —> Save 9-patch保存为” .9 “的图片。
这时我们将背景设置为我们刚刚修改的”buttonpressed_pink.9.jpg“图片,看效果。这时有一点需要注意:在将.9图片复制到项目之前,首先要先将之前我们复制的图片”buttonpressed_pink.jpg“删掉。
这时我们看背景并没有在出现失真的问题了。
更多相关文章
- Android学习笔记:获取相册和摄像机图片在APP显示Demo
- 转:Android中自定义SeekBar的背景颜色,进度条颜色,以及滑块的图片
- Android一键分享——原生分享图片
- 开源一款android 偷拍 app【静拍】豌豆荚、flyme商店已经上线
- 在android上实施不会OOM的内存管理方案
- android 类似微信朋友圈图片点击放大的ImageView
- Android使用 LruCache 缓存图片
- 「Android」 APK瘦身探索
- Android自定义导览地图组件(一)