android5.0新特性 clipping的用法

android5.0新特性 clipping的用法

1.使用场景

    要实现一个按钮的圆角矩形效果，很简单，做过android ui开发的同学应该都会，不就是在drawable中新建一个shape文件，类似如下：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <corners android:radius="30px"/>
    <solid android:color="@android:color/white"/>
</shape>

然后设置为background。

    然而今天的主角不是shape，而是5.0之后的clipping，更加灵活，直接几行代码搞定，不用shape，减少了资源文件的创建

2.实战

首先创建一个clipping_button.xml文件（不懂constraintLayout的同学可以上网搜一搜，这不是本文的重点）：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <Button
        android:background="@color/colorAccent"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        android:id="@+id/clipping_button"
        />
</android.support.constraint.ConstraintLayout>

先来看一看运行的效果

很简单的一个矩形Button，现在我们要用clipping实现圆角矩形效果

import android.app.Activity;
import android.graphics.Outline;
import android.os.Bundle;
import android.view.View;
import android.view.ViewOutlineProvider;

public class MainActivity extends Activity {
    private View view;

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

        view = findViewById(R.id.clipping_button);
        ViewOutlineProvider viewOutlineProvider = new ViewOutlineProvider() {
            @Override
            public void getOutline(View view, Outline outline) {
                //别忘了加哦，不然没有效果
                view.setClipToOutline(true);
                outline.setRoundRect(0,0,view.getWidth(),view.getHeight(),30);
            }
        };
        view.setOutlineProvider(viewOutlineProvider);
    }
}

再来看一看效果图