Wpf 抽屉效果
2021-07-09 13:08
标签：ati try animation rop nsf mat on() cli www. 在android开发中有抽屉效果，就是在页面的边上有一个按钮，可以通过点击或者拖拽这个按钮，让页面显示。Wpf也可以实现相同的效果。 主要是通过一个DoubleAnimation和RectAnimation动画实现 Demo地址 http://pan.baidu.com/s/1gdxHhnX Wpf 抽屉效果 标签：ati try animation rop nsf mat on() cli www. 原文地址：https://www.cnblogs.com/lonelyxmas/p/9704343.htmlGrid HorizontalAlignment="Center" Width="90" Height="130" Background="Blue">
Image x:Name="Thumb" Source="high.png" Width="90" Height="125">
Image.RenderTransform>
TranslateTransform x:Name="Translate">TranslateTransform>
Image.RenderTransform>
Image.Clip>
RectangleGeometry x:Name="ClipRect" Rect="0,0,90,125" >RectangleGeometry>
Image.Clip>
Image>
Grid>
private bool _Expand = true;
public bool Expand
{
get { return _Expand; }
set
{
_Expand = value;
Duration duration = new Duration(TimeSpan.FromSeconds(1));
FillBehavior behavior = FillBehavior.HoldEnd;
DoubleAnimation translateAnim = new DoubleAnimation();
translateAnim.Duration = duration;
translateAnim.FillBehavior = behavior;
RectAnimation clipAnim = new RectAnimation();
clipAnim.Duration = duration;
clipAnim.FillBehavior = behavior;
double delta = 80; //收缩的大小
if (_Expand) // Expand
{
translateAnim.From = -delta;
translateAnim.To = 0;
clipAnim.From = new Rect(delta, 0, Thumb.ActualWidth, Thumb.ActualHeight);
clipAnim.To = new Rect(0, 0, Thumb.ActualWidth, Thumb.ActualHeight);
}
else //Shrink
{
translateAnim.From = 0;
translateAnim.To = -delta;
clipAnim.From = new Rect(0, 0, Thumb.ActualWidth, Thumb.ActualHeight);
clipAnim.To = new Rect(delta, 0, Thumb.ActualWidth, Thumb.ActualHeight);
}
Translate.BeginAnimation(TranslateTransform.XProperty, translateAnim);
ClipRect.BeginAnimation(RectangleGeometry.RectProperty, clipAnim);
}
}
上一篇：WPF 画线动画效果实现