TouchUI - Active UI (part 7)

by Chris 21. November 2009 14:01

When creating a highly active user interface, there is a main difference with a traditional WinForms app, and it is the frequency that the screen is updates. In a WinForms app, only the parts of the screen that has changed is updated, and that logic creates a lot of overhead. Also, with that model it's harder to do things like soft scrolling and animations.

No, I needed something different, and I started to think about games. I guess my recent implementation of the Animeter utility also made me think along those lines. In games you typical find an active user interface as things mostly change all the time, and the screen is updated at a certain frame rate (number of times per second). As you may know, the standard screen refresh rate in an ordinary movie is around 24 frames per second, but for animated moves a more common frequency is about half of that. For most cases in a mobile app, that is sufficient to allow for things to come alive.

In TouchUI, that frequency is handled by a timer set to fire at every 80 milliseconds creating a frame rate of 12.5:

timer = new Timer();
timer.Interval = 80;

timer.Tick += new EventHandler(timer_Tick);
timer.Enabled =
true;

Each time that happens, the screen is redrawn by triggering a simple form refresh:

private void timer_Tick(object sender, EventArgs e)
{
   
this.Refresh();
}

That, in turn, will trigger the OnPaint method to be called, that is responsible for all the painting (as you saw in the previous part of this series).

While this allows for a very responsive and flexible user interface, you need to realize that it really puts the processor to work. Therefore, you probably want to turn all these updates off as soon as the user switch to another app or when the device is put in sleep mode. It can be done by catching the form's activate and deactivate events, like this:

private void MainForm_Activated(object sender, EventArgs e)
{
    timer.Enabled = true;
}

private void MainForm_Deactivate(object sender, EventArgs e)
{
   
timer.Enabled = false;
}

With all this in place, we have a great foundation for creating a highly active user experience with soft scrollling and animations.

Currently rated 5.0 by 1 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

Tags:

Chris | Compact Framework | Windows Mobile | User Interface

Comments

Add comment


(Will show your Gravatar icon)  

  Country flag

biuquote
  • Comment
  • Preview
Loading



Powered by BlogEngine.NET 1.4.5.0
Theme by Mads Kristensen