March 14, 2017
Function clip path限制在画布上绘制的区域,在clip path所指定的区域外的位置不会被绘制。
我们通过下面的心形图标来展示clip path的效果:
<vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="56dp" android:height="56dp" android:viewportHeight="56" android:viewportWidth="56"> <path android:fillColor="@android:color/black" android:pathData="M28,39 L26.405,37.5667575 C20.74,32.4713896 17,29.1089918 17,24.9945504 C17,21.6321526 19.6565,19 23.05,19 C24.964,19 26.801,19.8828338 28,21.2724796 C29.199,19.8828338 31.036,19 32.95,19 C36.3435,19 39,21.6321526 39,24.9945504 C39,29.1089918 35.26,32.4713896 29.595,37.5667575 L28,39 L28,39 Z"/> </vector> Figure1 心形图标
下面加入<clip-path>将绘制区域限制在[0, 0, 56, 28]的矩形区域内:
<vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="56dp" android:height="56dp" android:viewportHeight="56" android:viewportWidth="56"> <clip-path android:name="clip" android:pathData="M0 0 L56 0 L56 28 L0 28 Z"/> <path android:fillColor="@android:color/black" android:pathData="M28,39 L26.405,37.5667575 C20.74,32.4713896 17,29.1089918 17,24.9945504 C17,21.6321526 19.6565,19 23.