西安做网站商标,百度经验悬赏任务平台,做商品二维码检测的网站,珠海网站运营wpf实现抽屉效果#xff0c;一般就一个动画显示就完事了#xff0c;我这用到了#xff0c;就研究了一下#xff0c;用装饰器给控件添加遮罩层#xff0c;然后在上面添加抽屉控件#xff0c;虽然麻烦了点#xff0c;也算是自己研究的成果了。看看效果#xff1a;下面就看… wpf实现抽屉效果一般就一个动画显示就完事了我这用到了就研究了一下用装饰器给控件添加遮罩层然后在上面添加抽屉控件虽然麻烦了点也算是自己研究的成果了。看看效果下面就看看代码首先是新建一个装饰器类和之前用过的文章WPF 使用装饰器给控件添加遮罩层 中用的是同样的 public class SimpleAdorner : Adorner{private UIElement child;public SimpleAdorner(UIElement adornedElement) : base(adornedElement){}//Adorner 直接继承自 FrameworkElement//没有Content和Child属性//自己添加一个方便向其中添加我们的控件public UIElement Child{get child;set{if (value null){RemoveVisualChild(child);}else{AddVisualChild(value);}child value;}}//重写VisualChildrenCount 表示此控件只有一个子控件protected override int VisualChildrenCount 1;//控件计算大小的时候我们在装饰层上添加的控件也计算一下大小protected override Size ArrangeOverride(Size finalSize){child?.Arrange(new Rect(finalSize));return finalSize;}//重写GetVisualChild,返回我们添加的控件protected override Visual GetVisualChild(int index){if (index 0 child ! null) return child;return base.GetVisualChild(index);}}
然后新建一个类 [TemplatePart(Name DrawerGrid,Type typeof(Grid))][TemplatePart(Name CloseButton,Type typeof(Button))]public class GDrawer : ContentControl{public Action Closed;private const string DrawerGrid DrawerGrid;private const string CloseButton CloseButton;private Grid _drawerGrid;private Button _closeButton;public override void OnApplyTemplate(){base.OnApplyTemplate();_drawerGrid GetTemplateChild(DrawerGrid) as Grid;_closeButton GetTemplateChild(CloseButton) as Button;_closeButton.Click (s, e) IsOpen false;Loaded OnLoaded;}private void OnLoaded(object sender, RoutedEventArgs e){IsOpen true;}public bool IsOpen{get { return (bool)GetValue(IsOpenProperty); }set { SetValue(IsOpenProperty, value); }}public static readonly DependencyProperty IsOpenProperty DependencyProperty.Register(IsOpen, typeof(bool), typeof(GDrawer), new PropertyMetadata(false,(s,e) {var drawer s as GDrawer;if(e.NewValue is bool b b){drawer.StartAnimationIn();}else{drawer.StartAnimationOut();}}));private async void StartAnimationIn(float seconds0.3f){var sb new Storyboard();var offset _drawerGrid.ActualWidth;var animation new ThicknessAnimation{Duration new Duration(TimeSpan.FromSeconds(seconds)),From new Thickness(-offset,0 , offset,0 ),To new Thickness(0)};Storyboard.SetTargetProperty(animation, new PropertyPath(Margin));sb.Children.Add(animation);sb.Begin(_drawerGrid);await Task.Delay((int)(seconds * 1000));}private async void StartAnimationOut(float seconds0.3f){var sb new Storyboard();var offset _drawerGrid.ActualWidth;var animation new ThicknessAnimation{Duration new Duration(TimeSpan.FromSeconds(seconds)),From new Thickness(0),To new Thickness(-offset, 0, offset, 0),};Storyboard.SetTargetProperty(animation, new PropertyPath(Margin));sb.Children.Add(animation);sb.Begin(_drawerGrid);await Task.Delay((int)(seconds * 1000));Closed?.Invoke();}}
这个就是抽屉效果的实现类了然后在App.xaml里添加样式和资源 Style TargetTypelocal:GDrawerSetter PropertyTemplateSetter.ValueControlTemplate TargetTypelocal:GDrawerGrid x:NameDrawerGrid MinWidth300 MinHeight100 HorizontalAlignmentLeft VerticalAlignmentStretchBackgroundWhiteButton x:NameCloseButton Margin10 Width50 Height30 HorizontalAlignmentRight VerticalAlignmentTop关闭/ButtonContentPresenter //Grid/ControlTemplate/Setter.Value/Setter
/Stylelocal:GDrawer x:KeyLeftDrawerTextBlock VerticalAlignmentCenter HorizontalAlignmentCenter FontSize18 ForegroundRed这是内容/TextBlock/local:GDrawer
最后来到MainWindow窗口xaml代码如下Window x:ClassWPFDemos.MainWindowxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:localclr-namespace:WPFDemosmc:Ignorabledx:NamewidnowWindowStartupLocationCenterScreenTitletitle Height500 Width1000Grid x:Namegrid BackgroundLightBlue!--定义装饰层--AdornerDecorator/Button ClickButton_Click HorizontalAlignmentCenter VerticalAlignmentCenter打开/Button/Grid
/Window
MainWindow窗体后台代码 public partial class MainWindow : Window{public MainWindow(){InitializeComponent();}private void Button_Click(object sender, RoutedEventArgs e){ShowModal(grid);}SimpleAdorner _adorner null;public void ShowModal(Visual visual){//获取visual上面的第一个AdornerLayerAdornerLayer adornerLayer AdornerLayer.GetAdornerLayer(visual);//创建我们定义的Adornervar drawer FindResource(LeftDrawer) as GDrawer;drawer.Closed () adornerLayer.Remove(_adorner);_adorner _adorner?? new SimpleAdorner(adornerLayer){Child new Border(){Background new SolidColorBrush(Color.FromArgb(150, 0, 0, 0)),Child drawer}};adornerLayer.Add(_adorner);}}
这样就完成了如果喜欢点个赞呗~
