具有“加载更多"功能的列表框选项 [英] ListBox with "load more" option

问题描述

我想知道如何在WP7中构造仅一次加载20个项目的ListBox，并在页脚中显示如果有更多内容，则显示" load more".

I would like to know how to construct the ListBox in WP7 that only load 20 items at a single time, and have a footer that show "load more" if there is any.

当用户按加载更多"时，是否会在列表中再加载20个而不加载以前加载的数据?

When user press the "load more", it will load another 20 in the list without loading the previous loaded data?

我正在背后使用LINQ.

I am using LINQ at the behind source.

我的XMAL代码如下:

my code for XMAL as follow:

<Grid>
  <ListBox name="newsIndexListBoxEN">
    <ListBoxItem>
      <DataTemplate>
        <StackPanel Width="410" Orientation="Horizontal" VerticalAlignment="Top" Margin="0,5,0,5">
          <StackPanel Background="DarkBlue" Margin="10,0,0,0" Height="100" Width="100" VerticalAlignment="Top">
            <TextBlock Name="columnsTypeTB" Text="{Binding pType}" Margin="0,0,0,0" Foreground="White" FontSize="23" HorizontalAlignment="Center" />
            <Image Width="100" Height="100" VerticalAlignment="Top" HorizontalAlignment="Center" Source="Background.png" />
          </StackPanel>
          <StackPanel Width="300" Height="100" Margin="0,0,0,0">
            <Path Margin="0,0,0,0" Data="M39,8 L389,8" Fill="DarkBlue" Height="1" Stretch="Fill" Stroke="DarkBlue" UseLayoutRounding="False" Width="400"/>
            <TextBlock Margin="8,0,0,0" Text="{Binding pTitle}" Tag="{Binding pID}" Style="{StaticResource PhoneTextNormalStyle}" TextWrapping="Wrap" Width="292" Height="66" />
            <TextBlock Margin="8,5,0,0" Text="{Binding pDate}" Tag="{Binding pID}" MouseEnter="NewsViewContent_mouseEnter" Style="{StaticResource PhoneTextSmallStyle}" VerticalAlignment="Bottom" TextWrapping="Wrap" Width="292" />
          </StackPanel>
        </StackPanel>
      </DataTemplate>
    </ListBoxItem>
  </ListBox>
</Grid>

C#代码如下:

using (IsolatedStorageFile storage = IsolatedStorageFile.GetUserStoreForApplication())
{
    using (IsolatedStorageFileStream fs = storage.OpenFile(fileName, FileMode.Open))
    {
        XDocument menuIndex = XDocument.Load(fs);

        var menuIndexList = from query in menuIndex.Descendants("news")
                            orderby (int)query.Element("newsID") descending
                            select new mkmenu
                                   {                                                
                                       pID = query.Element("newsID").Value,
                                       pTitle = query.Element("newsTitle").Value,
                                       pDate = query.Element("newspDate").Value,
                                       pType = newsType
                                   };

        newsIndexListBoxEN = menuIndexList.Count();
    }
}

有什么想法吗?示例代码?

any ideas? sample code?

推荐答案

您可以编辑列表框模板，以在列表末尾显示加载更多"按钮.在Blend中，右键单击您的列表框，选择编辑模板"，编辑副本".默认情况下，您的列表框具有如下模板:

You can edit your listbox template to show a "Load more" button at the end of the list. In Blend, right click on your listbox, choose Edit Template, Edit a copy. By default, your listbox has a template like this:

ScrollViewer
    ItemPresenter

将您的ItemPresenter包装到StackPanel中，然后在最后添加一个按钮:

Wrap your ItemPresenter into a StackPanel, then add a button at the end:

ScrollViewer
    StackPanel
        ItemPresenter
        Button

该按钮将始终显示在列表框的末尾.处理该按钮的Clicked事件，以将项目添加到您的ObservableCollection.

That button will always be displayed at the end of the listbox. Handle the Clicked event of that button to add items to your ObservableCollection.

这篇关于具有“加载更多"功能的列表框选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！