Android Drawable - Clip Drawable使用详解（附图）

一个可以根据level等级, 来裁剪的Drawable

资源放置位置:
　　Eclipse/AS: res/drawable/filename.xml

引用用法:
　　In Java: R.drawable.filename
　　In XML: @drawable/filename

语法:

<?xml version="1.0" encoding="utf-8"?>
<clip
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/drawable_resource"
    android:clipOrientation=["horizontal" | "vertical"]
    android:gravity=["top" | "bottom" | "left" | "right" | "center_vertical" |
                    "fill_vertical" | "center_horizontal" | "fill_horizontal" |
                    "center" | "fill" | "clip_vertical" | "clip_horizontal"] />

• 首个标签必须是clip;
• android:drawable: Drawable资源引用;
• android:clipOrientation: 裁剪方向;
• android:gravity: 配合clipOrientation使用, 一共36种效果, 直接看后面的效果图吧:

同样Clip Drawable不能单独使用, 需要配合Level等级

下图主要是改变裁剪方向android:clipOrientation 参数产生的不同的效果: horizontal – vertical – horizontal | vertical

• horizontal: 只在水平的方向上裁剪
• vertical: 只在竖直的方向上裁剪
• horizontal | vertical: 在水平和竖直两个方向上裁剪

布局XML代码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical">

    <!--文字-->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Clip Drawable horizontal/Center"/>

    <!--横线-->
    <View
        android:layout_width="match_parent"
        android:layout_height="1dip"
        android:background="@android:color/black"/>

    <!--Clip Drawable horizontal/Center-->
    <TextView
        android:id="@+id/tv1"
        android:layout_width="match_parent"
        android:layout_height="80dip"
        android:background="@drawable/clip_drawable_t_horizontal"/>

    <!--文字-->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Clip Drawable vertical/Center"/>

    <!--横线-->
    <View
        android:layout_width="match_parent"
        android:layout_height="1dip"
        android:background="@android:color/black"/>

    <!--Clip Drawable vertical/Center-->
    <TextView
        android:id="@+id/tv2"
        android:layout_width="match_parent"
        android:layout_height="80dip"
        android:background="@drawable/clip_drawable_t_vertical"/>

    <!--文字-->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Clip Drawable horizontal | vertical/Center"/>

    <!--横线-->
    <View
        android:layout_width="match_parent"
        android:layout_height="1dip"
        android:background="@android:color/black"/>

    <!--Clip Drawable horizontal | vertical/Center-->
    <TextView
        android:id="@+id/tv3"
        android:layout_width="match_parent"
        android:layout_height="80dip"
        android:background="@drawable/clip_drawable_t_horizontal_vertical"/>

    <!--set Level 0-->
    <Button
        android:id="@+id/btn1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="set Level 0"
        android:textAllCaps="false"/>

    <!--set Level 1000-->
    <Button
        android:id="@+id/btn2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="set Level 1000"
        android:textAllCaps="false"/>

    <!--set Level 5000-->
    <Button
        android:id="@+id/btn3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="set Level 5000"
        android:textAllCaps="false"/>

    <!--set Level 8000-->
    <Button
        android:id="@+id/btn4"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="set Level 8000"
        android:textAllCaps="false"/>

    <!--set Level 10000-->
    <Button
        android:id="@+id/btn5"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="set Level 10000"
        android:textAllCaps="false"/>
</LinearLayout>

clip_drawable_t_horizontal.xml

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
      android:clipOrientation="horizontal"
      android:drawable="@mipmap/img_clip"
      android:gravity="center">
</clip>

clip_drawable_t_vertical.xml

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
      android:clipOrientation="vertical"
      android:drawable="@mipmap/img_clip"
      android:gravity="center">
</clip>

clip_drawable_t_horizontal.xml

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
      android:clipOrientation="horizontal|vertical"
      android:drawable="@mipmap/img_clip"
      android:gravity="center">
</clip>

Java代码

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.test_clip_);
    final TextView textView1 = (TextView) findViewById(R.id.tv1);
    final TextView textView2 = (TextView) findViewById(R.id.tv2);
    final TextView textView3 = (TextView) findViewById(R.id.tv3);
    textView1.getBackground().setLevel(10000);
    textView2.getBackground().setLevel(10000);
    textView3.getBackground().setLevel(10000);
    findViewById(R.id.btn1).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            textView1.getBackground().setLevel(0);
            textView2.getBackground().setLevel(0);
            textView3.getBackground().setLevel(0);
        }
    });
    findViewById(R.id.btn2).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            textView1.getBackground().setLevel(1000);
            textView2.getBackground().setLevel(1000);
            textView3.getBackground().setLevel(1000);
        }
    });
    findViewById(R.id.btn3).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            textView1.getBackground().setLevel(5000);
            textView2.getBackground().setLevel(5000);
            textView3.getBackground().setLevel(5000);
        }
    });
    findViewById(R.id.btn4).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            textView1.getBackground().setLevel(8000);
            textView2.getBackground().setLevel(8000);
            textView3.getBackground().setLevel(8000);
        }
    });
    findViewById(R.id.btn5).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            textView1.getBackground().setLevel(10000);
            textView2.getBackground().setLevel(10000);
            textView3.getBackground().setLevel(10000);
        }
    });
}

来看看其他情况:

* 当clipOrientation为horizontal时

android:clipOrientation=”horizontal”

* 当clipOrientation为vertical时

android:clipOrientation=”vertical”

* 当clipOrientation为horizontal | vertical时;

android:clipOrientation=”horizontal|vertical”

Java代码：

    boolean flag;
    private Runnable startScaleThread = new Runnable() {
        @Override
        public void run() {
            //int level = imageView.getDrawable().getLevel();
            int level = tv1.getBackground().getLevel();
            //缩小动画
            if (flag) {
                level += 100;
                if (level >= 10000) {
                    flag = false;
                    //Toast.makeText(ScaleActivity.this, "缩小", Toast.LENGTH_SHORT).show();
                }
                //放大动画
            } else {
                level -= 100;
                if (level <= 100) {
                    flag = true;
                    //Toast.makeText(ScaleActivity.this, "放大", Toast.LENGTH_SHORT).show();
                }
            }
            //imageView.getDrawable().setLevel(level);
            tv1.getBackground().setLevel(level);
            tv2.getBackground().setLevel(level);
            tv3.getBackground().setLevel(level);
            tv4.getBackground().setLevel(level);
            tv5.getBackground().setLevel(level);
            tv6.getBackground().setLevel(level);
            tv1.postDelayed(startScaleThread, 10);
        }
    };