Flex Grid Xamarin Forms PullToRefresh didn't work

Posted by: sbuescher on 8 January 2020, 3:16 pm EST

    • Post Options:
    • Link

    Posted 8 January 2020, 3:16 pm EST

    Hi,

    i’ve a flexgrid in my xamarin forms project and want to use the pulltorefresh functionality to update the data from my viemodel to the flexgrid. I set the AllowRefreshing to true in my xaml and add a behaviour for the refreshing event to my viemodel. Now if i try to pull my flexgrid the behaviour didn’t get executed. Do i miss something?

    The Flex Grid def in the xaml for the view:

    
    <Grid VerticalOptions="FillAndExpand" Margin="5,5,5,5">
                    <c1:FlexGrid ItemsSource="{Binding obsvUldDataList}" x:Name="fgUldData" 
                                 ShowMarquee="True" SelectionMode="Row"
                                 AllowSorting="True" AllowResizing="None"
                                 AutoGenerateColumns="False" AllowRefreshing="True"
                                 FrozenColumns="1" ColumnHeaderBackgroundColor="#875113"                             
                                 ShowSelectionMenu="False" BorderColor="#fab80a" BorderWidth="1"
                                 ColumnHeaderFontAttributes="Bold" ColumnHeaderGridLinesVisibility="All"
                                 >
                        <c1:FlexGrid.Columns>
                            <c1:GridColumn Binding="ULD_EQP_NR" Width="Auto" Header="UldEqpNr:"/>
                            <c1:GridColumn Binding="MVM_NR" Width="Auto" Header="MvmNr:"/>
                            <c1:GridColumn Binding="ULD_TYP_CD" Width="Auto" Header="UldT:"/>
                            <c1:GridColumn Binding="LOD_CHT_DPD_SYS_NR" Width="Auto" Header="Load"/>
                            <c1:GridColumn Binding="SC_NR" Width="Auto" Header="Seal:"/>
                            <c1:GridColumn Binding="NUM_PKG" Width="Auto" Header="Pkg:" 
                                           Format="N0"/>
                            <c1:GridColumn Binding="BELT" Width="Auto" Header="Belt"/>
                            <c1:GridColumn Binding="STATUS" Width="Auto" Header="Status"/>
                        </c1:FlexGrid.Columns>
                        <c1:FlexGrid.Behaviors>
                            <local1:testBehaviour/>
                            <local1:testCellLongPressBehaviour/>
                        </c1:FlexGrid.Behaviors>
                    </c1:FlexGrid>
    
    

    the Behaviour class in my view model:

    
       public class testBehaviour : Behavior<FlexGrid>
        {
            protected override void OnAttachedTo(FlexGrid bindable) 
            {
                bindable.Refreshing += OnBindable_Refreshing;
                base.OnAttachedTo(bindable);
            }
    
            private void OnBindable_Refreshing(object sender, GridRefreshEventArgs e)
            {
                int xxx = 0;            
            }
    
            protected override void OnDetachingFrom(FlexGrid bindable)         
            {
                bindable.Refreshing -= OnBindable_Refreshing;
                base.OnDetachingFrom(bindable);
            }
        }
    
    

    Hope someone of the professionals can help me here.

    Thx and Regards

    Sascha

  • Posted 8 January 2020, 10:00 pm EST

    Hi Sascha,

    FlexGrid uses “C1CursorCollectionView” to implement “Pull To Refresh”. Implement a MyCollectionView class by inheriting the C1CursorCollectionView class. override the “GetPageAsync” method and return the tuple of data items on the basis of page count.

    public class MyCollectionView : C1CursorCollectionView<Customer>
       {
           int _count = 0;
           ObservableCollection<Customer> items;
           public MyCollectionView()
           {
               PageSize = 50;
               items = Customer.GetCustomerList(1000);
           }
    
           public int PageSize { get; set; }
           
           protected override async Task<Tuple<string, IReadOnlyList<Customer>>> GetPageAsync(int startingIndex, string pageToken, int? count = null, IReadOnlyList<SortDescription> sortDescriptions = null, FilterExpression filterExpression = null, CancellationToken cancellationToken = default)
           {
               startingIndex = _count;
               _count = _count + PageSize;
               return await Task.Run(() =>
               {
                   var moreItems = new ObservableCollection<Customer>(items.Skip(startingIndex).Take(PageSize));
                   return new Tuple<string, IReadOnlyList<Customer>>("Token not used", moreItems.OrderByDescending(x=>x.ID).ToList());
               });
           }
       }
    

    When ever the you pull down the FlexGrid it will loads the next 50 items in the FlexGrid.

    For reference please see the attached “PullToRefresh” sample.

    Please let me know if you need any other help.

    Thanks

    PullToRefresh.zip

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels