Changing the background color of the itemstyle dynamically

2 posts, 0 answers
  1. FS
    FS avatar
    21 posts
    Member since:
    Mar 2012

    Posted 20 Jul 2016 Link to this post



    We just downloaded the Telerik Xamarin UI controls for evaluation.

    We need to know the approach to change  the background color of an itemstyle based on a property in my custom object.  For example, if the Amount property of our object is less than 10 dollars, we want to set the backcolor in red.  If the Amount is greater than 10, we want to set it to a green backcolor.  





  2. Lance | Manager Technical Support
    Lance | Manager Technical Support avatar
    1193 posts

    Posted 22 Jul 2016 Link to this post

    Hi David,

    You can accomplish this with a Converter. As an example, imagine we have a list of cars, where a car is:

    public class Car
        public string Make {get; set;}
        public double Price {get;set;}

    That list of cars is bound to the ListView and we're using this ItemTemplate:

                      <Grid BackgroundColor="{Binding Converter={StaticResource PriceColorConverter}}">
                            <Label Text="{Binding Make}" />

    The StaticResource PriceColorConverter is defined as:

    <converters:PriceColorConverter x:Key="PriceColorConverter" />

    The BackgroundColor binding passes the bound object to the converter, in which you return the appropriate color based of a property's value.

    For example, I make the background Red if it's over 50,000 and Green otherwise.

    public class PriceColorConverter : IValueConverter
            public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
                if (value == null)
                    return null;
                var car = value as Car;
                if(car.Price > 50000)
                   return Color.Red;
                return Color.Green;
            public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
                throw new NotImplementedException();

    Let us know if you have any further questions or concerns. Thank you for contacting Telerik Support and for choosing UI for Xamarin.

    Lance | Tech Support Engineer, Sr.
    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top