2

I'm attempting to achieve automatic animation of size changes for elements. I think there's some interplay of Composition and XAML I don't fully understand.

First, I tried using the XAML extensions from the toolkit:

<TextBox x:Name="TextBoxControl" VerticalAlignment="Center" Width="50">
    <animations:Implicit.Animations>
        <animations:Vector3Animation Target="Size" Duration="0:0:0.5"/>
    </animations:Implicit.Animations>
</TextBox>

...and hoped that it would automatically animate the TextBox as it expanded to accommodate more text. No dice there. I then attempted to wrap the TextBox in an outer Grid, attach the Implicit Animation to the Grid instead. No change.

Next, I tried animating the TextBox Visual's Size by hand:

var visual = ElementCompositionPreview.GetElementVisual(TextBoxControl);
var newSize = new Vector2(visual.Size.X + 20f, visual.Size.Y);
visual.Size = newSize;

Bizarrely, this resulted in a The Parameter is incorrect exception when attempting to set the new Size.

Finally, I tried changing the TextBox UIElement's Width instead of it's Visual Width:

TextBoxControl.Width += 20;

...which didn't animate either.

Finally, in a fit of frustration, I tried to animate the SCALE doing the same thing:

XAML

<TextBox x:Name="TextBoxControl" VerticalAlignment="Center" Width="50">
    <animations:Implicit.Animations>
        <animations:Vector3Animation Target="Scale" Duration="0:0:0.5"/>
    </animations:Implicit.Animations>

C#

var visual = ElementCompositionPreview.GetElementVisual(TextBoxControl);
visual.Scale = new Vector3(visual.Scale.X + 0.1f, visual.Scale.Y + 0.1f, visual.Scale.Z);

...which worked exactly as expected. When I ran the C# code, the TextBox's scale increased, and was animated.

So is there a way to achieve automatic animation of size changes for UI elements by using implicit animations?

PingZing
  • 942
  • 5
  • 20
  • 2
    Unfortunately not, as a side effect of most XAML requiring to be redrawn / have layout passes done on the UI thread every time their size changes - given the UI thread reliance there's not a way of animating the size changes on the Composition thread. You can attempt to use a storyboard to with dependent animations enabled to animate the size changes, but it won't be implicit, not guaranteed to be smooth because of the layout passes every frame. – Johnny Westlake Jun 16 '18 at 15:59

0 Answers0