wpf 仿layui 左侧导航菜单

<UserControl x:Class="SZJGrains.Views.ManViews.LeftMenu"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:local="clr-namespace:SZJGrains.Views.ManViews"

mc:Ignorable="d"

d:DesignHeight="450" d:DesignWidth="800">

<Grid>

<Border x:Name="Sidebar" Width="220" Background="#393D49" VerticalAlignment="Stretch">

<StackPanel>

<!-- Logo区域 -->

<Border Background="#2B2E37" Height="60" Padding="15" BorderBrush="#424652" BorderThickness="0 0 0 1">

<TextBlock Text="管理系统" Foreground="White" FontSize="18" FontWeight="Bold" VerticalAlignment="Center"/>

</Border>

<!-- 导航菜单 -->

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Hidden">

<StackPanel>

<ToggleButton Style="{StaticResource SidebarTButtonStyle}" Content="控制台" Tag="&#xE80F;" IsChecked="True"/>

<Border Background="#2B2E37" Height="1" Margin="0"/>

<ToggleButton Style="{StaticResource SidebarTButtonStyle}" Click="ToggleButton_Click" x:Name="SystemManagementBtn" Content="系统管理" Tag="&#xE713;"/>

<StackPanel Visibility="Visible" Margin="0" x:Name="SystemManagementPanel">

<Button Style="{StaticResource SidebarButtonStyle}" Content="用户管理" Tag="&#xE77B;" Padding="35 10 10 10"/>

<Button Style="{StaticResource SidebarButtonStyle}" Content="角色管理" Tag="&#xE803;" Padding="35 10 10 10"/>

<Button Style="{StaticResource SidebarButtonStyle}" Content="权限管理" Tag="&#xE743;" Padding="35 10 10 10"/>

</StackPanel>

<Border Background="#2B2E37" Height="1" Margin="0"/>

<ToggleButton Style="{StaticResource SidebarTButtonStyle}" Click="ToggleButton_Click" x:Name="ContentManagementBtn" Content="内容管理" Tag="&#xE8B3;"/>

<StackPanel Visibility="Collapsed" Margin="0" x:Name="ContentManagementPanel">

<Button Style="{StaticResource SidebarButtonStyle}" Content="文章管理" Tag="&#xE8BD;" Padding="35 10 10 10"/>

<Button Style="{StaticResource SidebarButtonStyle}" Content="分类管理" Tag="&#xE89A;" Padding="35 10 10 10"/>

<Button Style="{StaticResource SidebarButtonStyle}" Content="评论管理" Tag="&#xE916;" Padding="35 10 10 10"/>

</StackPanel>

<Border Background="#2B2E37" Height="1" Margin="0"/>

<ToggleButton Style="{StaticResource SidebarTButtonStyle}" Content="数据统计" Tag="&#xE9D2;"/>

<Border Background="#2B2E37" Height="1" Margin="0"/>

<ToggleButton Style="{StaticResource SidebarTButtonStyle}" Click="ToggleButton_Click" x:Name="SystemSettingsBtn" Content="系统设置" Tag="&#xE713;"/>

<StackPanel Visibility="Collapsed" Margin="0" x:Name="SystemSettingsPanel">

<Button Style="{StaticResource SidebarButtonStyle}" Content="基本设置" Tag="&#xE71C;" Padding="35 10 10 10"/>

<Button Style="{StaticResource SidebarButtonStyle}" Content="安全设置" Tag="&#xE72E;" Padding="35 10 10 10"/>

<Button Style="{StaticResource SidebarButtonStyle}" Content="邮件设置" Tag="&#xE715;" Padding="35 10 10 10"/>

</StackPanel>

</StackPanel>

</ScrollViewer>

</StackPanel>

</Border>

</Grid>

</UserControl>

using System;

using System.Collections.Generic;

using System.Collections.ObjectModel;

using System.Linq;

using System.Reflection;

using System.Text;

using System.Threading.Tasks;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Data;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Imaging;

using System.Windows.Shapes;

using static MaterialDesignThemes.Wpf.Theme.ToolBar;

namespace SZJGrains.Views

{

/// <summary>

/// MainView.xaml 的交互逻辑

/// </summary>

public partial class MainView : Window

{

ObservableCollection<Components.MenuNavigation.MenuItem> menuItems;

// 定义菜单的两种宽度

private const double MenuExpandedWidth = 230;

private const double MenuCollapsedWidth = 60;

// 记录当前菜单状态

private bool _isMenuExpanded = true;

public MainView()

{

InitializeComponent();

LoadMenuItems();

// 订阅菜单切换事件

top.MenuToggleClicked += OnMenuToggleClicked;

}

/// <summary>

/// 处理菜单切换事件

/// </summary>

private void OnMenuToggleClicked(object sender, RoutedEventArgs e)

{

// 切换菜单状态

_isMenuExpanded = !_isMenuExpanded;

// 更新菜单宽度

var menuBorder = (Border)FindName("menuBorder"); // 需要给左侧Border命名为menuBorder

menuBorder.Width = _isMenuExpanded ? MenuExpandedWidth : MenuCollapsedWidth;

// 可以在这里添加其他需要的动画或布局调整

}

private void LoadMenuItems()

{

menuItems = new ObservableCollection<Components.MenuNavigation.MenuItem>();

// 系统管理菜单

var systemMenu = new Components.MenuNavigation.MenuItem

{

Title = "系统管理",

Icon = "&#xE80F;",

Children =

{

new Components.MenuNavigation.MenuItem

{

Title = "用户管理",

Icon = "&#xE77B;",

ViewName ="Views.User.UserPage",

Command = new RelayCommand(_ => ShowContent("Views.User.UserPage"))

},

new Components.MenuNavigation.MenuItem

{

Title = "角色管理",

Icon = "&#xE803;",

ViewName ="Views.Role.RolePage",

Command = new RelayCommand(_ => ShowContent("Views.Role.RolePage"))

},

new Components.MenuNavigation.MenuItem

{

Title = "权限管理",

Icon = "&#xE743;",

ViewName ="Views.User.UserPage",

}

}

};

// 数据管理菜单

var dataMenu = new Components.MenuNavigation.MenuItem

{

Title = "基础设置",

Icon = "&#xE7B5;",

Children =

{

new Components.MenuNavigation.MenuItem

{

Title = "仓库管理",

IsSelected=true,

Icon = "&#xE7BA;",

ViewName="Views.WareHouse.WareHousePage",

},

new Components.MenuNavigation.MenuItem

{

Title = "粮食管理",

Icon = "&#xE777;",

ViewName="Views.Grain.GrainPage",

},

new Components.MenuNavigation.MenuItem

{

Title = "地磅管理",

Icon = "&#xE777;",

ViewName="Views.Weighbridge.WeighbridgePage",

},

new Components.MenuNavigation.MenuItem

{

Title = "摄像头管理",

Icon = "&#xE777;",

ViewName="Views.Camera.CameraPage",

}, new Components.MenuNavigation.MenuItem

{

Title = "主界面",

Icon = "&#xE777;",

ViewName="Views.DashBoard.DashBoardPage",

},

new Components.MenuNavigation.MenuItem

{

Title = "字段管理",

Icon = "&#xE743;",

ViewName ="Views.FormField.FormFieldPage",

}

}

};

// 添加菜单项

//foreach (var item in dataMenu.Children)

//{

// item.Command = new RelayCommand(_ => ChangeItem(item));

//}

var zhifuMenu = new Components.MenuNavigation.MenuItem

{

Title = "费用结算",

Icon = "&#xE7B5;",

};

var yushouyufuMenu = new Components.MenuNavigation.MenuItem

{

Title = "预售预付",

Icon = "&#xE7B5;",

};

var otherFeeMenu = new Components.MenuNavigation.MenuItem

{

Title = "其他费用",

Icon = "&#xE7B5;",

};

var ReportsMenu = new Components.MenuNavigation.MenuItem

{

Title = "报表",

Icon = "&#xE7B5;",

};

menuItems.Add(systemMenu);

menuItems.Add(dataMenu);

menuItems.Add(zhifuMenu);

menuItems.Add(yushouyufuMenu);

menuItems.Add(otherFeeMenu);

menuItems.Add(ReportsMenu);

foreach (var t in menuItems)

{

foreach (var t2 in t.Children)

{

t2.Command = new RelayCommand(_ => ChangeItem(t2)); ;

}

}

MenuNavControl.MenuItems = menuItems;

}

private void ShowContent(string content)

{

mainFrame.Content = CreateUserControlFromFileName(content);

}

void ChangeItem(Components.MenuNavigation.MenuItem item)

{

foreach (var t in menuItems)

{

foreach (var t2 in t.Children)

{

t2.IsSelected = false;

}

}

item.IsSelected = true;

mainFrame.Content = CreateUserControlFromFileName(item.ViewName);

}

public UserControl CreateUserControlFromFileName(string fileNameWithoutExtension)

{

if(string.IsNullOrWhiteSpace(fileNameWithoutExtension)) MessageBox.Show($"找不到指定的模块");

fileNameWithoutExtension = fileNameWithoutExtension.Replace("/", ".");

// 获取当前程序集

Assembly assembly = Assembly.GetExecutingAssembly();

// 假设所有UserControl都在当前程序集的"Views"命名空间下

string fullTypeName = $"SZJGrains.{fileNameWithoutExtension}";

// 获取类型

Type type = assembly.GetType(fullTypeName);

if (type == null || !typeof(UserControl).IsAssignableFrom(type))

{

//throw new ArgumentException($"找不到指定的UserControl: {fileNameWithoutExtension}");

MessageBox.Show("找不到指定的模块");

return null;

}

// 创建实例

return (UserControl)Activator.CreateInstance(type);

}

}

public class RelayCommand : ICommand

{

private readonly Action<object> _execute;

private readonly Predicate<object> _canExecute;

public RelayCommand(Action<object> execute, Predicate<object> canExecute = null)

{

_execute = execute ?? throw new ArgumentNullException(nameof(execute));

_canExecute = canExecute;

}

public bool CanExecute(object parameter) => _canExecute?.Invoke(parameter) ?? true;

public void Execute(object parameter) => _execute(parameter);

public event EventHandler CanExecuteChanged

{

add => CommandManager.RequerySuggested += value;

remove => CommandManager.RequerySuggested -= value;

}

}

}