Background colour not updating

[Toby Mills]

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();
        }
    }

[Suja Venkatesan]

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