GeekDesk/Control/UserControls/PannelCard/LeftCardControl.xaml

<UserControl x:Class="GeekDesk.Control.UserControls.PannelCard.LeftCardControl"
             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:GeekDesk.Control.UserControls.PannelCard"
             xmlns:hc="https://handyorg.github.io/handycontrol"
             xmlns:cvt="clr-namespace:GeekDesk.Converts"
             xmlns:DraggAnimatedPanel="clr-namespace:DraggAnimatedPanel"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <UserControl.Resources>

        <!--左侧栏样式动画-->
        <Style x:Key="MenuStyle" TargetType="ListBoxItem" BasedOn="{StaticResource ListBoxItemBaseStyle}">
            <Setter Property="FontSize" Value="15"/>
            <Setter Property="Margin" Value="0,0,0,1"/>
            <Setter Property="Background">
                <Setter.Value>
                    <SolidColorBrush Opacity="0"/>
                </Setter.Value>
            </Setter>

            <Style.Triggers>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsMouseOver" Value="False"/>
                        <Condition Property="IsSelected" Value="False"/>
                    </MultiTrigger.Conditions>
                    <MultiTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation To="15" Duration="0:0:0.5" Storyboard.TargetProperty="FontSize"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiTrigger.EnterActions>
                    <MultiTrigger.ExitActions>
                        <BeginStoryboard>
                            <Storyboard Timeline.DesiredFrameRate="60">
                                <DoubleAnimation To="18" Duration="0:0:0.001" Storyboard.TargetProperty="FontSize"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiTrigger.ExitActions>
                </MultiTrigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="#FFE4DBDB"/>
                </Trigger>
                <Trigger Property="IsSelected" Value="true">
                    <Setter Property="Background" Value="#FFECECEC"/>
                    <Setter Property="Foreground" Value="Black"/>
                </Trigger>
            </Style.Triggers>
        </Style>
        <cvt:MenuWidthConvert x:Key="MenuWidthConvert"/>
        <cvt:OpcityConvert x:Key="OpcityConvert"/>
    </UserControl.Resources>
        <!--左侧栏-->
        <hc:Card 
                 BorderThickness="1" 
                 Effect="{DynamicResource EffectShadow2}" 
                 Margin="5,0,0,5"
                 >
            <hc:Card.Background>
                <SolidColorBrush Color="#FFFFFFFF" Opacity="{Binding AppConfig.CardOpacity, Mode=TwoWay, Converter={StaticResource OpcityConvert}}"/>
            </hc:Card.Background>
            <hc:Card.BorderBrush>
                <SolidColorBrush Color="#FFFFFFFF" Opacity="0"/>
            </hc:Card.BorderBrush>
            <hc:Card.ContextMenu>
                <ContextMenu Width="200">
                    <MenuItem Header="新建菜单" Click="CreateMenu"/>
                </ContextMenu>
            </hc:Card.ContextMenu>
            <WrapPanel Orientation="Horizontal">
                <ListBox x:Name="menus"
                         ItemsSource="{Binding MenuList}"
                         Tag="{Binding AppConfig.MenuCardWidth}"
                         BorderThickness="0" Foreground="{x:Null}"
                         SelectedIndex="{Binding AppConfig.SelectedMenuIndex}"
                         VirtualizingPanel.VirtualizationMode="Recycling"
                         >
                    <ListBox.Resources>
                        <ContextMenu x:Key="menuDialog" Width="200">
                            <MenuItem Header="新建菜单" Click="CreateMenu"/>
                            <MenuItem Header="重命名"  Click="RenameMenu" Tag="{Binding}"/>
                            <MenuItem Header="修改图标"  Click="EditMenuGeometry" Tag="{Binding}"/>
                            <MenuItem Header="删除" Click="DeleteMenu" Tag="{Binding}"/>
                    </ContextMenu>
                    </ListBox.Resources>

                    <ListBox.ItemContainerStyle>
                        <Style TargetType="ListBoxItem" BasedOn="{StaticResource MenuStyle}">
                            <Setter Property="ContextMenu" Value="{StaticResource menuDialog}"/>
                        </Style>
                    </ListBox.ItemContainerStyle>
                    <ListBox.Background>
                        <SolidColorBrush Color="AliceBlue" Opacity="0"/>
                    </ListBox.Background>

                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                        <DraggAnimatedPanel:DraggAnimatedPanel ItemsHeight="30" ItemsWidth="{Binding RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type ListBox},AncestorLevel=1},Path=Tag, Mode=TwoWay, Converter={StaticResource MenuWidthConvert}}"   HorizontalAlignment="Center" VerticalAlignment="Top" SwapCommand="{Binding SwapCommand, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}"/>
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>

                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel MouseLeftButtonDown="MenuClick" Tag="{Binding}">
                                <hc:TextBox Text="{Binding Path=MenuName, Mode=TwoWay}"
                                     HorizontalAlignment="Left"
                                     Width="{Binding RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type ListBox},AncestorLevel=1},Path=Tag, Mode=TwoWay, Converter={StaticResource MenuWidthConvert}}"
                                     FontSize="15"
                                     TextAlignment="Left"
                                     LostFocus="LostFocusOrEnterDown"
                                     KeyDown="LostFocusOrEnterDown"
                                     Tag="{Binding}"
                                     IsVisibleChanged="MenuEditWhenVisibilityChanged"
                                     Visibility="{Binding MenuEdit}"/>
                                <StackPanel Orientation="Horizontal">
                                    <!--<Button Background="Transparent" 
                                        BorderThickness="0"
                                        hc:IconElement.Geometry="{StaticResource test}" 
                                        hc:IconElement.Height="18"
                                        hc:IconElement.Width="18"
                                        />-->
                                <!--<Button Background="Transparent" BorderThickness="0" Height="10" Width="10">
                                    <Canvas>
                                        <Path Fill="#92E3C3" Data="M391.68 957.44h-66.56v-158.4128H66.56v-66.56h258.56v-174.08H66.56v-66.56h258.56V307.2h66.56l-0.0512 184.6272h240.6912V307.2h66.56l-0.0512 184.6272H957.44v307.2h-258.6112V957.44h-66.4576l-0.0512-158.4128H391.6288V957.44z m-0.0512-224.9728h240.6912v-174.08H391.6288v174.08z m565.8112-174.08h-258.6112v174.08H957.44v-174.08z"/>
                                        <Path Fill="#5D7092" Data="M51.2 51.2h921.6v256H51.2z"/>
                                        <Path Fill="#5D7092" Data="M921.6 0a102.4 102.4 0 0 1 102.4 102.4v819.2a102.4 102.4 0 0 1-102.4 102.4H102.4a102.4 102.4 0 0 1-102.4-102.4V102.4a102.4 102.4 0 0 1 102.4-102.4h819.2z m0 66.56H102.4a35.84 35.84 0 0 0-35.5328 30.976L66.56 102.4v819.2a35.84 35.84 0 0 0 30.976 35.5328L102.4 957.44h819.2a35.84 35.84 0 0 0 35.5328-30.976L957.44 921.6V102.4a35.84 35.84 0 0 0-30.976-35.5328L921.6 66.56z"/>
                                    </Canvas>
                                </Button>-->
                                <!--<TextBlock Text="&#xe606;" Style="{StaticResource MyIcon}"/>-->
                                <TextBlock Text="&#xe614;" FontFamily="/#IconFont" FontSize="40"/>
                                <TextBlock Text="{Binding MenuName}"
                                           VerticalAlignment="Center"
                                           IsVisibleChanged="MenuWhenVisibilityChanged"
                                           Visibility="{Binding NotMenuEdit}"
                                           />
                                </StackPanel>
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </WrapPanel>
        </hc:Card>
</UserControl>