We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Background colour not updating

I have a listview populated with an ObservableCollection with swipe enabled. When a user swipes left it changes a boolean property, TransIgnore, and the background colour should change accordingly.  

I have a custom background colour selector (code at the end) which selects between 2 colours depending on the property setting initiated like this. 

BackgroundColor="{Binding .,Converter={StaticResource ColorConverter},ConverterParameter={x:Reference Name=listView}}"

The issue that I am facing is that when I update the item property, the background colour does not change in realtime. But if I scroll the list up or down (until the item is out of view) and then scroll it back the item background is updated.

How do I ensure the view is updated immediately on change? I have tried listView.RefreshView() but that didn't work. 



private void ListView_SwipeEnded(object sender, Syncfusion.ListView.XForms.SwipeEndedEventArgs e)
        {
            if (e.SwipeOffset > 70)
            {
                BankSMS item = (BankSMS)e.ItemData;
                if (item.TransIgnore) { item.TransIgnore = false; }
                else
                {
                    item.TransIgnore = true;
                }
                db.Update(item);
                //listView.ResetSwipe();
                //listView.RefreshView();
            }
            listView.ResetSwipe();


            //listView.RefreshView();
        }



 public class ColorConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (value == null)
                return false;
            var itemdata = value as BankSMS;
            if (itemdata.TransIgnore)
                return Color.LightGray;
            else
                return "#dfe0df";
        }


        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }

1 Reply

SV Suja Venkatesan Syncfusion Team January 23, 2023 01:43 PM UTC

Hi Toby,


You can achieve your requirement by directly binding the TransIgnore property to the BackGroundColor property as in below code snippet.


Code Snippets:

//XAML:

<sync:SfListView.ItemTemplate>

            <DataTemplate>

                <Grid Padding="10" BackgroundColor="{Binding TransIgnore,Converter={StaticResource ColorConverter},ConverterParameter={x:Reference Name=listView}}">

                    <Grid.RowDefinitions>

                        <RowDefinition Height="0.4*" />

                        <RowDefinition Height="0.6*" />

                    </Grid.RowDefinitions>

                    <Label x:Name="label" Text="{Binding BookName}" FontSize="21" FontAttributes="Bold"/>

                    <Label Grid.Row="1" Text="{Binding BookDescription}" FontSize="15"/>

                </Grid>

            </DataTemplate>

        </sync:SfListView.ItemTemplate>


//C#:

public class ColorConverter : IValueConverter

    {

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)

        {

            if (value == null)

                return false;

            if ((bool)value)

                return Color.Red;

            else

                return "#dfe0df";

        }

 

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)

        {

            throw new NotImplementedException();

        }

    }


The TransIgnore property is bound to the BackgroundColor property, so whenever the value of the BackgroundColor property changes, the converter is automatically triggered. We have attached a runnable sample based on your requirement for your reference. Please let us know if you need any further assistance.


Regards,

Suja


Attachment: GettingStarted_ebc31e9a.zip

Loader.
Live Chat Icon For mobile
Up arrow icon