Windows Phone Applications: Timing using DispatcherTimer

Applications may want to performs actions with certain timing, or tick intervals.  One example is a turn-based game like a card game where each computer player takes some time to play a turn.  An example which will be shown below is a slideshow application where photos are changed at 2 seconds intervals.  These are the controls used:

1. CheckBox - to toggle slideshow on/off

2. TextBox - to display the file name

3. Image - to display the image

4. ProgressBar - to display progress

  

 

For this sample slideshow application, drag and drop some images from your Sample Pictures folder to your project.  I used Koala.jpg, Jellyfish.jpg and Penguins.jpg.

 

 

This is the xaml:

 

    <Grid x:Name="LayoutRoot" Background="Transparent">

        <Grid.RowDefinitions>

            <RowDefinition Height="Auto"/>

            <RowDefinition Height="Auto"/>

            <RowDefinition Height="*"/>

            <RowDefinition Height="Auto"/>

        </Grid.RowDefinitions>

        <CheckBox Content="Slideshow Mode" Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked" IsChecked="True"  />

       

        <Grid x:Name="TitlePanel" Grid.Row="1">

            <Grid.ColumnDefinitions>

                <ColumnDefinition Width="Auto"/>

                <ColumnDefinition Width="*"/>

                <ColumnDefinition Width="Auto"/>

            </Grid.ColumnDefinitions>

            <TextBlock VerticalAlignment="Center" Text="File name: " />

            <TextBox Grid.Column="1" x:Name="textBox1" />

        </Grid>

        <Grid x:Name="ContentGrid" Grid.Row="2">

            <Image x:Name="Image1" />

        </Grid>

       

        <ProgressBar x:Name="ProgressBar1" Grid.Row="3" />

    </Grid>

 

  

And this is the code:

 

public partial class MainPage : PhoneApplicationPage

{

DispatcherTimer timer = new DispatcherTimer();

List<string> files = new List<string>() { "Koala.jpg", "Jellyfish.jpg", "Penguins.jpg" };

List<BitmapImage> images = new List<BitmapImage>();

int current = 0;

// Constructor

public MainPage()

{

InitializeComponent();

ProgressBar1.Maximum = files.Count;

foreach (string file in files)

{

BitmapImage image = new BitmapImage(new Uri(file, UriKind.Relative));

images.Add(image);

}

timer = new DispatcherTimer();

timer.Interval = TimeSpan.FromSeconds(2);

timer.Tick += new EventHandler(timer_Tick);

timer.Start();

}

void timer_Tick(object sender, EventArgs e)

{

Image1.Source = images[current];

textBox1.Text = files[current];

ProgressBar1.Value = current;

current++;

if (current >= files.Count)

current = 0;

}

private void CheckBox_Checked(object sender, RoutedEventArgs e)

{

timer.Start();

}

private void CheckBox_Unchecked(object sender, RoutedEventArgs e)

{

timer.Stop();

}

}

Comments

• Anonymous
  August 02, 2012
  Make sure you add a using reference to System.Windows.Threading

• Anonymous
  December 26, 2013
  I try intruduce timer.tick and give me a error, why?

• Anonymous
  February 16, 2014
  Add: using System.Windows.Threading; using System.Windows.Media.Imaging;