Animare RowDefinition.Height e ColumnDefinition.Width

Prima domanda e’ perche’ volete eseguire un’ animazione sulla colonna o sulla riga.

Analizziamo l’ animazione dell’ altezza di una riga.

Se si vuole mostrare il contenuto di una riga come un expander, il consiglio e’ quello di settare il valore Height=auto sulla RowDefinition, e Height=0 sul contenuto. Da xaml creare uno Storyboard che modifichi l’ Height del contenuto portandolo al valore desiderato. Semplice e veloce.

Se invece non si puo’ fare questo gioco perche’ ad esempio si vuole anche un GridSplitter, ecco il codice xaml:

<Grid Grid.Column="1" Margin="10,0,0,0">
 <Grid.RowDefinitions>
 <RowDefinition x:Name="RowNote" Height="0"/>
 <RowDefinition />
   </Grid.RowDefinitions>
<Border> ...............   <Button x:Name="BtnCloseNote"Click="BtnCloseNote_Click" />

 </Border>
<GridSplitter x:Name="SplitterNote" Height="3" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalAlignment="Bottom" />
 <Grid>
.............
 </Grid>
</Grid>

ed ecco il codice cs:

        public static readonly DependencyProperty HeightNoteProperty = DependencyProperty.Register(
                "HeightNote"typeof(double), typeof(ImgEditing), new PropertyMetadata(0.0, HeightNote_Changed));

        public static void HeightNote_Changed(DependencyObject d, DependencyPropertyChangedEventArgs e )
        {
            var thisObj = d as ImgEditing;

            thisObj.RowNote.Height = new GridLength((double)e.NewValue);
        }

//-------------- Gestione Eventi ------------------------------

        private void BtnOpenNote_Click(object sender, RoutedParameterEventArgs<object> e)
        {
             DoubleAnimation anim = new DoubleAnimation(120, new Duration(TimeSpan.FromMilliseconds(500)));

            this.BeginAnimation(ImgEditing.HeightNoteProperty, anim);
        }

        private void BtnCloseNote_Click(object sender, System.Windows.RoutedEventArgs e)
        {
            DoubleAnimation anim = new DoubleAnimation(0, new Duration(TimeSpan.FromMilliseconds(400)));

            this.BeginAnimation(ImgEditing.HeightNoteProperty, anim);
        }
        public static readonly DependencyProperty HeightNoteProperty = DependencyProperty.Register(
                "HeightNote"typeof(double), typeof(ImgEditing), new PropertyMetadata(0.0, HeightNote_Changed));

        public static void HeightNote_Changed(DependencyObject d, DependencyPropertyChangedEventArgs e )
        {
            var thisObj = d as ImgEditing;

            thisObj.RowNote.Height = new GridLength((double)e.NewValue);
        }

Non e’ possibile animare la proprieta’ value di un GridLenght perche’ non e’ una dependency prop, quindi si realizza una dependendcy prop all’ interno del nostro controllo e poi si anima questa.

Si utilizza l’ evento Changed come converter per variare realmente l’ altezza della riga della grid.

A livello prestazionale non e’ il massimo, quindi se potete, usate l’ altra soluzione

Annunci

Informazioni su Andrea Regoli

Project Manager .Net Developer WPF WP7 Asp.Net c# javascript ajax SQL sharepoint
Questa voce è stata pubblicata in .Net, Silverlight, WP7 e contrassegnata con , , , , , , . Contrassegna il permalink.

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...