Блог

Я пытаюсь сделать так, чтобы моя иконка выглядела вот так:

Тем не менее, это выглядит так:

Это мой код:

 lt;com.google.android.material.floatingactionbutton.FloatingActionButton  style="@style/FAB"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:src="@drawable/ic_baseline_favorite_border_24"/gt;  lt;style name="FAB" parent="Widget.Design.FloatingActionButton"gt;  lt;item name="shapeAppearanceOverlay"gt;@style/FABShapelt;/itemgt;  lt;item name="android:backgroundTint"gt;@color/blacklt;/itemgt;  lt;item name="android:tint"gt;@color/yellowlt;/itemgt; lt;/stylegt;  lt;style name="FABShape" parent="ShapeAppearance.MaterialComponents.SmallComponent"gt;  lt;item name="cornerSize"gt;10%lt;/itemgt; lt;/stylegt;  

Это вектор для формы сердца (от Google):

 lt;vector xmlns:android="http://schemas.android.com/apk/res/android"  android:width="24dp"  android:height="24dp"  android:viewportWidth="24"  android:viewportHeight="24"  android:tint="?attr/colorControlNormal"gt;  lt;path  android:fillColor="@android:color/white"  android:pathData="M16.5,3c-1.74,0 -3.41,0.81 -4.5,2.09C10.91,3.81 9.24,3 7.5,3 4.42,3 2,5.42 2,8.5c0,3.78 3.4,6.86 8.55,11.54L12,21.35l1.45,-1.32C18.6,15.36 22,12.28 22,8.5 22,5.42 19.58,3 16.5,3zM12.1,18.55l-0.1,0.1 -0.1,-0.1C7.14,14.24 4,11.39 4,8.5 4,6.5 5.5,5 7.5,5c1.54,0 3.04,0.99 3.57,2.36h1.87C13.46,5.99 14.96,5 16.5,5c2,0 3.5,1.5 3.5,3.5 0,2.89 -3.14,5.74 -7.9,10.05z"/gt; lt;/vectorgt;  

Я ожидаю, что вектор будет пустой формой сердца. Но когда я наношу на него оттеночный цвет, он окрашивает его изнутри. Есть ли способ, которым я могу заставить цвет оттенка применяться только к внешней стороне формы сердца?

 lt;vector xmlns:android="http://schemas.android.com/apk/res/android"  android:width="24dp"  android:height="24dp"  android:viewportWidth="24"  android:viewportHeight="24"  android:tint="?attr/colorControlNormal"gt;  lt;path  android:fillColor="@android:color/white"  android:pathData="M16.5,3c-1.74,0 -3.41,0.81 -4.5,2.09C10.91,3.81 9.24,3 7.5,3 4.42,3 2,5.42 2,8.5c0,3.78 3.4,6.86 8.55,11.54L12,21.35l1.45,-1.32C18.6,15.36 22,12.28 22,8.5 22,5.42 19.58,3 16.5,3zM12.1,18.55l-0.1,0.1 -0.1,-0.1C7.14,14.24 4,11.39 4,8.5 4,6.5 5.5,5 7.5,5c1.54,0 3.04,0.99 3.57,2.36h1.87C13.46,5.99 14.96,5 16.5,5c2,0 3.5,1.5 3.5,3.5 0,2.89 -3.14,5.74 -7.9,10.05z"/gt;  lt;group  android:scaleX="0.95"  android:scaleY="0.95"  gt;  lt;path  android:fillColor="@android:color/black"  android:pathData="M16.5,3c-1.74,0 -3.41,0.81 -4.5,2.09C10.91,3.81 9.24,3 7.5,3 4.42,3 2,5.42 2,8.5c0,3.78 3.4,6.86 8.55,11.54L12,21.35l1.45,-1.32C18.6,15.36 22,12.28 22,8.5 22,5.42 19.58,3 16.5,3zM12.1,18.55l-0.1,0.1 -0.1,-0.1C7.14,14.24 4,11.39 4,8.5 4,6.5 5.5,5 7.5,5c1.54,0 3.04,0.99 3.57,2.36h1.87C13.46,5.99 14.96,5 16.5,5c2,0 3.5,1.5 3.5,3.5 0,2.89 -3.14,5.74 -7.9,10.05z"/gt;  lt;/groupgt;  lt;/vectorgt;  

Вы могли бы использовать тот же путь, который создает сердце, но немного уменьшите его. Если вы раскрасите его так же, как фон, он будет выглядеть как контур сердца, а не как целое сердце.