Question

I’ve got a custom (and getting complex) TabControl. It’s a gathering of many sources, plus my own wanted features. In it is a custom Panel to show the headers of the TabControl. Its features are to compress the size of the TabItems until they reached their minimum, and then activates scrolling features (in the Panel, again). There is also another custom panel to hold a single button, that renders on the right of the TabItems (it’s a “new tab” button).

It all works great, until I try to animate the scrolling.

Here are some relevant snippets :

In the CustomTabPanel (C#, overriding Panel and implementing IScrollInfo):

private readonly TranslateTransform _translateTransform = new TranslateTransform();

public void LineLeft()
{
    FirstVisibleIndex++;

    var offset = HorizontalOffset + _childRects[0].Width;
    if (offset < 0 || _viewPort.Width >= _extent.Width)
        offset = 0;
    else
    {
        if (offset + _viewPort.Width > _extent.Width)
            offset = _extent.Width - _viewPort.Width;
    }

    _offset.X = offset;
    if (_scrollOwner != null)
        _scrollOwner.InvalidateScrollInfo();

    //Animate the new offset
    var aScrollAnimation = new DoubleAnimation(_translateTransform.X, -offset,
                                           new Duration(this.AnimationTimeSpan), FillBehavior.HoldEnd) { AccelerationRatio = 0.5, DecelerationRatio = 0.5 };
    aScrollAnimation.Completed += ScrollAnimationCompleted;

    _translateTransform.BeginAnimation(TranslateTransform.XProperty, aScrollAnimation , HandoffBehavior.SnapshotAndReplace);

    //End of animation

    // These lines are the only ones needed if we remove the animation
    //_translateTransform.X = -offset;
    //InvalidateMeasure();
}


void ScrollAnimationCompleted(object sender, EventArgs e)
{
    InvalidateMeasure();
}

the _translateTransform is initialized in the constructor :

    base.RenderTransform = _translateTransform;

Again, everything is fine if I remove the animation part and just replace it with the commented out lines at the end.

I must also point out that the problem is NOT with the animation itself. That part works out well. The problem is about when I remove some tab items : all the layout then screws up. The TranslateTransformation seems to hold on some wrong value, or something.

Thanks in advance.

Answer 1

Well. As it’s often the case, I kept working on the thing, and… answered myself.

Could still be useful for other people, so here was the catch. In the line :

var aScrollAnimation = new DoubleAnimation(_translateTransform.X, -offset, new Duration(this.AnimationTimeSpan), FillBehavior.HoldEnd)
    { AccelerationRatio = 0.5, DecelerationRatio = 0.5 };

the FillBehavior should have been FillBehavior.Stop.

As easy as that!