![Android App开发进阶与项目实战](https://wfqqreader-1252317822.image.myqcloud.com/cover/109/44510109/b_44510109.jpg)
上QQ阅读APP看书,第一时间看更新
1.3.2 剪裁图形内部区域
有时候为了美观,并不会显示整个图像,而是显示剪裁后的图像,比如QQ的圆形头像、微信的圆角矩形头像都剪成了圆润的模样。
图形剪裁正是位图图形的拿手好戏,只要调用画笔工具的setShader方法,设置位图着色器之后再调用画布工具的draw***方法即可剪裁出指定几何形状的图像。比如下面的定义椭圆图形的代码,寥寥几行便实现了椭圆剪裁功能:
(完整代码见picture\src\main\java\com\example\picture\widget\OvalDrawable.java)
![](https://epubservercos.yuewen.com/0C084D/23721623101012206/epubprivate/OEBPS/Images/Figure-P35_17229.jpg?sign=1739294065-3rLSJQNH2DTS6B5y1cxmQUnew8goZjPB-0-714da8d4c7698cb0adc249ffa5ec7a93)
又如下面定义圆角矩形的代码,简洁程度不遑多让:
(完整代码见picture\src\main\java\com\example\picture\widget\RoundDrawable.java)
![](https://epubservercos.yuewen.com/0C084D/23721623101012206/epubprivate/OEBPS/Images/Figure-P35_17231.jpg?sign=1739294065-crXjkxEriNsFx0NMmxyxWCUbACIbsxNg-0-49222ddbd634024de4d985323839b8b9)
再如下面的定义圆形的代码,其精炼程度毫不逊色:
(完整代码见picture\src\main\java\com\example\picture\widget\CircleDrawable.java)
![](https://epubservercos.yuewen.com/0C084D/23721623101012206/epubprivate/OEBPS/Images/Figure-P36_17234.jpg?sign=1739294065-7xU3QucKUb4Ko9R8mZAmLievhmLEb1AW-0-0f43e9aa1ca8783bd4bd58f907f4e87a)
接下来只要在活动页面的代码中设置上述图形,就能显示几何剪裁之后的图像。运行并测试该App,图形剪裁效果如图1-22~图1-25所示。图1-22为尚未剪裁的画面,图1-23为圆形剪裁后的画面,图1-24为椭圆剪裁后的画面,图1-25为圆角矩形剪裁后的画面。
![](https://epubservercos.yuewen.com/0C084D/23721623101012206/epubprivate/OEBPS/Images/Figure-P36_3408.jpg?sign=1739294065-KCMAhCaCdKv03ibr556liT51h39gjTb6-0-257a20c2bbce0ae3092b51bed736f061)
图1-22 尚未剪裁的画面
![](https://epubservercos.yuewen.com/0C084D/23721623101012206/epubprivate/OEBPS/Images/Figure-P36_3409.jpg?sign=1739294065-S9liCMDWz6Jx3BoMaMmQL1wPIqKULfiJ-0-7da199c6e281a9c31e73b21595b378f4)
图1-23 圆形剪裁后的画面
![](https://epubservercos.yuewen.com/0C084D/23721623101012206/epubprivate/OEBPS/Images/Figure-P37_3414.jpg?sign=1739294065-jRDumKkyQUPwBc0EitB7GG6unwWp4qgS-0-fd6bfafde05ad9e54ad1d8b58e54f1f8)
图1-24 椭圆剪裁后的画面
![](https://epubservercos.yuewen.com/0C084D/23721623101012206/epubprivate/OEBPS/Images/Figure-P37_3415.jpg?sign=1739294065-hjBoaWKMiUIKVBGY00jKlFrU8Z6DrkVV-0-58a3ef3d56e235a7c31ab74465b135e8)
图1-25 圆角矩形剪裁后的画面