点击查看济南黑马校区最新开班计划

Android中如何将图片裁切成三角形并设置阴影

Android5.0之后，可以通过轮廓来裁切一个View。但是这种方式只能用来裁切矩形、圆形和圆角矩形。不支持三角形。所以要想实现这个效果，只能另辟蹊径。

我们知道可以利用PorterDuffXferMode来进形图片的混合。所以我们的思路就来了。分两步：

1. 先找一张三角形的图片。然后采用PorterDuff.Mode.SRC_IN将原图裁切成三角形图片，设置给一个ImageView。

2.给这个ImageView设置三角形的阴影。

首先材料准备:

第一步，先用这个三角形的图片把这个美女裁成三角形，并设置个ImageView，代码如下：

[AppleScript] 纯文本查看 复制代码

//先将原图和裁切用的三角形图片准备好
        Bitmap source = BitmapFactory.decodeResource(getResources(), R.drawable.girl);
        Bitmap mask = BitmapFactory.decodeResource(getResources(), R.drawable.triangle);
        
        //穿件一个空的Bitmap用来存放合成的图片
        final Bitmap result = Bitmap.createBitmap(source.getWidth(), source.getHeight(), Config.ARGB_8888);
        Canvas canvas = new Canvas(result);
        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(Color.BLACK);

        canvas.drawBitmap(mask, 0, 0, paint);
        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(source, 0, 0, paint);
        paint.setXfermode(null);
        
        iv.setImageBitmap(result);

第二步，给这个ImageView设置一个三角形的阴影，代码如下：

[AppleScript] 纯文本查看 复制代码

iv.setOutlineProvider(new ViewOutlineProvider() {
                @Override
                public void getOutline(View view, Outline outline) {
                    int x = (view.getWidth() - result.getWidth()) / 2;
                    int y = (view.getHeight() - result.getHeight()) / 2;

                    Path path = new Path();
                    path.moveTo(x, y);
                    path.lineTo(x+result.getWidth(), y);
                    path.lineTo(x+result.getWidth()/2, y+result.getHeight());
                    path.lineTo(x, y);
                    path.close();

                    outline.setConvexPath(path);
                }
            });

到此，我们完美的实现了这个效果。

cliptriangle.zip (69.74 KB, 下载次数: 288)

2016-9-30 16:49 上传

点击文件名下载附件
完整代码

好帅！！！

不错不错

不错，好帖

每天都坚持来黑马

攀哥,牛啊!

多谢分享