如何在action bar中显示圆形logo？

Question

想实现如上图Google+的action bar，显示圆形logo（指定的drawable）。如何实现？

Answer 1

使用的话可以直接用下面2个库:
https://github.com/hdodenhof/CircleImageView
https://github.com/vinc3m1/RoundedImageView

原理的话...
就是在Paint上使用PorterDuffXfermode

首先用 canvas.drawCircle方法画一个圆,然后设置PorterDuffXfermode,用正交模式,
再绘制bitmap, 这样前后绘制的2个图形只显示交集部分...图片就只剩个圆了..

第二种方式是Shader
简单理解的话可以认为是把 bitmap 作成paint的纹理,然后用paint直接在canvas上画圆

上面2个库都有源代码...

---

Answer 2

#logo {

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    border:1px solid white;

    width: 50px;
    height: 50px;

    background-image: url('xxx.xx');
    background-size: cover;

}