实现侧边伸缩菜单栏

效果

点击头部的菜单就可以伸缩

可以设置收缩后的宽度

准备

添加两个包

关键代码演示

MainView.xaml.cs

头部加
xmlns:prism=“http://prismlibrary.com/”
xmlns:materialDesign=“http://materialdesigninxaml.net/winfx/xaml/themes”
伸缩展开按钮

 <Button x:Name="button" HorizontalAlignment="left" VerticalAlignment="Top" Margin="10" Style="{StaticResource MaterialDesignFlatButton}" Click="Button_Click">
                    <materialDesign:PackIcon Kind="Menu" Foreground="White"/>
                </Button>

展开后的菜单栏

<Grid>
                <Grid >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid Background="#FFCBCBCB" x:Name="StackPanelMain" Grid.Column="1">
                        
                    </Grid>
                    <Grid x:Name="grid" Width="230" Background="#FF6C6C8D" RenderTransformOrigin="0.5,0.5" Grid.Column="0">
                        <ScrollViewer  VerticalScrollBarVisibility="Hidden"  HorizontalAlignment="Stretch"  >
                            <StackPanel x:Name="Menu" Margin="10"/>
                        </ScrollViewer>
                        
                    </Grid>
                    
                </Grid>
            </Grid>

mainview.cs

using MaterialDesignThemes.Wpf;
using MyToDo.common.Models;
using System;
using System.Collections.Generic;
using System.Linq;
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.Animation;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
using System.Windows.Threading;

using MaterialDesignThemes.Wpf;
using System;
using System.Collections.Generic;
using System.Linq;
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.Navigation;
using System.Windows.Shapes;

namespace MyToDo.Views
{
    /// <summary>
    /// MainView.xaml 的交互逻辑
    /// </summary>
    public partial class MainView : Window
    {
        private DispatcherTimer ShowTimer;
        private bool MenuClosed=false;

        public MainView()
            
        {
            
            InitializeComponent();

            

            btnMin.Click += (s, e) => { this.WindowState = WindowState.Minimized; };
            btnMax.Click += (s, e) =>
            {
                if (this.WindowState == WindowState.Maximized)
                {
                    this.WindowState = WindowState.Normal;
                }
                else
                {
                    this.WindowState = WindowState.Maximized;
                }




            };
            btnClose.Click += (s, e) => { this.Close(); };
            ShowTime();    //在这里窗体加载的时候不执行文本框赋值，窗体上不会及时的把时间显示出来，而是等待了片刻才显示了出来

            ShowTimer = new System.Windows.Threading.DispatcherTimer();

            ShowTimer.Tick += new EventHandler(ShowCurTimer);//起个Timer一直获取当前时间

            ShowTimer.Interval = new TimeSpan(0, 0, 0, 1, 0);

            ShowTimer.Start();


            var home = new List<SubItem>();

            home.Add(new SubItem("客户", new MainWindows()));
            var item6 = new ItemMenu("首页", home, PackIconKind.Home);
            

            var menuRegister = new List<SubItem>();
            menuRegister.Add(new SubItem("客户", new MainWindows()));
            menuRegister.Add(new SubItem("供应商", new MainWindows()));
            menuRegister.Add(new SubItem("员工"));
            menuRegister.Add(new SubItem("产品"));
            menuRegister.Add(new SubItem("服务"));
            menuRegister.Add(new SubItem("会议"));
            var item1 = new ItemMenu("预约", menuRegister, PackIconKind.Schedule);

            var menuReports = new List<SubItem>();
            menuReports.Add(new SubItem("客户"));
            menuReports.Add(new SubItem("供应商"));
            menuReports.Add(new SubItem("产品"));
            menuReports.Add(new SubItem("库存"));
            menuReports.Add(new SubItem("销售额"));
            var item2 = new ItemMenu("报告", menuReports, PackIconKind.FileReport);

            var menuExpenses = new List<SubItem>();
            menuExpenses.Add(new SubItem("固定资产"));
            menuExpenses.Add(new SubItem("流动资金"));
            var item3 = new ItemMenu("费用", menuExpenses, PackIconKind.ShoppingBasket);

            var menuFinancial = new List<SubItem>();
            menuFinancial.Add(new SubItem("首页"));

            var item4 = new ItemMenu("财务", menuFinancial, PackIconKind.ScaleBalance);

            Menu.Children.Add(new UserControlMenuItem(item6, this));
            Menu.Children.Add(new UserControlMenuItem(item1, this));
            Menu.Children.Add(new UserControlMenuItem(item2, this));
            Menu.Children.Add(new UserControlMenuItem(item3, this));
            Menu.Children.Add(new UserControlMenuItem(item4, this));


        }

        internal void SwitchScreen(object sender)
        {
            var screen = ((UserControl)sender);

            if (screen != null)
            {
                StackPanelMain.Children.Clear();
                StackPanelMain.Children.Add(screen);
            }
        }


        private void Button_Click(object sender, RoutedEventArgs e)
        {
            if (MenuClosed)
            {
                Storyboard openMenu = (Storyboard)button.FindResource("OpenMenu");
                openMenu.Begin();
            }
            else
            {
                Storyboard closeMenu = (Storyboard)button.FindResource("CloseMenu");
                closeMenu.Begin();
            }

            MenuClosed = !MenuClosed;
        }


        public void ShowCurTimer(object sender, EventArgs e)

        {

            ShowTime();

        }

        //ShowTime方法

        private void ShowTime()
        {
            //获得年月日
            this.tbDateText.Text = DateTime.Now.ToString("yyyy.MM.dd");   //yyyy/MM/dd
            //获得时分秒
            this.tbTimeText.Text = DateTime.Now.ToString("HH:mm:ss");
            //获取星期几
            //this.Tt.Text = DateTime.Now.ToString("dddd", new System.Globalization.CultureInfo("zh-cn"));

            //this.Tt.Text += " ";

        }

   
    }
}

app.xaml

<ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <materialDesign:BundledTheme BaseTheme="Light" PrimaryColor="DeepPurple" SecondaryColor="Lime" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.Blue.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Indigo.xaml" />



            </ResourceDictionary.MergedDictionaries>

UserControlMenuItem.xaml

<UserControl x:Class="MyToDo.Views.UserControlMenuItem"
             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:MyToDo.Views"
             xmlns:converter="clr-namespace:MyToDo.Convert"
             xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <Grid>
        <materialDesign:PackIcon Kind="{Binding Icon}" Width="15" Height="15" Margin="10 16" Foreground="White"/>
        <ListBoxItem x:Name="ListViewItemMenu" Content="{Binding Header}" Padding="27 14" FontSize="15" Foreground="White"/>
        <Expander x:Name="ExpanderMenu" Header="{Binding Header}" IsExpanded="False" Width="210" HorizontalAlignment="Right" Background="{x:Null}" Foreground="White">
            <ListView x:Name="ListViewMenu" ItemsSource="{Binding SubItems}" Foreground="White" ScrollViewer.HorizontalScrollBarVisibility="Disabled" SelectionChanged="ListViewMenu_SelectionChanged">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Name}" Padding="20 5"/>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </Expander>



    </Grid>

</UserControl>

UserControlMenuItem.xaml.cs

using GalaSoft.MvvmLight.Messaging;
using MyToDo.common.Models;
using MyToDo.Views;
using System;
using System.Collections.Generic;
using System.Linq;
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.Navigation;
using System.Windows.Shapes;

namespace MyToDo.Views
{
    /// <summary>
    /// UserControlMenuItem.xaml 的交互逻辑
    /// </summary>
    public partial class UserControlMenuItem : UserControl
    {

        MainView _context;
        public UserControlMenuItem(ItemMenu itemMenu, MainView context)
        {
            InitializeComponent();

            _context = context;

            ExpanderMenu.Visibility = itemMenu.SubItems == null ? Visibility.Collapsed : Visibility.Visible;
            ListViewItemMenu.Visibility = itemMenu.SubItems == null ? Visibility.Visible : Visibility.Collapsed;

            this.DataContext = itemMenu;
        }

        private void ListViewMenu_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            _context.SwitchScreen(((SubItem)((ListView)sender).SelectedItem).Screen);
        }

    }
}

补充：

要实现默认运行的界面
在xaml.cs里面主函数里加上
var moren = ((UserControl)new MainWindows());
StackPanelMain.Children.Add(moren);
这个MainWindows就是我的首页页面了

需要解决的问题

有些view页面添加了参数，如果要调用必须传入参数，没办法规避
但是加个对应变量再加上对应参数就会导致运行特别缓慢
应该就是白白识别了这个参数发现啥也没有就浪费了很多很多时间