Geek Answers Handbook

FooterTemplate in landscape orientation GridView

I am developing a universal Win8.1 application.

I am using a GridView with a WrapGrid as an ItemsPanel inside. Vertical scrolling is disabled, the user only needs to scroll horizontally. I use an incremental collection of sources like ItemsSource, and when the user scrolls right to the end of the GridView, new elements are dynamically added. Everything is working fine, except for one. I want the progress bar to be right-aligned and it should become visible when loading a new page. I am trying to set a footer template to represent a grid, but it is hidden (maybe by default the footer is added under the items panel or something else).

Here is the code I use to define a control pattern for a GridView and put the footer to the right.

<GridView.Template>
                    <ControlTemplate TargetType="GridView">
                        <Border BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}" 
                                Background="{TemplateBinding Background}">
                            <ScrollViewer x:Name="ScrollViewer" 
                                          AutomationProperties.AccessibilityView="Raw"
                                          BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}" 
                                          HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" 
                                          HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" 
                                          IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" 
                                          IsHorizontalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsHorizontalScrollChainingEnabled}" 
                                          IsVerticalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsVerticalScrollChainingEnabled}" 
                                          IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" 
                                          IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" 
                                          TabNavigation="{TemplateBinding TabNavigation}" 
                                          VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" 
                                          VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" 
                                          ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}">
                                <StackPanel Orientation="Horizontal">
                                    <ItemsPresenter HeaderTemplate="{TemplateBinding HeaderTemplate}"
                                                    Header="{TemplateBinding Header}"
                                                    HeaderTransitions="{TemplateBinding HeaderTransitions}"
                                                    Padding="{TemplateBinding Padding}"/>
                                    <ContentControl Transitions="{TemplateBinding FooterTransitions}"
                                                    ContentTemplate="{TemplateBinding FooterTemplate}" 
                                                    Content="{TemplateBinding Footer}"/>
                                </StackPanel>
                            </ScrollViewer>
                        </Border>
                    </ControlTemplate>
                </GridView.Template>

Then I set ProgressRing as the footer template.

<GridView.FooterTemplate>
                    <DataTemplate>
                        <ProgressRing VerticalAlignment="Stretch"
                                      HorizontalAlignment="Stretch"
                                      IsActive="{Binding IsBusy}"
                                      Margin="0,24"
                                      Width="50"
                                      Height="50"
                                      Foreground="{StaticResource LightGreyBorderBrush}"
                                      Style="{StaticResource ProgressRingStyle}" />
                    </DataTemplate>
                </GridView.FooterTemplate>

But when I try to scroll, things are crazy. A GridView always causes the next page to load one after the other, but the scroll position is almost 0 (at the beginning of the GridView). Therefore, I get endless page loading.

Can anyone help me with this? Thank you very much in advance!

EDIT: I created a small sample for playback. Take a look, please. Here's the link .

+4
source share
1 answer

FooterTemplate . ItemsWrapGrid ( GridView ) WrapGrid ItemsPanel. Template. :

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <GridView x:Name="TestGridView">
        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsWrapGrid ItemHeight="100"
                          Orientation="Vertical"
                          MaximumRowsOrColumns="5" />
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>
        <GridView.ItemTemplate>
            <DataTemplate>
                <Border Background="DarkSlateGray"
                        Height="100"
                        Width="100"
                        Margin="20">
                    <TextBlock Foreground="#FFFFFF"
                               Text="{Binding Number}" />
                </Border>
            </DataTemplate>
        </GridView.ItemTemplate>
        <GridView.FooterTemplate>
            <DataTemplate>
                <ProgressRing IsActive="True"
                              Margin="0,24"
                              Width="50"
                              Height="50" />
            </DataTemplate>
        </GridView.FooterTemplate>
    </GridView>
</Grid>

, 2 , GridView , .

, .

+1

More articles:


All Articles