CODEWITHSUNDEEP
xamllistviewxamarin.formsobservablecollectioninotifypropertychanged
Aphire
Aphire

Reputation: 1652

ListView binding only updating UI when scrolling

I have a Xamarin Forms project, using ViewModels and XAML binding. I have a particular ListView that is bound to an ObservableCollection of a particular object.

On-click I am trying to change the colour of the button, I can see that the event is firing, and the PropertyChanged is working as expected, however the button doesn't change colour until I scroll down the ListView so that it no longer is in view, then scroll back up to it. Once I scroll back, I assume this triggers some kind of "Let me know your state so I can display you" event which is then picking up the change.

Below is my XAML:

<ListView CachingStrategy="RecycleElement" ItemsSource="{Binding ListViewItems}" Margin="0,20,0,0" RowHeight="130" SeparatorVisibility="None" VerticalOptions="FillAndExpand" Grid.Column="1" Grid.Row ="0" >
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Button Command="{Binding HeatClickedCommand}" Margin="5,10,5,10" HorizontalOptions ="FillAndExpand" BackgroundColor="{Binding color_hex}" Grid.Column="1" TextColor="{StaticResource LightTextColor}" FontSize="Medium" Text="{Binding heat_title}"></Button>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

You may notice that I am using CachingStrategy="RecycleElement" which perhaps may have sometime to do with this issue, the reason behind this is explained in a previous SO post here.

Essentially having the default CachingStrategy caused unexpected results.

Upvotes: 2

Views: 1349

Answers (1)

Gerald Versluis
Gerald Versluis

Reputation: 34083

To update the view immediately, you will have to implement the INotifyPropertyChanged interface on your model. With this interface, whenever a property value changed, it will notify the UI and update accordingly.

The reason it is updated whenever you scroll is because the cell is repainted or even repopulated altogether.

Do not mistakenly think that using a ObservableCollection will do that, since that only reflects updates in the collection structure, not the models in it.

Upvotes: 5

Related Questions