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

时间:2011-01-13 08:11:29

标签: c# silverlight image loops windows-phone-7

在我的(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)所以只是想知道如何最好地做到这一点 - 我想用网页浏览器控制尝试这个但是肯定必须有更优雅的方式来循环一堆图像!

对不起,这太长了,但任何帮助或建议都会非常感激。

麦克

2 个答案:

答案 0 :(得分:4)

您可以将后台线程与定时器或睡眠模式一起使用,以定期更新图像控件。

Phạm Tiểu Giao - Threads in WP7

您需要使用

向UI分发更新
Dispatcher.BeginInvoke( () => { /*  your UI code */ } );

答案 1 :(得分:1)

为什么不将最后一张图像两次添加到radarImages,将Timer设置为1000并在每个勾号上只显示一张图像?