【Android】ShapeDrawable属性介绍

【博主声明】转载需指明文章出处!

· 介绍

    Android的Drawable为Android的UI界面提供了丰富多彩的显示效果。例如,我们View的src属性、background属性可以设置的内容就包括各式各样的drawable资源文件。drawable文件夹下的资源可以是一张图片(jpg/png/bmp等格式),还可以是一个xml文件。当然,我们今天要介绍的是以xml方式实现的drawable文件,那么我们来看看以这种方式实现的优点。

    Drawable是一个抽象的概念,它可以被canvas绘制,常见的有颜色和图片都可以是一个drawable。因为drawable可以做出一些特殊的ui效果,所以对比图片来说,它的优点如下:

1、首先,它的使用比较简单,在xml里已经定义了大量的属性方法,我们只要熟悉各个属性的ui效果和特点就可以自己组合各种的界面效果。

2、其次,它的实现成本比自定义View低,一些比较简单的、定制性、重复性的UI效果使用drawable将会缩小开发成本。但是一些比较复杂的ui场景,drawable却表现不出自定义view的那种效果。

3、相比较于图片而言,drawable占用空间更小,这样有利于缩小apk的体积。

    Drawable虽然有这些优点,但与此同时,它的分类又是比较细的。比如,android常用的Drawable有BitmapDrawable、ShapeDrawable、LayerDrawable、ScaleDrawable、TransitionDrawable等等。当然,还有一些我没有列举出来的,下文会逐步讲解它们的特点以及用法。

· Drawable实现的案例

    首先,我们来看看比较常用的这几种Drawable。

一、BitmapDrawable

<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:antialias="true"
    android:dither="true"
    android:filter="true"
    android:gravity="fill"
    android:src="@drawable/pig"
    android:tileMode="disabled" />

  以上是BitmapDrawable的一个小案例,那么我们将其设置到TextView的background属性中,显示效果如下:

正如上面的src属性,设置的是一张小猪头的图片,还有其他一些属性,我也将依次进行介绍。

1、android:dither属性

     是否开启抖动效果。它的作用例如:一张ARGB_8888色彩模式的图片在仅支持RGB_565的设备上显示,会使图片不会太过于失真。因此,应该开启此项。

2、android:filter属性

     是否开启过滤效果。建议启用,开启此项可以保持较好的显示效果。

3、android:antialias属性

     是否开启抗锯齿效果。建议启用,开启抗锯齿效果会使图片变得平滑。

4、android:tileMode属性

     设置平铺模式,当开启时android:gravity属性将失效。平铺模式有三种,分别为:clamp、repeat、mirror。disabled表示不开启,也是默认值。

     clamp作用是:让四周图像扩展到周围区域。比如,图像小于容器时,四周的每一个像素将会进行扩展直到填满容器。

     re[eat作用是:复制图像到周围区域,一种简单的平铺效果。

     mirror作用是:水平和竖直方向上的一种镜像效果。

5、android:gravity属性

     设置图像的位置以及显示方式。这个属性比较常用,类似view的gravity属性,属性内容比较多,大家可以自己尝试一下看看效果。一般我们会选择fill来进行对容器的填充效果。

二、ShapeDrawable

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:topLeftRadius="48dp"
        android:bottomRightRadius="48dp" />
    <stroke
        android:width="2dp"
        android:color="@color/colorGray"
        android:dashGap="16dp"
        android:dashWidth="8dp" />
    <solid android:color="@color/colorWhite" />
</shape>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:topLeftRadius="32dp"
        android:topRightRadius="32dp" />
    <stroke
        android:width="1px"
        android:color="@color/colorAccent" />
    <size
        android:width="100dp"
        android:height="100dp" />
    <gradient
        android:angle="270"
        android:centerColor="@color/colorAccent"
        android:centerX="1"
        android:centerY="10"
        android:endColor="@color/colorAccent"
        android:startColor="@color/colorWhite"
        android:type="linear" />
</shape>

上面两个是ShapeDrawable的小案例,它们的显示效果分别如下:

首先,我们来看第一个的显示效果。内部以白色填充,边框为灰色虚线,左上、右下以圆弧曲线弯曲效果。下面,我将依次介绍它们的标签属性效果。

1、shape标签

     shape位于根标签,android:shape属性。它拥有四种形状。分别为:rectangle(默认,矩形)、oval(椭圆)、line(横线)、ring(圆环)

2、corners标签

     作用于矩形的四周(仅适用于矩形),为四周设置角度。如上图所示,矩形四个角的弧度。利用这一个标签可以很方便的实现圆角矩形的效果。

3、stroke标签

     表示描边(或添加边框)。如图中第一个矩形所示,外围的一圈灰色虚线效果。这里注意:android:dashWidth和android:dashGap任何一个不可以为0,否则虚线效果将不生效。当然,除了虚线,去除这两个属性即变为实线效果(如上图第二个矩形)。

4、solid标签

     表示为shape填充(如上图矩形内部的填充颜色),很容易理解。

5、gradient标签

     android:type属性,设置颜色渐变效果(如上图第二个矩形所示)。渐变模式有三种,分别为:linear(默认,线性渐变)、sweep(扫描渐变)、radial(径向渐变)

扫描渐变:

径向渐变(类似圆环效果):

注意:仅当设置了android:gradientRadius时才生效,表示设置渐变半径。

关于gradient标签还有一个地方值得注意,那就是android:angle属性,渐变的角度必须设置为45的整数倍。例如:0,45,90,135,180...

还有其他一些标签比较简单,也容易理解。光看属性名字就知道它的具体作用了。

 

 

 

posted @ 2018-08-30 19:41  爱写Bug的程序猿  阅读(1795)  评论(0编辑  收藏  举报