如何添加计时器以更改ListPicker中所选项目的图像

时间:2014-08-19 13:17:29

标签: windows-phone-8 windows-phone-8.1

添加计时器以更改listpicker中所选项目图像的步骤是什么?有什么建议?仅供参考,之前从未使用过ListPicker。所以我发现很难理解从哪里开始和做什么。

1 个答案:

答案 0 :(得分:3)

您需要一个ImageSources的ObservableCollection和一个DispatcherTimer,以便在您选择的每个TimeSpan中触发事件。

这里有一些代码可以帮助您入门。您可以将其修改为完全符合您的要求。它基本上包含一个ListPicker,它有一个图像集合作为其ItemTemplate。 DispatchTimer每隔一秒触发并在大约每个WP8.0应用程序中创建的2个默认图像之间切换selectedItem的Image。

养成使用ObervableCollection的习惯,当你想向用户而不是List显示东西时,它会让你的WP8开发生活更轻松。


XAML

    <toolkit:ListPicker x:Name="my_listpicker" SelectionChanged="my_listpicker_SelectionChanged_1" Background="Black">
        <toolkit:ListPicker.HeaderTemplate>
            <DataTemplate/>
        </toolkit:ListPicker.HeaderTemplate>
        <toolkit:ListPicker.ItemTemplate>
            <DataTemplate>
                <StackPanel Background="Black">
                    <Image Source="{Binding ImageSource}" Height="200"></Image>
                </StackPanel>
            </DataTemplate>
        </toolkit:ListPicker.ItemTemplate>
    </toolkit:ListPicker>

C#命名空间

using System.ComponentModel;                        // ObservableCollection
using System.Collections.ObjectModel;               // INotifyPropertyChanged
using System.Windows.Threading;                     // Dispatch Timer

C#你的图像模型(非常基本,但要注意INotifyPropertyChanged

public class MyBindingImage : INotifyPropertyChanged
{
    public MyBindingImage() { }
    public MyBindingImage(string source)
    {
        this.ImageSource = source;

    }

    // Create the OnPropertyChanged method to raise the event
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged(string name)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(name));
        }
    }


    string image_source;
    public String ImageSource {
        get { return image_source; }
        set
        {
            image_source = value;
            OnPropertyChanged("ImageSource");
        }
    }
}

C#(创建Timer和ObservableCollection并设置ItemSource)

DispatcherTimer timer;
// Constructor
public MainPage()
{
    // create our dispatch timer
    timer = new DispatcherTimer();
    timer.Interval = TimeSpan.FromMilliseconds(2000);
    timer.Tick += OnTimerTick;

    InitializeComponent();

    // create our list picker elements
    ObservableCollection<MyBindingImage> my_image_list = new ObservableCollection<MyBindingImage>();
    my_image_list.Add(new MyBindingImage("Assets/ApplicationIcon.png"));
    my_image_list.Add(new MyBindingImage("Assets/AlignmentGrid.png"));            
    my_listpicker.ItemsSource = my_image_list;

}

C#事件(对于Timer&amp; ListPicker SelectionChange)

// each time the selection has changd: stop the timer, then start it again
private void my_listpicker_SelectionChanged_1(object sender, SelectionChangedEventArgs e)
{
    if (timer != null)
    {
        timer.Stop();
        timer.Start();
    }
}

// if the timer is on, cycle the images of the selected item
private void OnTimerTick(object sender, EventArgs e)
{
    try
    {
        MyBindingImage item = (MyBindingImage) my_listpicker.SelectedItem;

        // cycle the selected image between to different images
        if (item.ImageSource == "Assets/AlignmentGrid.png")
        {
            item.ImageSource = "Assets/ApplicationIcon.png";
        }
        else
        {
            item.ImageSource = "Assets/AlignmentGrid.png";
        }
    }
    catch (Exception ex)
    {
        string error_message = ex.Message;
    }            
}

[APPLICATION SCREENSHOT]

enter image description here