Android5.0新特性 之 "視圖裁剪"ViewOutlineProvider

視圖裁剪能讓你輕鬆地改變視圖的形狀。你可以爲了一致性而使用其他的設計元素裁剪視圖或者爲了響應用戶的輸入改變視圖的形狀。

ViewOutlineProvider(輪廓提供者的使用步驟)

1. 自定義輪廓提供者，並重寫getOutline方法來提取輪廓；

2. 通過view.setClipToOutline(true)方法來開啓組件的裁剪功能；

3. 通過view.setOutlineProvider(new MyViewOutlineProvider() 方法設置自定義的輪廓提供者來完成裁剪。

下面是一個小Demo來說明如何使用ViewOutlineProvider。

//activity_main.xml 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns: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="vertical"
    tools:context="com.czj.androidl_viewoutlineproviderdemo.MainActivity">

    <Button
        android:text="裁剪"
        android:onClick="btnClick"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <ImageView
        android:id="@+id/iv"
        android:scaleType="centerCrop"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:src="@mipmap/p1"
        />
</LinearLayout>

//MainActivity.java
	
package com.czj.androidl_viewoutlineproviderdemo;

import android.graphics.Outline;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewOutlineProvider;
import android.widget.Button;
import android.widget.ImageView;

/**
 * 輪廓提供者的使用步驟
 * 1. 自定義輪廓提供者，並且重寫getOutline方法來提取輪廓
 * 2. 通過view.setClipToOutline(true)方法開啓組建的裁剪功能
 * 3. 通過.setOutlineProvider(new MyViewOutlineProvider())方法設置自定義的輪廓提供者完成裁剪
 *
 */
public class MainActivity extends AppCompatActivity {

    private ImageView imageView;
    private Button btn;

    //1. 自定義一個輪廓提供者
    private ViewOutlineProvider viewOutlineProvider = new ViewOutlineProvider() {
        @Override
        public void getOutline(View view, Outline outline) {
            //裁剪成一個圓形
            outline.setOval(0,0,view.getWidth(),view.getHeight());
        }
    };


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        imageView = (ImageView) findViewById(R.id.iv);
        imageView.setOutlineProvider(viewOutlineProvider);//把自定義的輪廓提供者設置給imageView
    }

    public void btnClick(View view){
        if (imageView.getClipToOutline()){
            imageView.setClipToOutline(false);//關閉裁剪
        }else{
            imageView.setClipToOutline(true);//開啓裁剪
        }


    }
}

	效果：

	1. 在未點擊Button按鈕之前（未裁剪）的運行效果圖如下所示：

	2. 在點擊按鈕進行裁剪之後的效果圖如下：