Search code examples
c#ui-design

Perform UI updates in a loop


I am working on a mobile application UI that has a panel with momentum (for smooth scrolling) and I am currently updating the UI durring the smooth scrolling by using the following code:

private void scrollKinetic()
{
    while (_curState == States.KineticScroll)
    {
        //  This gets how far the panel will move with the current velocity, then updates the velocity according to the current friction.
        var distY = GetDistance(scrVelocity.Y);
        var distX = GetDistance(scrVelocity.X);

        if (distY + distX <= 0)  //  Friction will eventually make distX and distY both 0
        {
            _curState = States.Idle;
            Invalidate();
            break;
        }

        //  CalculatePosition will move the panel accordingly.

        CalculatePosition(distY, scrVelocity.Y, false);
        CalculatePosition(distX, scrVelocity.X, true);

        Invalidate();
        friction++;
        Application.DoEvents();
    }
}

As you can see, Application.DoEvents(); is rearing its ugly head! I want to get rid of it, but I can't think of any way to loop and update the UI. Any help/ideas would be excellent!

I'm doing this on the .net CF, but I think it's a design issue, so I don't think the platform will matter too much.


Solution

  • You could try and remove the loop (and all App.DoEvent calls), make a call to KineticScroll in your OnPaint() method, and then call Invalidate() in your KineticScroll method.

    I see that you have some kind of state tracking, so you can say something like:

    if(_curState == States.KineticScroll)
        KineticScroll();
    

    in your OnPaint() method, that way you only call it when your state is approprate.

    Basically, your loop goes from a local while loop to: OnPaint -> KineticScroll -> Invalidate -> OnPaint...etc that way you get the same loop, w/o making a call to DoEvents!