Xamarin Forms How to change image color dynamically?

Xamarin Forms How to change image color dynamically?

We often encounter a situation where we need to use the same image in different colors. In this case, instead of using the same image with different colors, we can create our own control, allowing us to use the change icon color dynamically. Let’s call it IconView.

IconView allows you to give the color of your choice to the icons you use in your application. For example, you can change the color of a red icon to blue, green, etc., without having to change the icon.

Let’s see how to do it.

First, let's create a class that derives from View.

PCL code:

Android Implementation:

Add following code in your Android layer:

iOS implementation:

Add following code in your iOS layer:

That's it; now, if you want to change the icon's color, you can change the stain immediately instead of adding a new hero to your project.

Usage: ­­­Here, I am going to use the same image with different Red & Green colors.

Note: It is mandatory to give foreground color to make the image visible.

Output: As you can see, the same image with a different color.

‍

Image credit: ‍Image by story set on Freepik