使用RadJumpList的远程DataVirtualizationMode.Automatic

Question

我遇到了一个问题，我试图在DataVirtualizationMode.Automatic中使用Telerik列表，但我无法让它工作。我之所以想使用这个，是因为我希望我的应用程序只下载跳跃式列表控件当前视图中的数据(游戏)，而不是每次下载全部数据。例如，如果我搜索了“蝙蝠侠”及其返回的50个游戏，我不希望它下载和加载所有的游戏，只有那些我可以在跳跃式列表控件中看到。

下面是一个使用Telerik的DataVirtualizationMode.Automatic的示例，但是我无法让它与我的应用程序：http://www.telerik.com/help/windows-phone/raddataboundlistbox-features-datavirtualization-automatic.html一起工作

下面是我想要与数据虚拟化一起使用的跳跃式列表控件。

MainPage.xaml：

<phone:PivotItem Header="Browse">
            <Grid>
                <telerikPrimitives:RadTextBox Name="txtSearch" HorizontalAlignment="Left" VerticalAlignment="Top" Height="80" Width="390"/>
                <telerikPrimitives:RadImageButton Name="imgBtnSeachGame" VerticalAlignment="Top" HorizontalAlignment="Right" ButtonShape="Ellipse" BorderThickness="2" Margin="0,8,0,0" Click="imgBtnSeachGame_Click"></telerikPrimitives:RadImageButton>

                <Controls:RadJumpList Name="jlGameList" ItemsSource="{Binding}" Tap="jlGameList_Tap" Margin="0,90,0,0" DataVirtualizationMode="Automatic">
                    <Controls:RadJumpList.ItemTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"></RowDefinition>
                                    <RowDefinition Height="*"></RowDefinition>
                                    <RowDefinition Height="20"></RowDefinition>
                                </Grid.RowDefinitions>
                                <Border Grid.Row="0" Background="{StaticResource PhoneAccentBrush}" 
        Padding="{StaticResource PhoneTouchTargetOverhang}"
        Margin="0,0,0,0">
                                    <TextBlock Name="tblGameTitle" Style="{StaticResource PhoneTextGroupHeaderStyle}" ManipulationStarted="tblGameTitle_ManipulationStarted" ManipulationCompleted="tblGameTitle_ManipulationCompleted">
                                        <Run Text="{Binding GameTitle}"></Run>
                                    </TextBlock>
                                </Border>
                                <Grid Background="#242424" Grid.Row="1">
                                    <Image Name="imgGameList" Margin="0,0,0,0" Stretch="Fill" HorizontalAlignment="Left" VerticalAlignment="Top" Height="96" Width="96">
                                        <Image.Source>
                                            <BitmapImage UriSource="{Binding BoxArtFrontThumb}"
                                 CreateOptions="BackgroundCreation" DecodePixelHeight="96" DecodePixelWidth="96" />
                                        </Image.Source>
                                    </Image>
                                    <TextBlock Margin="110,0,0,0" Text="Platform" FontWeight="Bold" TextWrapping="Wrap" Foreground="YellowGreen" FontSize="{StaticResource PhoneFontSizeNormal}"/>
                                    <TextBlock Name="txtPlatform" Margin="110,20,0,0" Text="{Binding Platform}"></TextBlock>

                                    <TextBlock Text="Release Date" FontWeight="Bold" Margin="110,46,0,0" Foreground="YellowGreen" FontSize="{StaticResource PhoneFontSizeNormal}"/>
                                    <TextBlock Name="txtReleaseDate" Margin="110,66,0,0" Text="{Binding ReleaseDate}"></TextBlock>
                                    <!--</StackPanel>-->
                                </Grid>
                                <Grid Grid.Row="2"></Grid>
                            </Grid>
                        </DataTemplate>
                    </Controls:RadJumpList.ItemTemplate>

                </Controls:RadJumpList>
            </Grid>
        </phone:PivotItem>

下面是我将DataContext绑定到GetGamesListItems ObservableCollection在GameData类中的位置。当用户在我的文本框txtSearch中输入“蝙蝠侠”并点击按钮时，将调用imgBtnSearchGame_Click事件方法，然后将文本发送给我的GetGamesListData方法。

MainPage.cs：

GameData gd = new GameData();

public MainPage()
    {
        InitializeComponent();
        jlGameList.DataContext = gd.GetGamesListItems;
    }

 private void imgBtnSeachGame_Click(object sender, RoutedEventArgs e)
    {
        if (!string.IsNullOrEmpty(txtSearch.Text))
        {
            gd.GetGamesListData(txtSearch.Text, "", "");
        }
    }

下面是我下载XML中搜索的游戏名称数据的地方。例如，如果它是“蝙蝠侠”，它将找到和返回与“蝙蝠侠”的所有游戏。"BoxArtFrontThumb“属性是im存储每个游戏的所有图像并使用异步的地方，因为有时它需要下载和显示大量的图像。

GameData.cs

public void GetGamesListData(string name, string platform, string genre)
    {
        var webClient = new WebClient();
        webClient.DownloadStringCompleted += GetGamesListRequestCompleted;
        webClient.DownloadStringAsync(new Uri("http://thegamesdb.net/api/GetGamesList.php?name=" + name));
    }

    private async void GetGamesListRequestCompleted(object sender, DownloadStringCompletedEventArgs e)
    {

        if (e.Error == null)
        {
            GetGamesListItems.Clear();
            var feedXml = XDocument.Parse(e.Result);
            var gameDataTasks = feedXml.Root.Descendants("Game").Select(
                async x => new GetGamesList
                {
                    ID = (int)x.Element("id"),
                    GameTitle = (string)x.Element("GameTitle"),
                    ReleaseDate = (string)x.Element("ReleaseDate") ?? "N/A",
                    Platform = (string)x.Element("Platform") ?? "N/A",
                    BoxArtFrontThumb = new Uri(await GetBoxArtFrontThumbAsync((int)x.Element("id")), UriKind.RelativeOrAbsolute),
                }).ToList();
            var gameData = await Task.WhenAll(gameDataTasks);
            foreach (var item in gameData)
            {
                GetGamesListItems.Add(item);
            }
        }
    }

下面是它为游戏找到和存储图像的地方。

public async Task<string> GetBoxArtFrontThumbAsync(int id)
    {
        var client = new HttpClient();
        var result = await client.GetStringAsync("http://thegamesdb.net/api/GetArt.php?id=" + id);
        var feedXml = XDocument.Parse(result);
        var gameData = feedXml.Root.Descendants("Images").Select(x => new GetArt
        {
            BoxArtFrontThumb = new Uri(GetBoxArtFrontThumb(x), UriKind.RelativeOrAbsolute),
        }).ToList();


        return gameData.Single().BoxArtFrontThumb.ToString();
    }

private static string GetBoxArtFrontThumb(XElement gameNode)
    {
        string data = "http://thegamesdb.net/banners/" + (string)gameNode.Descendants("boxart")
                               .FirstOrDefault(b => (string)b.Attribute("side") == "front");

        if (data == "http://thegamesdb.net/banners/")
        {
            data = "/NoImage.jpg";
        }

        return data;
    }

我真的希望我解释得足够好，希望有人能帮我解决这个问题。谢谢。

Answer 1

虽然您使用的是JumpList，但虚拟化数据的机制与DataBoundListBox相同。(您可以找到更多信息，在DataBoundListBox文档中。有一个很好的教程使用OData服务。)

为了使自动模式正常工作，您需要使用Telerik的VirtualizingDataCollection对象并使用适当的参数(计数和页面大小)初始化它。

我看不出你在上面提供的代码，你能打开一个支持票，以便我可以进一步调查吗？有关链接，请参阅我上面的评论。告诉我机票号码，我会提供进一步的帮助。