Android画圆角矩形图片，并在图片上写字

参考博文：

2011.10.10——— android 画图之setXfermode

刚做一个应用，UI设计的效果是需要在Android中用已有的图片画出一个矩形图形，并且要在图形上写不同的字样。

参考了上面的博文，制定的实现思路如下：

1、创建一个drawable对象，一个输出的Bitmap并以此创建一个画布

        //根据源文件新建一个darwable对象
        Drawable imageDrawable = getResources().getDrawable(id);
        // 新建一个新的输出图片
        Bitmap output = Bitmap.createBitmap(169, 169, Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(output);

2、创建圆角矩形

        // 新建一个矩形
        RectF outerRect = new RectF(0, 0, 169, 169);
        // 产生一个红色的圆角矩形或者任何有色颜色，不能是透明！
        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(Color.RED);
        canvas.drawRoundRect(outerRect, 10, 10, paint);
3、在矩形上画图形

        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        imageDrawable.setBounds(0, 0, 169, 169);
        imageDrawable.draw(canvas);

4、写字

        paint.setTextSize(24);
       paint.setColor(Color.WHITE);
       paint.setTextAlign(Paint.Align.CENTER);
       paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP));
       canvas.drawText(s , 85 , 159 , paint);

这样，就完成了想要的效果。

Android画圆角矩形图片，并在图片上写字_第1张图片

这是调用了9次，每一次用不同的背景图。

总结，在上面的实现过程中，使用了两次 paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP));

不过(PorterDuff.Mode.SRC_ATOP)并不相同。而实现的关键正在此处！

先看不同的Mode值是代表了什么样的效果。但在此之前，需明确两个变量：dst，src（dst是画布原有的图形，src是新画上去的图形）。

Android画圆角矩形图片，并在图片上写字_第2张图片

因此这就是我的实现逻辑：

先画圆角矩形，这时圆角矩形是dst，然后画图形，图形是src，使用Mode是srcIn，这样就形成了圆角矩形；

接下来，圆角矩形图形是dst，然后画文字，文字是src，使用Mode是srcATop，这样就形成了在圆角图形上写字的效果。

2011.10.10——— android 画图之setXfermode

更多相关文章

随机推荐