SebastianR February 2016

Animating the SplitView.OpenPaneLength in UWP

I use the SplitView control in UWP and want to increase the width of the SplitView if the user clicks on certain top-level items in it. The SplitView should display a second level of options. Microsoft's UWP Mail App does something like this: if you click on "Folders", you get a list of all available folders as an extension to the SplitView. This extension is nicely animated.

I can easily increase the SplitView's OpenPaneLength with a setter like this:

<Setter Target="MainSplitView.(SplitView.OpenPaneLength)" Value="260"/>

Put this doesn't animate the changes. Is it possible to do this?


igrali February 2016

The setter sets discrete values, so you need to use a Storyboard (VisualState.Storyboard) and a DoubleAnimation, something like this: (haven't tested it, but it should give you the idea...)

<DoubleAnimation Storyboard.TargetName="MainSplitView"
                 To="260" />

Post Status

Asked in February 2016
Viewed 1,916 times
Voted 5
Answered 1 times


Leave an answer