代码改变世界

定制圆角带背景色的矩形边框

2011-07-20 10:55  乱世文章  阅读(873)  评论(0编辑  收藏  举报

Android系统本身提供的TextView组件并没有边框,我们可以为TextView设置一个9-patch格式的背景图来提供边框。AndroidSDK提供了一个Draw-9-patch工具,专门用于制作此类9-patch格式的背景图。通过命令行运行<ADK_Home>\tools\draw9patch.bat命令可以启动Draw-9-patch工具:


这个工具的使用非常简单,可以快速制作9-path格式的图片。

但如果你更熟悉photoshop、firework、illustrator、coredraw等图形工具,那也是完全可以的,因为9-patch图片其实是一个png图片。而且photoshop制作出来的图片更精致和美观。

下面我们使用免费图形工具Acorn 来制作一个圆角的带背景的矩形边框。Acorn是一个Mac下的图形处理工具,完全免费。它没有photoshop强大,但比photoshop更简单和高效,如果你使用过它,那你很快就会抛弃掉photoshop。

首先在Acorn中制作一个背景透明的带阴影的矩形:

图片大小为32*32,稍有点大,我们先把它resize为16*16。然后用ResizeCanvas命令增加2个像素18*18,如图所示:

然后在左上角最靠边的两个地方用铅笔工具点上两个1个像素大小的黑点:

将图形保存为png格式。

将图片文件拷贝到工程drawable目录下,并重命名后缀为9.png的文件(比如box.9.png)。

在布局文件中,将TextView的backgroud属性设置为这个图片:

<TextView android:id="@+RetrieveNotice/tvDate1" android:background="@drawable/box"

android:layout_width="96sp" android:textSize="13sp"android:text="2011-07-11"

android:layout_height="wrap_content" android:textColor="?android:attr/textColorPrimary"

android:layout_marginLeft="10sp"android:layout_gravity="center_vertical"/>

注意 android:background="@drawable/box"一行,不用写出9.png的后缀名。运行程序,TextView会显示一个圆角矩形边框,并且边框大小会根据TextView的大小自动缩放: