ISupportIncrementalLoading
We often
need to load data incrementally in windows phone or store applications today we
are going to discuss how we can load data incrementally using ISupportIncrementalLoading interface. Let’s
discus a real life scenario first.
Suppose we have a page that shows the
population of 3000 cities, from MainPage when we tap the button to move to the
respective page the page will first load the data of all the cities and then
the page will open. What if it takes 5 minutes to load data, it may lead to bad
user experience. So the solution of this problem is, we load data of 10 items
first and when the user scrolls down it loads data with scrolling. It seems a
nice solution. Facebook is the perfect example of it when you scroll down to your
timeline it loads as you move down.
Let’s see
how to implement ISupportIncrementalLoading interface.
To
implement interface we need class that inherits from ObservableCollection.
class ItemsToShow : ObservableCollection<string>, ISupportIncrementalLoading
{
public int lastItem = 1000;
public bool HasMoreItems
{
get
{
if (lastItem ==
10000)
{
return false;
}
else
{
return true;
}
}
}
public Windows.Foundation.IAsyncOperation<LoadMoreItemsResult>
LoadMoreItemsAsync(uint count)
{
ProgressBar progressBar =
((Window.Current.Content
as Frame).Content as MainPage).ProgBar;
CoreDispatcher coreDispatcher
= Window.Current.Dispatcher;
return Task.Run<LoadMoreItemsResult>(async () =>
{
await
coreDispatcher.RunAsync(CoreDispatcherPriority.Normal,
() =>
{
progressBar.IsIndeterminate = true;
progressBar.Visibility
= Visibility.Visible;
});
List<string> items = new List<string>();
for (int i = 0; i <
count; i++)
{
items.Add(String.Format("Item
{0}", lastItem));
lastItem++;
if (lastItem ==
10000)
{
break;
}
}
await
coreDispatcher.RunAsync(CoreDispatcherPriority.Normal,
() =>
{
foreach (string item in items)
{
this.Add(item);
}
progressBar.Visibility = Visibility.Collapsed;
progressBar.IsIndeterminate = false;
});
return new LoadMoreItemsResult() { Count =
count };
}).AsAsyncOperation<LoadMoreItemsResult>();
}
}
ISupportIncrementalLoading implements a
property and a method.
public bool HasMoreItems {}
It’s
Access type is read only and it determines if the collection has more items or
not.
public
Windows.Foundation.IAsyncOperation<LoadMoreItemsResult> LoadMoreItemsAsync(uint count)
It is
the method that actually loads item every time the view needs to load them. As
in our case we apply this to GridView so whenever the user reaches the edge of
the screen it calls LoadMoreItemsAsync method and loads data.
Here is
the XAML code to show data in GridView
<Grid>
<GridView x:Name="GridView" Margin="-27,90,27,10" Padding="100,0,0,10">
<GridView.Resources>
<DataTemplate x:Key="DataTemplateGridViewMain">
<Grid Width="100" Height="100" Background="#FF7C1A9B">
<TextBlock Text="{Binding}" VerticalAlignment="Center" FontSize="20" FontFamily="Tempus
Sans ITC" TextAlignment="Center"/>
</Grid>
</DataTemplate>
</GridView.Resources>
</GridView>
<ProgressBar x:Name="ProgBar" IsIndeterminate="True" Visibility="Collapsed"/>
</Grid>
in
ordre to make our app working we only need to do assign the class (ItemsToShow)
to the ItemSource property of GridView.
private void
MainPage_Loaded(object sender, RoutedEventArgs e)
{
}
Here
are the screen shorts the loop is incrementally loading infinite items.
 |
| Loading Data |
 |
| Data has been loaded |
No comments: