1

Need to Update contents in windows phone page automatically after fixed intervals the data is fetched from as json from web

the data is Live Scores of a Football Match in json format

The LiveScoresJson.cs file is 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Surfer
{
    class LiveSocresJson
    {
        public class Customer
        {
            public string name { get; set; }

        }

        public class Match
        {
            public int id { get; set; }
            public string status { get; set; }
            public string home { get; set; }
            public string homepath { get; set; }
            public string away { get; set; }
            public string awaypath { get; set; }
            public string competition { get; set; }
            public string competitionkey { get; set; }
            public List<int> score { get; set; }
            public List<object> events { get; set; }
            public string scores { get; set; }
        }

        public class RootObject
        {
            public Customer customer { get; set; }
            public List<Match> matches { get; set; }
        }



    }
}

i used the following code to get json data 

public async void JSON()
 {

   String Url = "url of the source";
   WebClient Client = new WebClient();
   Client.Headers["Accept"] = "application/json";
   Client.DownloadStringAsync(new Uri(Url));
   Client.DownloadStringCompleted += new DownloadStringCompletedEventHandler(JsonFuction);
 }
 private void JsonFuction(object sender, DownloadStringCompletedEventArgs e)
 {
   try
       {

         var Data = JsonConvert.DeserializeObject<LiveSocresJson.RootObject>(e.Result);

                    foreach (var d in Data.matches)
                    {
                        string img = d.homepath;
                        string url = "Assets/Images/" + img + ".png";
               `enter code here`         d.homepath = url;
                        string img2 = d.awaypath;
                        string url2 = "Assets/Images/" + img2 + ".png";
                        d.awaypath = url2;
                        var f = d.score;
                        string scoresg = d.score[0] +"-" +d.score[1];
                        d.scores = scoresg;

                    }
                    TableContent.ItemsSource = Data.matches;

       }
        catch (Exception ex)
         { }
 }

with this code the contents are loaded each time when the page is loaded but, what i need is to update the page after fixed intervals so that i can keep the Live Scores updated in my page what should i do?

The xaml code i used is 

<StackPanel >    
<StackPanel Height="60"  Background="Black" VerticalAlignment="Top" >
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" Height="60">
<TextBlock Text="Live Matches" Width="Auto"  Foreground="White" FontSize="25" Margin="10,0,0,0" Height="40" HorizontalAlignment="Center" VerticalAlignment="Center" />
</StackPanel>
</StackPanel>
<Grid x:Name="La">
<ScrollViewer Name="ScrollViewer" Margin="0,0,0,12" VerticalAlignment="Top"  VerticalScrollBarVisibility="Visible" ManipulationMode="Control">
<ListBox x:Name="TableContent"   VerticalAlignment="Bottom"    Height="505"  Width="Auto">
<ListBox.ItemTemplate  >
<DataTemplate>
<Grid x:Name="gh">
<StackPanel Height="100"  Background="Transparent" Margin="0,0,0,0" Width="663" Orientation="Vertical"  VerticalAlignment="Bottom">
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" Height="100" Width="Auto">
<TextBlock Text="{Binding status}" Width="Auto"   Foreground="Black" FontSize="22" Margin="7,0,0,0" Height="40" VerticalAlignment="Center" />
<Image Source="{Binding homepath}"   Height="40" Width="40"  VerticalAlignment="Center"  Margin="10,0,0,0"/>
<TextBlock Text="{Binding home}" Width="100"   Foreground="Black" FontSize="22" Margin="10,0,0,0" Height="40" VerticalAlignment="Center" />
<TextBlock  Text="{Binding scores}" Width="50"  Foreground="Black" FontSize="25" Margin="10,0,0,0" Height="40" VerticalAlignment="Center"  HorizontalAlignment="Center"/>
<Image Source="{Binding awaypath}"  Height="40" Width="40"  VerticalAlignment="Center"  Margin="15,0,0,0"/>
<TextBlock  Text="{Binding away}" Width="Auto"  Foreground="Black" FontSize="22" Margin="10,0,0,0" Height="40" VerticalAlignment="Center" />
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</ScrollViewer>
</Grid>
</StackPanel>

How can i use the ObservableCollections here and change the contents by binding the list to ObservableCollections instead of Data.matches?

Joel Joseph
  • 5,889
  • 4
  • 31
  • 36

1 Answers1

0

Your Listbox is not bound against a collection. The parameter for this is:

ItemsSource="{Binding Path=YourMatchResults}"

Now you should have a property called "YourMatchResults" of type ObservableCollection because then, the ListBox is always refreshed when the ObservableCollection was changed. (items added or removed) But if you replace the whole collection with a new one, the binding is lost! So you have to either update them one by one, or clear the list and add the items.

A good example can be found here: Binding observable collection to ListBox in XAML

And since WP8, one should use the LongListSelector instead of a ListBox beacuse it supports virtualization and renders only items that are displayed.

Examples the LongListSelector:

http://abundantcode.com/displaying-data-in-flat-list-in-windows-phone-8-longlistselector-control/

http://www.geekchamp.com/articles/the-new-longlistselector-control-in-windows-phone-8-sdk-in-depth

And I would suggest to download this package to get a bunch of running examples which are reduced to the max to be still executable but demo a certain WP8 feature:

http://code.msdn.microsoft.com/windowsapps/Windows-Phone-81-samples-08631ca7

Community
  • 1
  • 1
eX0du5
  • 896
  • 7
  • 16