ViewOutlineProvider设置圆角矩形等形状

ViewOutlineProvider设置圆角矩形等形状

在项目开发中，为了让图片显示得更加美观，通常 UI 会设计成圆角矩形或圆形效果。介绍一种简单的原生方法设置圆角。

ViewOutlineProvider是Android 5.x引入的新特性（SDK_INT >= 21），它是View包中的类，用于实现View的阴影和轮廓。用ViewOutlineProvider可以快捷地实现控件的圆角(Kotlin实现)，通过Outline中的setRoundRect/setOval方法来设置圆角矩形、椭圆等形状，还有其它API方法可以自行了解。

val outlineProvider  = object : ViewOutlineProvider() {
        override fun getOutline(view: View, outline: Outline) {
            // 设置圆角率为
            outline.setRoundRect(0, 0, view.width, view.height, radius)
            
            //或者设置圆形
            outline?.setOval(0, 0, it.width, it.height)
        }
    }

再通过View的setOutlineProvider(ViewOutlineProvider provider)方法将自定义的ViewOutlineProvider设置给View：

view.outlineProvider =  outlineProvider

最后别忘了启用Outline：

//视图会根据outlineProvider提供的轮廓进行裁剪。任何超出轮廓的部分都会被裁剪掉
    view.clipToOutline = true

ViewOutlineProvider内置三种默认的实现BACKGROUND、BOUNDS、PADDED_BOUNDS：

①BACKGROUND：使用视图的背景（Background）来确定轮廓边界(如果视图没有背景，则轮廓将不会生效)。视图的背景可以是一个 Drawable，例如 ShapeDrawable 或 BitmapDrawable。轮廓会根据背景的形状进行调整。适用场景：当你需要根据视图的背景来设置轮廓时，例如背景是一个圆形或椭圆形的 Drawable。

/**
     * Default outline provider for Views, which queries the Outline from the View's background,
     * or generates a 0 alpha, rectangular Outline the size of the View if a background
     * isn't present.
     *
     * @see Drawable#getOutline(Outline)
     */
    public static final ViewOutlineProvider BACKGROUND = new ViewOutlineProvider() {
        @Override
        public void getOutline(View view, Outline outline) {
            Drawable background = view.getBackground();
            if (background != null) {
                background.getOutline(outline);
            } else {
                outline.setRect(0, 0, view.getWidth(), view.getHeight());
                outline.setAlpha(0.0f);
            }
        }
    };

②BOUNDS：使用视图的边界（Bounds）来确定轮廓边界。轮廓会根据视图的宽高来设置，形成一个矩形轮廓。适用场景：当你需要一个简单的矩形轮廓时，例如给一个普通的View添加圆角效果。

/**
     * Maintains the outline of the View to match its rectangular bounds,
     * at <code>1.0f</code> alpha.
     *
     * This can be used to enable Views that are opaque but lacking a background cast a shadow.
     */
    public static final ViewOutlineProvider BOUNDS = new ViewOutlineProvider() {
        @Override
        public void getOutline(View view, Outline outline) {
            outline.setRect(0, 0, view.getWidth(), view.getHeight());
        }
    };

③PADDED_BOUNDS：使用视图的边界加上内边距（Padding）来确定轮廓边界。轮廓会根据视图的宽高和内边距来设置，形成一个矩形轮廓。适用场景：当你需要在视图的内边距之外添加轮廓时，例如给一个有内边距的View添加圆角效果。

/**
     * Maintains the outline of the View to match its rectangular padded bounds,
     * at <code>1.0f</code> alpha.
     *
     * This can be used to enable Views that are opaque but lacking a background cast a shadow.
     */
    public static final ViewOutlineProvider PADDED_BOUNDS = new ViewOutlineProvider() {
        @Override
        public void getOutline(View view, Outline outline) {
            outline.setRect(view.getPaddingLeft(),
                    view.getPaddingTop(),
                    view.getWidth() - view.getPaddingRight(),
                    view.getHeight() - view.getPaddingBottom());
        }
    };