當前位置：首頁 > 编程语言 > C# >内容正文

C#

.NET CORE(C#) WPF 值得推荐的动画菜单设计

發布時間：2023/12/4 C# 31 豆豆

生活随笔收集整理的這篇文章主要介紹了 .NET CORE(C#) WPF 值得推荐的动画菜单设计小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

微信公眾號：Dotnet9，網站：Dotnet9，問題或建議：請網站留言，如果對您有所幫助：歡迎贊賞。

.NET CORE(C#) WPF 值得推薦的動畫菜單設計

閱讀導航

本文背景

代碼實現

本文參考

源碼

1. 本文背景

YouTube上老外的一個設計，站長覺得不錯，分享給大家作為參考，抽屜菜單的動畫做的非常不錯。

運行起始界面：

站長運行操作一遍，錄制了動畫大家看看：

2. 代碼實現

使用 .NET CORE 3.1 創建名為 “AnimatedMenu” 的WPF模板項目，添加1個Nuget庫：MaterialDesignThemes，版本為最新預覽版3.1.0-ci948。

解決方案主要文件目錄組織結構：

AnimatedMenu
- MainWindow.xaml.cs
- App.xaml
- MainWindow.xaml

2.1 引入樣式

文件【App.xaml】，在 StartupUri 中設置啟動的視圖【MainWindow.xaml】，并在【Application.Resources】節點增加 MaterialDesignThemes庫的樣式文件：

<Application.Resources><ResourceDictionary><ResourceDictionary.MergedDictionaries><ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Dark.xaml" /><ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" /><ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.Blue.xaml" /><ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Blue.xaml" /></ResourceDictionary.MergedDictionaries></ResourceDictionary> </Application.Resources>

2.2 演示窗體

文件【MainWindow.xaml】，布局代碼、動畫代碼都在此文件中，源碼如下：

簡單說明下：

"StackPanelMenu" 作為左側菜單容器，默認是顯示在窗體外，距離窗體左邊緣-250，點擊左上角菜單按鈕圖標可控制此容器的顯示與隱藏，注：菜單開關由兩個按鈕組成 "ButtonOpenMenu" 和 "ButtonCloseMenu"。

左側菜單項使用 "ListView" 進行布局，實際開發需要運用模板，使用MVVM做成動態菜單，方便擴展。

中間的5張演示照片，也和2類似。直接使用Grid進行的布局，實際上都需要做成模板。

抽屜菜單動畫見 Window.Resouces 中的動畫代碼，展開抽屜菜單動畫是 "OpenMenu"，左側菜單向右、向下移動，右側展示區域及個人信息概況界面同時也是向右、向下移動；關閉抽屜菜單動畫是 "CloseMenu"，動畫移動方向與展開時相反（說的是廢話），這段動畫代碼值得好好學習、復用。

文件【MainWindow.xaml.cs】，后臺關閉窗體、抽屜菜單按鈕切換、窗體移動等事件處理：

private void ButtonClose_Click(object sender, RoutedEventArgs e) {Application.Current.Shutdown(); }private void ButtonOpenMenu_Click(object sender, RoutedEventArgs e) {ButtonOpenMenu.Visibility = Visibility.Collapsed;ButtonCloseMenu.Visibility = Visibility.Visible; }private void ButtonCloseMenu_Click(object sender, RoutedEventArgs e) {ButtonOpenMenu.Visibility = Visibility.Visible;ButtonCloseMenu.Visibility = Visibility.Collapsed; }private void MoveWindow_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e) {DragMove(); }

代碼已全部奉上...

3.本文參考

視頻一：C# WPF Material Design UI: Animated Menu，配套源碼：AnimatedMenu1。

C# WPF開源控件庫《MaterialDesignInXAML》

4.源碼

效果圖實現代碼在文中已經全部給出，站長方便演示，文中的圖片使用的本站外鏈圖片，代碼可直接Copy，按解決方案目錄組織代碼文件即可運行。

演示Demo下載

除非注明，文章均由?Dotnet9?整理發布，歡迎轉載。
轉載請注明本文地址：https://dotnet9.com/7669.html
歡迎掃描下方二維碼關注 Dotnet9 的微信公眾號，本站會及時推送最新技術文章

時間如流水，只能流去不流回！

點擊《【閱讀原文】》，本站還有更多技術類文章等著您哦！！！

此刻順便為我點個《【再看】》可好？

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的.NET CORE(C#) WPF 值得推荐的动画菜单设计的全部內容，希望文章能夠幫你解決所遇到的問題。

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

上一篇： .NET Core验证ASP.NET密码
下一篇： C#的未来：简化参数空值验证