skip to Main Content

I’d like to add some icons in my app especially in listviews using custom cell and specify the color to be rendered.
I don’t want to edit each image in Photoshop; I want to apply an overlay color at runtime.

Is that possible with a custom renderer?

2

Answers


  1. No it is not possible through standard Image class provided in Xamarin.Forms.

    But you can use this amazing IconView custom renderer created by this guy. I use it all the time it is amazing.

    IconView for Xamarin Forms

    Usage

    <?xml version="1.0" encoding="UTF-8"?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 x:Class="IconApp.MyPage"
                 xmlns:controls="clr-namespace:IconApp;assembly=IconApp">
      <controls:IconView Source="monkey"
                         Foreground="Red"
                         WidthRequest="100"
                         HeightRequest="100"
                         HorizontalOptions="Center"
                         VerticalOptions="Center" />
    </ContentPage>
    

    Just specify the Foreground="Red" property color

    enter image description here

    Login or Signup to reply.
  2. Now We got another way with Xamarin.CommunityToolkit. We can use its IconTintColorEffect.TintColor for changing Tint Color or Overlay of an Image.

    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:xct="http://xamarin.com/schemas/2020/toolkit"
             x:Class="MyLittleApp.MainPage">
        <StackLayout>
            <Image Source="monkey" xct:IconTintColorEffect.TintColor="Red" />
        </StackLayout>
    </ContentPage>
    

    Xamarin.CommunityToolkit is handy and provides lot of features such as Shadows on any View, EventToCommandBehavior for MVVMifying lot of Events and Controls, it also has additional Converters, Extensions, Helpers, and Views that are not available in builtin Xamarin Forms yet.

    Refer for more Documentation

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search