Grid UI not updated correctly

[Gunnar Carlson]

I have a fairly simple grid that doesn't behave as I expect. The problem is that the UI is not updated when the bound source is changed *unless* the grid is scrolled down to display the last row. Very odd.

The grid is bound to a custom class, and just to try things out I use the GridTapped event to increase a counter for the tapped cell and display it (hopefully) in the UI. I can see that I get the GridTapped event. I can see that I increase the correct counter and update it in the viewmodel. I can see that I get a RecordPropertyChanged event when the grid.view detect the change. But nothing is updated in the UI. *UNLESS*...

* If the grid is displayed in such a way that all rows fit on the screen, the UI is never updated no matter what I do.
* If the grid has more rows than what can be displayed on the screen, the UI is still static (i.e. no changes are displayed) as long as the last row is not displayed on screen.
* If the grid has more rows than what can be displayed on the screen AND the grid is scrolled down to display the last row, all updates to the cells (on all visible rows) are correctly displayed when the cell is tapped.

The MainPage code...

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:YatzyGrid"
             xmlns:syncfusion="clr-namespace:Syncfusion.SfDataGrid.XForms;assembly=Syncfusion.SfDataGrid.XForms"  
             x:Class="UserGrid.MainPage">

    <ContentPage.BindingContext>
        <local:UserList x:Name="viewModel"  />
    </ContentPage.BindingContext>

    <ContentPage.Content>
        <syncfusion:SfDataGrid x:Name="dataGrid"
                               ColumnSizer="Star" ItemsSource="{Binding TheList}"
                               GridTapped="dataGrid_GridTapped"
                               GridViewCreated="dataGrid_GridViewCreated"
                               AutoGenerateColumns="False"
                               RowHeight="60"
                               HorizontalOptions="FillAndExpand" 
                               VerticalOptions="FillAndExpand"
                               ShowRowHeader="True"
                               RowHeaderWidth="90">

            <syncfusion:SfDataGrid.Columns>
                <syncfusion:GridTextColumn MappingName="User1" TextAlignment="Center" DisplayBinding="{Binding User1.DisplayValue}">
                    <syncfusion:GridTextColumn.HeaderTemplate>
                        <DataTemplate>
                            <Entry HorizontalOptions="Center"></Entry>
                        </DataTemplate>
                    </syncfusion:GridTextColumn.HeaderTemplate>
                </syncfusion:GridTextColumn>
                <syncfusion:GridTextColumn MappingName="User2"  TextAlignment="Center"  DisplayBinding="{Binding User2.DisplayValue}">
                    <syncfusion:GridTextColumn.HeaderTemplate>
                        <DataTemplate>
                            <Entry HorizontalOptions="Center"></Entry>
                        </DataTemplate>
                    </syncfusion:GridTextColumn.HeaderTemplate>
                </syncfusion:GridTextColumn>
                    <syncfusion:GridTextColumn MappingName="User3"  TextAlignment="Center"  DisplayBinding="{Binding User3.DisplayValue}">
                    <syncfusion:GridTextColumn.HeaderTemplate>
                        <DataTemplate>
                            <Entry HorizontalOptions="Center"></Entry>
                        </DataTemplate>
                    </syncfusion:GridTextColumn.HeaderTemplate>
                </syncfusion:GridTextColumn>
                <syncfusion:GridTextColumn MappingName="User4" TextAlignment="Center"  DisplayBinding="{Binding User4.DisplayValue}">
                    <syncfusion:GridTextColumn.HeaderTemplate>
                        <DataTemplate>
                            <Entry HorizontalOptions="Center"></Entry>
                        </DataTemplate>
                    </syncfusion:GridTextColumn.HeaderTemplate>
                </syncfusion:GridTextColumn>
            </syncfusion:SfDataGrid.Columns>
           
            <syncfusion:SfDataGrid.RowHeaderTemplate>
                <DataTemplate>
                    <StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Padding="5" >
                    <Label Text="{Binding ResultName}" HorizontalOptions="Start" VerticalOptions="CenterAndExpand"></Label>
                    </StackLayout>
                </DataTemplate>
            </syncfusion:SfDataGrid.RowHeaderTemplate>
        </syncfusion:SfDataGrid>

    </ContentPage.Content>

</ContentPage>


What am I doing wrong?

[Ashok N]

Hi Gunnar, 

 

Thanks for contacting Syncfusion support. 

 

We have checked your query and could you please confirm whether you are using ObservableCollection or List in your ItemsSource. Because if you use List does not provide the notification when the collection is changed but ObservableCollection provides notification when the collection is changed, also please implement INotifyPropertyChanged in your Model and ViewModel classes to CLR properties. Still you are facing the issue, please share your sample along with replication procedure, that would be more helpful for us to proceed further. 

 

Regards, 

Ashok