ShrlAlgoToolkit/Melskin/Controls/Anchor.xaml

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="clr-namespace:Melskin.Controls"
    xmlns:decorations="clr-namespace:Melskin.Controls.Decorations">
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="/Melskin;Component/Themes/Animations.xaml" />
    </ResourceDictionary.MergedDictionaries>
    <!--  ListBoxItem 的样式保持不变，因为我们内部还是用 ListBox 来显示锚点  -->
    <Style x:Key="SlotAnchorItemStyle" TargetType="{x:Type ListBoxItem}">
        <Setter Property="Foreground" Value="{DynamicResource TextPrimaryBrush}" />
        <Setter Property="Background" Value="{DynamicResource ControlBackgroundNormalBrush}" />
        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
        <Setter Property="Height" Value="40" />
        <Setter Property="HorizontalAlignment" Value="Stretch" />
        <!-- <Setter Property="Margin" Value="15" /> -->
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListBoxItem}">
                    <Grid>
                        <decorations:SlotBorder
                            x:Name="slot"
                            Margin="-4"
                            HorizontalAlignment="Stretch"
                            ClipToBounds="True"
                            Intensity="0"
                            ShaderEnabled="False">
                            <ContentPresenter
                                x:Name="content"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                TextElement.FontWeight="Normal"
                                TextElement.Foreground="{DynamicResource TextPrimaryBrush}" />
                        </decorations:SlotBorder>

                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="content" Property="TextElement.Foreground" Value="{DynamicResource PrimaryFocusedBrush}" />
                            <Setter TargetName="slot" Property="Intensity" Value="0.15" />
                            <Setter TargetName="slot" Property="ShaderEnabled" Value="True" />
                        </Trigger>
                        <Trigger Property="IsSelected" Value="True">
                            <!-- <Setter TargetName="ConvexShadow" Property="Background" Value="Transparent" /> -->
                            <Setter TargetName="slot" Property="Intensity" Value="0.6" />
                            <Setter TargetName="slot" Property="ShaderEnabled" Value="True" />
                            <Setter TargetName="content" Property="TextElement.FontWeight" Value="Bold" />
                            <Setter TargetName="content" Property="TextElement.Foreground" Value="{DynamicResource PrimaryGradientBrush}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <!--  Anchor样式和模板  -->
    <Style x:Key="EmbossAnchorStyle" TargetType="{x:Type controls:Anchor}">
        <Setter Property="Foreground" Value="{DynamicResource TextPrimaryBrush}" />
        <Setter Property="Background" Value="{DynamicResource BackgroundLayoutBrush}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type controls:Anchor}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="200" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <!--  左侧: 锚点列表  -->
                        <decorations:EmbossBorder
                            HorizontalAlignment="Stretch"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            ClipToBounds="True"
                            Intensity="0">
                            <ListBox
                                x:Name="PART_AnchorList"
                                Background="Transparent"
                                BorderThickness="0"
                                ItemContainerStyle="{StaticResource EmbossAnchorStyle}"
                                ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
                        </decorations:EmbossBorder>

                        <!--  右侧: 内容滚动区  -->
                        <ScrollViewer
                            x:Name="PART_ContentScroller"
                            Grid.Column="1"
                            VerticalScrollBarVisibility="Auto">
                            <!--  ContentPresenter 会将 Anchor 的 Content 放置在这里  -->
                            <ContentPresenter />
                        </ScrollViewer>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="FlatAnchorItemStyle" TargetType="{x:Type ListBoxItem}">
        <Setter Property="Foreground" Value="{DynamicResource TextPrimaryBrush}" />
        <Setter Property="Background" Value="{DynamicResource ControlBackgroundNormalBrush}" />
        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
        <Setter Property="Height" Value="40" />
        <Setter Property="HorizontalContentAlignment" Value="Left" />
        <Setter Property="HorizontalAlignment" Value="Stretch" />
        <!-- <Setter Property="Margin" Value="15" /> -->
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListBoxItem}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="12" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>
                        <Border
                            x:Name="Indicator"
                            Width="4"
                            Margin="2,4"
                            HorizontalAlignment="Left"
                            Background="{DynamicResource PrimaryNormalBrush}"
                            CornerRadius="2"
                            RenderTransformOrigin="0.5, 0.5">
                            <Border.RenderTransform>
                                <ScaleTransform ScaleY="0" />
                            </Border.RenderTransform>
                        </Border>
                        <Border
                            Grid.Column="1"
                            HorizontalAlignment="Stretch"
                            ClipToBounds="True">
                            <ContentPresenter
                                x:Name="ContentPresenter"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="Center"
                                TextElement.FontWeight="Normal"
                                TextElement.Foreground="{DynamicResource TextPrimaryBrush}" />
                        </Border>

                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="ContentPresenter" Property="TextElement.Foreground" Value="{DynamicResource PrimaryFocusedBrush}" />
                            <!--<Setter Property="Background" Value="{DynamicResource }" />-->
                        </Trigger>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter TargetName="Indicator" Property="Visibility" Value="Visible" />
                            <Setter TargetName="ContentPresenter" Property="TextElement.FontWeight" Value="Bold" />
                            <Setter TargetName="ContentPresenter" Property="TextElement.Foreground" Value="{DynamicResource PrimaryNormalBrush}" />
                            <Trigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource ExtendYAnimation}" />
                            </Trigger.EnterActions>

                            <Trigger.ExitActions>
                                <BeginStoryboard Storyboard="{StaticResource ShrinkYAnimation}" />
                            </Trigger.ExitActions>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <!--  Anchor样式和模板  -->
    <Style TargetType="{x:Type controls:Anchor}">
        <Setter Property="BorderBrush" Value="{DynamicResource BorderNormalBrush}" />
        <Setter Property="Foreground" Value="{DynamicResource TextPrimaryBrush}" />
        <Setter Property="Background" Value="{DynamicResource BackgroundLayoutBrush}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type controls:Anchor}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="200" />
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <!--  左侧: 锚点列表  -->
                        <Border
                            HorizontalAlignment="Stretch"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            ClipToBounds="True">
                            <ListBox
                                x:Name="PART_AnchorList"
                                Background="Transparent"
                                BorderThickness="0"
                                ItemContainerStyle="{StaticResource FlatAnchorItemStyle}"
                                ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
                        </Border>
                        <Rectangle
                            x:Name="Separator"
                            Grid.Column="1"
                            Width="2"
                            Margin="4,0"
                            VerticalAlignment="Stretch"
                            Fill="{TemplateBinding BorderBrush}" />
                        <!--  右侧: 内容滚动区  -->
                        <ScrollViewer
                            x:Name="PART_ContentScroller"
                            Grid.Column="2"
                            VerticalScrollBarVisibility="Auto">
                            <!--  ContentPresenter 会将 Anchor 的 Content 放置在这里  -->
                            <ContentPresenter />
                        </ScrollViewer>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>