Rose Rose - 4 months ago 30
JSON Question

Slideshow image from JSON

I want to create an image slideshow. The pictures are taken from data on json (as shown below).
JSON
I tried using the code below:

DispatcherTimer playlistTimer1a = null;
List<string> Images1a = new List<string>();

protected override void OnNavigatedTo(NavigationEventArgs e)
{
ImageSource1a();
}

private async void ImageSource1a()
{
try
{
var httpClientHandler = new HttpClientHandler();
httpClientHandler.Credentials = new System.Net.NetworkCredential("username", "password");
var httpClient = new HttpClient(httpClientHandler);
string urlPath = "http://";
var values = new List<KeyValuePair<string, string>>
{
new KeyValuePair<string, string>("platform","win"),
};
HttpResponseMessage response = await httpClient.PostAsync(urlPath, new FormUrlEncodedContent(values));

response.EnsureSuccessStatusCode();

string jsonText = await response.Content.ReadAsStringAsync();
JsonObject jsonObject = JsonObject.Parse(jsonText);
//JsonObject jsonData1 = jsonObject["data"].GetObject();

JsonArray jsonData1 = jsonObject["data"].GetArray();

foreach (JsonValue groupValue1 in jsonData1)
{

JsonObject groupObject1 = groupValue1.GetObject();

string image = groupObject1["image"].GetString();
string url = groupObject1["url"].GetString();

Banner file1 = new Banner();
file1.Image = image;
file1.URL = url;
Images1a.Add(file1.Image);
playlistTimer1a = new DispatcherTimer();
playlistTimer1a.Interval = new TimeSpan(0, 0, 6);
playlistTimer1a.Tick += playlistTimer_Tick1a;
topBanner.Source = new BitmapImage(new Uri(file1.Image));
playlistTimer1a.Start();
}
}
catch (HttpRequestException ex)
{
RequestException();
}
}

int count1a = 0;

void playlistTimer_Tick1a(object sender, object e)
{
if (Images1a != null)
{
if (count1a < Images1a.Count)
count1a++;

if (count1a >= Images1a.Count)
count1a = 0;

ImageRotation1a();
}
}

private async void ImageRotation1a()
{
OpacityTrans1.Begin();
}


And the problem is only a slideshow displays the image index to 0 only, can not change the picture. How can I overcome this problem?

Answer

And the problem is only a slideshow displays the image index to 0 only, can not change the picture.

The foreach loop break down everything.If you want to make slideshow images, don't include DispatcherTimer in foreach loop, you can revise your codes by following steps:

  1. Modify your ImageSource1a method like below:

    private async void ImageSource1a()
    {
        try
        {
            ...
            foreach (JsonValue groupValue1 in jsonData1)
            {
                JsonObject groupObject1 = groupValue1.GetObject();
                string image = groupObject1["image"].GetString();
                string url = groupObject1["url"].GetString();
                Images1a.Add(image);
            }
               //I don't know what is Banner object used for but for this piece of codes, a banner object is not necessary.
                //Banner file1 = new Banner();
                //file1.Image = image;
                //file1.URL = url;
    
                playlistTimer1a = new DispatcherTimer();
                playlistTimer1a.Interval = new TimeSpan(0, 0, 6);
                playlistTimer1a.Tick += playlistTimer_Tick1a;
                topBanner.Source = new BitmapImage(new Uri(Images1a[0]));//set the current image to the first one
                playlistTimer1a.Start();
        }
        catch (HttpRequestException ex)
        {
            RequestException();
        }
    }
    
  2. Modify your playlistTimer_Tick1a method like below:

    private void playlistTimer_Tick1a(object sender, object e)
    {
        if (Images1a != null)
        {
    
            if (count1a < Images1a.Count)
                count1a++;
    
            if (count1a >= Images1a.Count)
                count1a = 0;
            topBanner.Source = new BitmapImage(new Uri(Images1a[count1a]));
            ImageRotation1a();
        }
    }
    

Update: here is my basic demo: SlideShowSample.

Comments