Drawable使用

在本文中，程序统一使用的原图为image.jpg，如图 1。

 

图 1

（1）       BitmapDrawable

首先是MainActivity的布局文件activity_main.xml。

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

   xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

   android:layout_height="match_parent"

    android:orientation="horizontal"

   tools:context="com.example.drawabletest.MainActivity" >

 

    <TextView

        android:id="@+id/text1"

        android:layout_width="100dp"

        android:layout_height="100dp"

        android:layout_margin="2dp"

       android:background="@drawable/bitmap_drawable_repeat" />

 

    <TextView

        android:id="@+id/text2"

        android:layout_width="100dp"

        android:layout_height="100dp"

        android:layout_margin="2dp"

       android:background="@drawable/bitmap_drawable_mirror" />

 

    <TextView

        android:id="@+id/text3"

        android:layout_width="100dp"

        android:layout_height="100dp"

        android:layout_margin="2dp"

        android:background="@drawable/bitmap_drawable_clamp"/>

 

</LinearLayout>

 

上面三个TextView分别使用了不同的BitmapDrawable的tileMode，下面分别贴出这三个Drawable的xml文件。

 

bitmap_drawable_repeat.xml:

<?xmlversion="1.0" encoding="utf-8"?>

<bitmapxmlns:android="http://schemas.android.com/apk/res/android"

    android:src="@drawable/image"

    android:tileMode="repeat" />

 

bitmap_drawable_mirror.xml:

<?xmlversion="1.0" encoding="utf-8"?>

<bitmapxmlns:android="http://schemas.android.com/apk/res/android"

    android:src="@drawable/image"

    android:tileMode="mirror" />

 

bitmap_drawable_clamp.xml:

<?xmlversion="1.0" encoding="utf-8"?>

<bitmapxmlns:android="http://schemas.android.com/apk/res/android"

    android:src="@drawable/image"

    android:tileMode="clamp" />

 

    显示效果如图 2。

 

图 2

（2）       ShapeDrawable

首先是MainActivity的布局文件activity_main.xml。

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

   xmlns:tools="http://schemas.android.com/tools"

   android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="horizontal"

   tools:context="com.example.drawabletest.MainActivity" >

 

    <TextView

        android:id="@+id/text1"

        android:layout_width="100dp"

        android:layout_height="100dp"

        android:layout_margin="2dp"

       android:background="@drawable/shape_drawable_gradient_linear"/>

 

    <TextView

        android:id="@+id/text2"

        android:layout_width="100dp"

        android:layout_height="100dp"

        android:layout_margin="2dp"

       android:background="@drawable/shape_drawable_gradient_radius"/>

 

    <TextView

        android:id="@+id/text3"

        android:layout_width="100dp"

        android:layout_height="100dp"

        android:layout_margin="2dp"

        android:background="@drawable/shape_drawable_gradient_sweep"/>

 

</LinearLayout>

上面三个TextView分别使用了不同的ShapeDrawable的type，下面分别贴出这三个Drawable的xml文件。

 

shape_drawable_gradient_linear.xml:

<?xmlversion="1.0" encoding="utf-8"?>

<shapexmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle" >

 

    <gradient

        android:angle="45"

        android:centerColor="#00ff00"

        android:centerX="0.5"

        android:centerY="0.5"

        android:endColor="#0000ff"

        android:startColor="#ff0000"

        android:type="linear" />

 

</shape>

 

shape_drawable_gradient_radius.xml:

<?xmlversion="1.0" encoding="utf-8"?>

<shapexmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle" >

 

    <gradient

        android:centerColor="#00ff00"

        android:endColor="#0000ff"

        android:gradientRadius="50"

        android:startColor="#ff0000"

        android:type="radial" />

 

</shape>

 

shape_drawable_gradient_sweep.xml:

<?xmlversion="1.0" encoding="utf-8"?>

<shapexmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle" >

 

    <gradient

        android:centerColor="#00ff00"

        android:endColor="#0000ff"

        android:gradientRadius="50"

        android:startColor="#ff0000"

        android:type="radial" />

 

</shape>

 

显示效果如图 3。

 

图 3

 

（3）       LayerDrawable

直接贴出layer_drawable.xml代码，作为TextView的background。

<?xmlversion="1.0" encoding="utf-8"?>

<layer-listxmlns:android="http://schemas.android.com/apk/res/android" >

 

    <item>

        <shapeandroid:shape="rectangle" >

            <solidandroid:color="#ff0000" />

        </shape>

    </item>

    <itemandroid:bottom="20dp">

        <shapeandroid:shape="rectangle" >

            <solidandroid:color="#00ff00" />

        </shape>

    </item>

    <item

        android:bottom="10dp"

        android:left="10dp"

        android:right="10dp">

        <shapeandroid:shape="rectangle" >

            <solidandroid:color="#0000ff" />

        </shape>

    </item>

 

</layer-list>

 

显示效果如图 4。

 

图 4

 

（4）       StateListDrawable

直接贴出statelist_drawable.xml代码，作为TextView的background。

 

 

<?xmlversion="1.0" encoding="utf-8"?>

<selectorxmlns:android="http://schemas.android.com/apk/res/android" >

 

    <item

        android:drawable="@drawable/button_pressed"

       android:state_pressed="true"/>

    <!-- 按下TextView时显示此状态 -->

 

    <item

       android:drawable="@drawable/button_focused"

       android:state_focused="true"/>

    <!-- 没有按下TextView且获得焦点时显示此状态 -->

 

    <item android:drawable="@drawable/button_normal"/>

    <!-- TextView默认状态 -->

 

</selector>

 

（5）       LevelListDrawable

直接贴出levellist_drawable.xml代码，作为TextView的background。

<?xmlversion="1.0" encoding="utf-8"?>

<level-listxmlns:android="http://schemas.android.com/apk/res/android" >

 

    <item

       android:drawable="@drawable/low_level"

        android:maxLevel="1000"

        android:minLevel="0"/>

    <!-- 当level为0~1000时，显示此Drawable -->

 

    <item

       android:drawable="@drawable/high_level"

        android:maxLevel="10000"

        android:minLevel="1001"/>

    <!-- 当level为1001~10000时，显示此Drawable -->

 

</level-list>

 

（6）       InsetDrawable

直接贴出inset_drawable.xml代码，作为TextView的background。

<?xmlversion="1.0" encoding="utf-8"?>

<insetxmlns:android="http://schemas.android.com/apk/res/android"

    android:insetBottom="15dp"

    android:insetLeft="15dp"

    android:insetRight="15dp"

    android:insetTop="15dp">

 

    <shape android:shape="rectangle">

        <solid android:color="#00ff00"/>

    </shape>

 

</inset>

 

（7）       ClipDrawable

直接贴出clip_drawable.xml代码，作为ImageView的background。

<?xmlversion="1.0" encoding="utf-8"?>

<clipxmlns:android="http://schemas.android.com/apk/res/android"

    android:clipOrientation="vertical"

    android:drawable="@drawable/image"

android:gravity="bottom"/>

 

ImageView的布局为：

<ImageView

        android:id="@+id/img1"

        android:layout_width="100dp"

        android:layout_height="100dp"

        android:gravity="center"

       android:src="@drawable/clip_drawable" />

 

MainActivity.java代码中：

ImageViewmImageView = (ImageView) findViewById(R.id.img1);

ClipDrawableclipDrawable = (ClipDrawable)mImageView.getDrawable();

clipDrawable.setLevel(5000);

 

                                                                                                                                                                                                                                              作者：济南华清远见高级讲师吴老师