如何在 WP7 应用程序中循环显示多个图像？

Question

在我的 (Silverlight) 天气应用程序中，我正在从网站下载多达 6 张单独的天气雷达图像（每张相隔大约 20 分钟），我需要做的是在最后显示每张图像一秒钟循环，暂停 2 秒，然后再次开始循环。 （这意味着图像循环将一直播放，直到用户单击我想要的返回或主页按钮。）

所以，我有一个 RadarImage 类，如下所示，每个图像都被下载（通过 WebClient），然后加载到 RadarImage 实例中，然后将其添加到集合中（即：List<RadarImage>）...

//Following code is in my radar.xaml.cs to download the images....
int  imagesToDownload = 6;
int imagesDownloaded = 0;
RadarImage rdr    = new RadarImage(<image url>);    //this happens in a loop of image URLs
rdr.FileCompleteEvent += ImageDownloadedEventHandler;

//This code in a class library.
public class RadarImage
{
    public int ImageIndex;
    public string ImageURL;
    public DateTime ImageTime;
    public Boolean Downloaded;
    public BitmapImage Bitmap;

    private WebClient client;

    public delegate void FileCompleteHandler(object sender);
    public event FileCompleteHandler FileCompleteEvent; 

    public RadarImage(int index, string imageURL)
    {
        this.ImageIndex = index;
        this.ImageURL = imageURL;

        //...other code here to load in datetime properties etc...

        client = new WebClient();
        client.OpenReadCompleted += new OpenReadCompletedEventHandler(wc_OpenReadCompleted);
        client.OpenReadAsync(new Uri(this.ImageURL, UriKind.Absolute));
    }

    private void wc_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e)
    {
        if (e.Error == null)
        {
            StreamResourceInfo sri = new StreamResourceInfo(e.Result as Stream, null);
            this.Bitmap = new BitmapImage();
            this.Bitmap.SetSource(sri.Stream);
            this.Downloaded = true;
            FileCompleteEvent(this);         //Fire the event to let the app page know to add it to it's List<RadarImage> collection
        }
    }
}

如您所见，在上面的类中，我公开了一个事件处理程序，让我的应用页面知道每个图像何时下载。当他们全部下载后，我在我的 xaml 页面中运行以下代码 - 但只显示最后一张图片，我不知道为什么！

    private void ImageDownloadedEventHandler(object sender)
    {
        imagesDownloaded++;
        if (imagesDownloaded == imagesToDownload)
        {
            AllImagesDownloaded = true;

            DisplayRadarImages();
        }
    }

    private void DisplayRadarImages()
    {
        TimerSingleton.Timer.Stop();

        foreach (RadarImage img in radarImages)
        {
            imgRadar.Source = img.Bitmap;
            Thread.Sleep(1000);
        }

        TimerSingleton.Timer.Start();   //Tick poroperty is set to 2000 milliseconds
    }

    private void SingleTimer_Tick(object sender, EventArgs e)
    {
        DisplayRadarImages();
    }

所以您可以看到我有一个计时器类的静态实例，该实例已停止（如果正在运行），那么循环应该将每个图像显示一秒钟。当所有 6 个都显示后，它会暂停，计时器启动，两秒后 DisplayRadarImages() 再次被调用。

但正如我之前所说，由于某种原因，我只能显示最后一张图片，而且我似乎无法正常工作。

我是 WP7 开发的新手（虽然不是 .Net）所以只是想知道如何最好地做到这一点 - 我正在考虑使用 Web 浏览器控件尝试这个，但肯定有一个更优雅的方式来循环一堆图像！

对不起，这太长了，但任何帮助或建议将不胜感激。

迈克

Answer 1

您可以使用带有 Timer 或 Sleep 的后台线程来定期更新您的图像控件。

Phạm Tiểu Giao - Threads in WP7

您需要将更新发送到 UI

Dispatcher.BeginInvoke( () => { /*  your UI code */ } );

Answer 2

为什么不将最后一张图像两次添加到radarImages，将Timer 设置为1000 并在每次滴答时只显示一张图像？