本例給大家介紹兩個自定義控件，一個有顯示和關閉兩種狀態，在狀態切換時有動畫效果。另外一個是可以拖動的內容控件，可以制作能拖動的面板。

???????? A．帶關閉動畫的內容控件。

　　.xaml

View Code <ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:SuperMapStandardMapApp1">
<Style TargetType="local:CustomPanel">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:CustomPanel">
<Grid x:Name="LayoutRoot" RenderTransformOrigin="{TemplateBinding RenderTransformOrigin}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="ViewStates">
<VisualState x:Name="Open">
<Storyboard>
<DoubleAnimation BeginTime="00:00:00" Duration="00:00:0.3" Storyboard.TargetName="CustomPanelScale" Storyboard.TargetProperty="ScaleY" To="1" />
<DoubleAnimation BeginTime="00:00:00" Duration="00:00:0.3" Storyboard.TargetName="CustomPanelScale" Storyboard.TargetProperty="ScaleX" To="1" />
<DoubleAnimation BeginTime="00:00:00" Duration="00:00:0.3" Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="Opacity" To="1" />
</Storyboard>
</VisualState>
<VisualState x:Name="Close">
<Storyboard>
<DoubleAnimation BeginTime="00:00:00" Duration="00:00:0.2" Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="Opacity" To="0" />
<DoubleAnimation BeginTime="00:00:00" Duration="00:00:0.2" Storyboard.TargetName="CustomPanelScale" Storyboard.TargetProperty="ScaleY" To="0" />
<DoubleAnimation BeginTime="00:00:00" Duration="00:00:0.2" Storyboard.TargetName="CustomPanelScale" Storyboard.TargetProperty="ScaleX" To="1" />
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ContentPresenter x:Name="Content"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}">
</ContentPresenter>
<Grid.RenderTransform>
<ScaleTransform x:Name="CustomPanelScale" ScaleX="1" ScaleY="1" />
</Grid.RenderTransform>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="Red"/>
</Style>

</ResourceDictionary>

　定義兩　VisualState 一個open，一個close 代表內容控件的兩個狀態，添加ContentPresenter標簽代表內容控件所添加的內容。

.cs

View Code namespace SuperMapStandardMapApp1
{
[TemplateVisualState(GroupName = "ViewStates", Name = "Open")]
[TemplateVisualState(GroupName = "ViewStates", Name = "Close")]
public partial class CustomPanel : ContentControl
{
public CustomPanel()
{
DefaultStyleKey = typeof(CustomPanel);
}

public override void OnApplyTemplate()
{
base.OnApplyTemplate();
this.ChangeVisualState(true);
}

#region Dependency Properties

/// <summary>
/// 獲取或設置內容控件是否顯示
/// </summary>
/// <value>
/// <c>true</c> 設置時控件進行顯示; 否則不顯示, <c>false</c>.
/// </value>
///

public bool IsOpnen
{
get { return (bool)GetValue(IsOpenProperty); }
set { SetValue(IsOpenProperty, value); }

}

public static readonly DependencyProperty IsOpenProperty = DependencyProperty.Register("IsOpen", typeof(bool), typeof(CustomPanel), new PropertyMetadata(true, OnIsOpenPertyChange));

public static void OnIsOpenPertyChange(DependencyObject obj, DependencyPropertyChangedEventArgs e)
{
(obj as CustomPanel).ChangeVisualState(true);
}

#endregion

private void ChangeVisualState(bool useTransitions)
{
if (IsOpnen)
{
VisualStateManager.GoToState(this, "Open", useTransitions);
}
else
{
VisualStateManager.GoToState(this, "Close", useTransitions);
}
}

}
}

說明兩個：TemplateVisualState分別代表close和open狀態，注冊一個DependencyProperty ISOpen表示此內容面板是否開啟，在ChangeVisualState方法中，通過 VisualStateManager.GoToState(this, "Open", useTransitions); VisualStateManager.GoToState(this, "Close", useTransitions);說明轉化到哪個狀態。這樣便定義了一個可以有兩狀態相互轉化的內容控件！如圖：

轉載于:https://www.cnblogs.com/doudougou/archive/2011/08/14/2138491.html

總結

以上是生活随笔為你收集整理的Silverlight带关闭动画的内容控件，可移动的内容控件（一）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。