Search code examples
c#.netsilverlightdatapager

stackpanel in datapager silverlight


I am developing a silverlight navigation application and got stuck on the following problem...

The guy I am developing the app wants to have a News page where you can see all published news on the left side and the clicked (or latest news if none is clicked) on the right side. He wanted to have a header, text and publishing date for each news in the news list. Also he wanted to have paging so that there won't be to many news in the list at once...

I did this:

        foreach (Model.News news in s)
        {
            StackPanel stackPanel = new StackPanel();

            HyperlinkButton hyperlinkButton = new HyperlinkButton();
            hyperlinkButton.Tag = news.Header;
            hyperlinkButton.Content = news.Header;
            hyperlinkButton.FontSize = 15;
            hyperlinkButton.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
            hyperlinkButton.Click += new RoutedEventHandler(Button_Click);

            stackPanel.Children.Add(hyperlinkButton);

            TextBlock textBlock = new TextBlock();
            textBlock.Foreground = new SolidColorBrush(Colors.Gray);
            textBlock.FontSize = 12;
            textBlock.FontFamily = new FontFamily("Verdana");
            textBlock.TextWrapping = TextWrapping.Wrap;
            textBlock.Text = news.Text;

            stackPanel.Children.Add(textBlock);

            TextBlock dateTextBlock = new TextBlock();
            dateTextBlock.Foreground = new SolidColorBrush(Colors.Gray);
            dateTextBlock.FontSize = 10;
            dateTextBlock.FontFamily = new FontFamily("Verdana");
            dateTextBlock.TextWrapping = TextWrapping.Wrap;
            dateTextBlock.FontWeight = FontWeights.Bold;
            dateTextBlock.HorizontalAlignment = System.Windows.HorizontalAlignment.Right;
            dateTextBlock.Text = news.Date.ToShortDateString();

            stackPanel.Children.Add(dateTextBlock);

            stackPanel.Children.Add(new TextBlock());
            newsStackPanel.Children.Add(stackPanel);

        }

        PagedCollectionView itemListView = new PagedCollectionView(newsStackPanel.Children);

        newsPager.Source = itemListView;

and all of it goes here

<Grid x:Name="LayoutRoot" Loaded="LayoutRoot_Loaded" MaxWidth="1100">
    <Grid.RenderTransform>
        <CompositeTransform/>
    </Grid.RenderTransform>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition Width="2"/>
        <ColumnDefinition Width="3*"/>
    </Grid.ColumnDefinitions>
    <RichTextBox Name="contentRTB"  MaxWidth="1000" Margin="10, 30, 10, 30" Grid.Column="2"
                         HorizontalAlignment="Stretch"  VerticalAlignment="Stretch" 
                         TextWrapping="Wrap"
                         Style="{StaticResource RichTextBoxStyle}" IsReadOnly="True"/>
    <Rectangle Grid.Column="1" Margin="0,10"
               Fill="#FF0067C6"/>
    <TextBlock Name="header" Foreground="#FF0067C6" FontSize="18" FontFamily="Verdana" HorizontalAlignment="Center" VerticalAlignment="Top" Grid.Column="0"></TextBlock>
    <sdk:DataPager x:Name="newsPager"
                        DisplayMode="FirstLastNumeric"
                        Background="#FF0067C6"
                        PageSize="3"
                        AutoEllipsis="True"
                        NumericButtonCount="3"/>
    <StackPanel Name="newsStackPanel" Grid.Column="0" Orientation="Vertical" Margin="0,50,0,0"/>
</Grid>

The newsPager displayes (correctly) 2 pages because i have currently 5 news and the pageSize is set to 3 but they are all displayed on the same page so I dont get the desired paging... how can i fix it


Solution

  • I don't know if the DataPager control you're using handles the paging completely.

    You could only add the news items that are on the page you want to view to the stack panel.

    One easy way to do that could be to use LINQ in your for each, something like:

    foreach (Model.News news in s.Skip(newsPager.PageSize * newsPager.PageIndex).Take(newsPager.PageSize))

    you'd have to reinitialize the items in the pager when the page index changes then too.