zoukankan      html  css  js  c++  java
  • canvas.saveLayerAlpha实现“回”矩形框绘制效果

    效果如图:

    代码如下:

    canvas.drawBitmap(mb, 100, 100, mPaint);
    
    RectF innerRect = new RectF(250, 250, 550, 550);
    RectF outterRect = new RectF(100, 100, 100 + mb.getWidth(), 100 + mb.getHeight());
    
    canvas.saveLayerAlpha(outterRect, 0xC8,LAYER_FLAGS);
    mPaint.setStyle(Style.FILL_AND_STROKE);
    mPaint.setColor(getResources().getColor(R.color.the_color));
    canvas.drawRect(innerRect, mPaint);
    
    PorterDuffXfermode mode = new PorterDuffXfermode(
    		PorterDuff.Mode.SRC_OUT);
    mPaint.setXfermode(mode);
    canvas.drawRect(outterRect, mPaint);
    canvas.restore();
    

     bitmap在原图层上绘制,调用saveLayerAlpha函数另取一个图层绘制回形框,0xC8是该图层的透明度,图层大小这里设置对应为bitmap大小,当然也可以设置为屏幕大小。

    然后绘制回形框的内矩形和外矩形,并使用SRC_OUT设置只绘制两个矩形框的不相交部分。回形框可以使用画笔绘制任意颜色,这里指定土灰色是为了配合透明度实现类似磨砂玻璃屏的效果,当然实际效果使用模糊算法实现最好。

    PorterDuff.Mode的枚举值如下:

     PorterDuff.Mode为枚举类,一共有16个枚举值:
    1.PorterDuff.Mode.CLEAR 
      所绘制不会提交到画布上。
    2.PorterDuff.Mode.SRC
       显示上层绘制图片
    3.PorterDuff.Mode.DST
      显示下层绘制图片
    4.PorterDuff.Mode.SRC_OVER
      正常绘制显示,上下层绘制叠盖。
    5.PorterDuff.Mode.DST_OVER
      上下层都显示。下层居上显示。
    6.PorterDuff.Mode.SRC_IN
       取两层绘制交集。显示上层。
    7.PorterDuff.Mode.DST_IN
      取两层绘制交集。显示下层。
    8.PorterDuff.Mode.SRC_OUT
     取上层绘制非交集部分。
    9.PorterDuff.Mode.DST_OUT
     取下层绘制非交集部分。
    10.PorterDuff.Mode.SRC_ATOP
     取下层非交集部分与上层交集部分
    11.PorterDuff.Mode.DST_ATOP
     取上层非交集部分与下层交集部分
    12.PorterDuff.Mode.XOR
      异或:去除两图层交集部分
    13.PorterDuff.Mode.DARKEN
      取两图层全部区域,交集部分颜色加深
    14.PorterDuff.Mode.LIGHTEN
      取两图层全部,点亮交集部分颜色
    15.PorterDuff.Mode.MULTIPLY
      取两图层交集部分叠加后颜色
    16.PorterDuff.Mode.SCREEN
      取两图层全部区域,交集部分变为透明色

    其中后绘制的内容在上层,先绘制的内容在下层。

  • 相关阅读:
    20169205 2016-2017-2 《移动平台应用开发实践》第4周学习总结
    20169205 2016-2017-2《网络攻防》第4周总结
    20169205 2016-2017-2 《移动平台应用开发实践》第3周学习总结
    tcpdump使用
    wireshark使用
    20169205 2016-2017-2《网络攻防》第3周总结
    OpenSSH/PuTTY/SSH使用
    Aircrack使用
    Metasploit使用
    20155325 2017-2018 1 《信息安全系统设计基础》 第十周学习总结
  • 原文地址:https://www.cnblogs.com/fordreamxin/p/4725307.html
Copyright © 2011-2022 走看看