Oggi nel newsgroup di Blend è emersa una domanda interessante ovvero come creare uno StackPanel che possa far sparire e riapparire gradualmente gli elementi non completamente visibili dopo un ridimensionamento.
Quale migliore occasione per inventarsi un FadeStackPanel?

using System;
using System.Collections.Generic;
using System.Text;
using System.Windows.Controls;
using System.Windows;
using System.Windows.Media;
using System.Windows.Media.Animation;
 
namespace FadePanel
{
 class FadeStackPanel:StackPanel
 {
 DoubleAnimation fadeOut = new DoubleAnimation(1, 0, new Duration(TimeSpan.FromMilliseconds(1000)));
 DoubleAnimation fadeIn = new DoubleAnimation(0, 1, new Duration(TimeSpan.FromMilliseconds(1000)));
 
 public FadeStackPanel ():base()
 {
 }
 protected override void OnRenderSizeChanged (System.Windows.SizeChangedInfo sizeInfo)
 {
 base.OnRenderSizeChanged(sizeInfo);
 int totalChildren = base.VisualChildrenCount;
 //Enumerates stackpanel children
 for (int i = 0; i < totalChildren; i++)
 {
 UIElement child = base.Children[i];
 FrameworkElement elem=child as FrameworkElement;
 if (elem != null)
 {
 bool outside = (child.DesiredSize.Width < child.RenderSize.Width);
 if (outside)
 {
 if (elem.Tag == null) elem.BeginAnimation(UIElement.OpacityProperty, fadeOut);
 elem.Tag = 0;
 }
 else
 if (elem.Tag != null)
 {
 child.BeginAnimation(UIElement.OpacityProperty, fadeIn);
 elem.Tag = null;
 }
 }
 }
 }
 }
}

A questo punto il FadePanel può essere usato in sostituzione di qualsiasi StackPanel come nello XAML che segue:

<Window
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 xmlns:l="clr-namespace:FadePanel"
 x:Class="FadePanel.Window1"x:Name="Window" Title="Window1"Width="658" Height="480" Background="Cyan">
 <Grid x:Name="LayoutRoot">
 <l:FadeStackPanel Margin="10,10,28,22" x:Name="fpanel">
 <TextBox Width="534" Height="31.5" Text="TextBox" TextWrapping="Wrap"/>
 <TextBox Width="261" Height="42" Text="TextBox" TextWrapping="Wrap"/>
 </l:FadeStackPanel>
 </Grid>
</Window>

Come è facile intuire il FadePanel non fa altro che triggerare delle animazioni che agiscono sulla proprietà Opacity quando la DesiredSize è inferiore alla RenderSize ad indicare che il controllo "sborda".
Il codice è palesemente incompleto e sopratutto si appoggia alla proprietà Tag degli elementi contenuti nel pannello (cosa che sarebbe meglio evitare).
Agli eventuali interessati l'onere di perfezionarlo.

Technorati Tags: