Customize RadPagginationControl

7 posts, 0 answers
  1. Deana
    Deana avatar
    4 posts
    Member since:
    Oct 2017

    Posted 17 Oct 2017 Link to this post

    Hey guys,

    kind of stuck with this pagination navigation control.

    In my UWP app I have binded List of objects to a GridView. Trying to access some sort of pagination item count, page size or set similar property if exists. So far, pagination selects one item (row) from the list and shows it in a first page (index label 1) which does not work for me (1item per control click.) I need 10 items from a list to be shown in first page. Is there a solution for this?

     

    Thanks

  2. Nasko
    Admin
    Nasko avatar
    727 posts

    Posted 20 Oct 2017 Link to this post

    Hi Deana,

    We are not exactly sure that we completely understand the described by you scenario. Could you please, provide us a sample project that demonstrates it? Thus we will be able to continue our investigation and to provide you with a prompt solution.

    We are looking forward to hearing from you.

    Regards,
    Nasko
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. Deana
    Deana avatar
    4 posts
    Member since:
    Oct 2017

    Posted 20 Oct 2017 in reply to Nasko Link to this post

    Hey, thanks for answering.

    Basically I need to group somehow 10 items in the list to be presented on the first pagging index. Right now I have 1 item in the list presented by clicking first pagging index btn. That is why i asked if some item size property sort of exists or page size to ensure i get 10 items instead of one, clicking the first arrow or first index in pagging control. All my list items are shown in the current frame, while going through pagging control, it "reads" one by one item. I would like to have 10 items read instead. Here is XAML sample of the grid containing binded list. 

     <Grid Grid.Row="4">
                            <GridView ItemsSource="{x:Bind VoluntaryReportList}" ItemsPanel="{StaticResource MyItemsPanelTemplate}" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" x:Name="listForPaggination" x:FieldModifier="public">
                                <GridView.ItemTemplate>
                                    <DataTemplate x:DataType="data:VoluntaryReport">
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition></ColumnDefinition>
                                                <ColumnDefinition></ColumnDefinition>
                                                <ColumnDefinition></ColumnDefinition>
                                                <ColumnDefinition></ColumnDefinition>
                                                <ColumnDefinition></ColumnDefinition>
                                                <ColumnDefinition Width="90"></ColumnDefinition>
                                            </Grid.ColumnDefinitions>
                                            <TextBlock Text="{x:Bind Id}" Grid.Column="0"/>
                                            <TextBlock Text="{x:Bind Date}"  TextAlignment="Left" Margin="10" Grid.Column="1"/>
                                            <TextBlock Text="{x:Bind Headline}"  TextAlignment="Left" Margin="10" Grid.Column="2"/>
                                            <TextBlock Text="{x:Bind ReportedBy}"  TextAlignment="Left" Margin="10" Grid.Column="3"/>
                                            <TextBlock Text="{x:Bind FlightNo}" TextAlignment="Left" Margin="10" Grid.Column="4"/>
                                            <AppBarButton FocusVisualPrimaryBrush="#FFFF9E31" x:Name="viewDetailsButton" Foreground="#FFFF9E31" ToolTipService.ToolTip="View Report Details" Height="40" Click="VoluntaryReportDetails_Click" Tag="{x:Bind Id}" Grid.Column="5">
                                                <AppBarButton.Icon>
                                                    <FontIcon Glyph="&#xE155;" FontFamily="Segoe MDL2 Assets"></FontIcon>
                                                </AppBarButton.Icon>
                                            </AppBarButton>
                                        </Grid>
                                    </DataTemplate>
                                </GridView.ItemTemplate>

                                <GridView.ItemContainerStyle>
                                    <Style TargetType="GridViewItem">
                                        <Setter Property="HorizontalAlignment" Value="Stretch" />
                                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                                    </Style>
                                </GridView.ItemContainerStyle>
                            </GridView>
                        </Grid>
                    </Grid>
                </StackPanel>
                <telerik:RadPaginationControl PageProvider="{Binding ElementName=listForPaggination}" Name="telerikPagination"></telerik:RadPaginationControl>

     

    Thanks for your time

  4. Nasko
    Admin
    Nasko avatar
    727 posts

    Posted 25 Oct 2017 Link to this post

    Hello Deana,

    From the provided description it seems you are trying to implement a paging functionality for the DataGrid control that is not provided out of the box by the control. I will try to create a sample project that demonstrates hot to achieve this if it is possible and how to create the desired customization for the Pagination control.

    As soon as I have some more info I will let you know.

    Regards,
    Nasko
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. Deana
    Deana avatar
    4 posts
    Member since:
    Oct 2017

    Posted 25 Oct 2017 in reply to Nasko Link to this post

    Awesome!

    As far as I know, there’s no build-in DataGrid control in UWP, thats why I used GridView and its ItemTemplate to make it look like a DataGrid.

    Thanks :)

  6. Nasko
    Admin
    Nasko avatar
    727 posts

    Posted 25 Oct 2017 Link to this post

    Hello Deana,

    Telerik UI for UWP provides a fully featured RadDataGrid control. Some more detailed information about the control and the features it provides you can find on the following link:
    http://docs.telerik.com/devtools/universal-windows-platform/controls/raddatagrid/overview

    Unfortunately, using it with the pagination control in order to achieve the desired paging is not an easy task. Because of that I created a sample project that demonstrates how using some custom logic you can implement the desired paging using the DataGrid control and Buttons - please, check the attached sample. Please, notice that this is a sample project and the purpose of it is to illustrate a possible approach how to achieve the desired. It has not been tested for a production environment and is not an official feature of the DataGrid. You  will find severe limitations using this approach instead. For example, it will not work with grouping/sorting/filtering as the DataGrid only performs those actions on the bound collection (the current page). However, I believe it could work for you concrete scenario where items only need to be visualized in portions.

    I hope this will help you.

    Regards,
    Nasko
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  7. Deana
    Deana avatar
    4 posts
    Member since:
    Oct 2017

    Posted 25 Oct 2017 in reply to Nasko Link to this post

    Thanks for your time! 
Back to Top