Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p><em>If</em> you can use <code>Interactions</code> with <code>FluidLayout</code> (<a href="http://www.microsoft.com/download/en/details.aspx?id=10801" rel="nofollow">Blend 4 SDK</a>) you are in luck, it's really useful for those fancy animation things.</p> <p>First set the content CP's Height to 0:</p> <pre><code>&lt;ContentPresenter Grid.Row="1" HorizontalAlignment="Stretch" x:Name="_expanderContent" Height="0"/&gt; </code></pre> <p>To animate this, the <code>Height</code> just needs to be animated to <code>NaN</code> in the <code>VisualState</code> that represents the expanded state (non-discrete animations would not let you use <code>NaN</code>):</p> <pre><code>xmlns:is="http://schemas.microsoft.com/expression/2010/interactions" </code></pre> <pre><code>&lt;Grid x:Name="MainGrid" Background="White"&gt; &lt;VisualStateManager.CustomVisualStateManager&gt; &lt;is:ExtendedVisualStateManager/&gt; &lt;/VisualStateManager.CustomVisualStateManager&gt; &lt;VisualStateManager.VisualStateGroups&gt; &lt;VisualStateGroup x:Name="ExpansionStates" is:ExtendedVisualStateManager.UseFluidLayout="True"&gt; &lt;VisualStateGroup.Transitions&gt; &lt;VisualTransition GeneratedDuration="0:0:1"/&gt; &lt;/VisualStateGroup.Transitions&gt; &lt;VisualState x:Name="Expanded"&gt; &lt;Storyboard&gt; &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="_expanderContent"&gt; &lt;DiscreteDoubleKeyFrame KeyTime="0" Value="NaN"/&gt; &lt;/DoubleAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Collapsed"/&gt; &lt;/VisualStateGroup&gt; &lt;/VisualStateManager.VisualStateGroups&gt; &lt;!-- ... ---&gt; </code></pre> <p>That should be all that is necessary, the fluid layout will create the transition for you from there.</p> <hr> <p>If you have a code-behind solution that would be fine, you can even use code-behind in dictionaries like this:</p> <pre><code>&lt;!-- TestDictionary.xaml --&gt; &lt;ResourceDictionary x:Class="Test.TestDictionary" ...&gt; </code></pre> <pre><code>//TestDictionary.xaml.cs using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Windows; namespace Test { partial class TestDictionary : ResourceDictionary { //Handlers and such here } } </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload