鼠标悬停在重叠的控件模板元素上

时间:2015-05-25 11:44:42

标签: wpf xaml mouseover

我正在尝试创建一个控件模板,在其上显示几何图形(Path)和一些关节(椭圆)。我需要在鼠标悬停在图形上时突出显示图形和关节,并突出显示图形并使关节更大,并在鼠标悬停在关节上时更改颜色。

问题是,当鼠标位于关节内部路径上时,鼠标不在路径上。怎么解决?

<ControlTemplate x:Key="ctConnector">
    <Canvas>
        <Path x:Name="ConnectorPath" Data="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=PathData}" Fill="White">
            <Path.Style>
                <Style TargetType="Path">
                    <Setter Property="StrokeThickness" Value="1" />
                    <Setter Property="Stroke" Value="{StaticResource PathNormalBrush}" />
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Stroke" Value="{StaticResource PathMouseOverBrush}" />
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </Path.Style>
        </Path>
        <ItemsControl x:Name="ConnectorJoints" ItemsSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Joints}">
            <ItemsControl.Style>
                <Style TargetType="ItemsControl">
                    <Setter Property="Visibility" Value="Hidden" />
                </Style>
            </ItemsControl.Style>
            <ItemsControl.ItemContainerStyle>
                <Style TargetType="FrameworkElement">
                    <Setter Property="Canvas.Left" Value="{Binding Left, Converter={x:Static local:CoordConverter.Instance}, ConverterParameter=X}" />
                    <Setter Property="Canvas.Top" Value="{Binding Top, Converter={x:Static local:CoordConverter.Instance}, ConverterParameter=Y}" />
                </Style>
            </ItemsControl.ItemContainerStyle>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas IsItemsHost="True" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Ellipse>
                        <Ellipse.Style>
                            <Style TargetType="Ellipse">
                                <Setter Property="Width" Value="3" />
                                <Setter Property="Height" Value="3" />
                                <Setter Property="Margin" Value="-1.5,-1.5" />
                                <Setter Property="Fill" Value="{StaticResource PathMouseOverBrush}" />
                                <Style.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter Property="Width" Value="7" />
                                        <Setter Property="Height" Value="7" />
                                        <Setter Property="Margin" Value="-3.5,-3.5" />
                                        <Setter Property="Fill" Value="{StaticResource JointMouseOverBrush}" />
                                    </Trigger>
                                </Style.Triggers>
                            </Style>
                        </Ellipse.Style>
                    </Ellipse>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Canvas>
    <ControlTemplate.Triggers>
        <Trigger SourceName="ConnectorPath" Property="IsMouseOver" Value="True">
            <Setter TargetName="ConnectorJoints" Property="Visibility" Value="Visible" />
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

0 个答案:

没有答案