列表框自定义选择器边界框

本文关键字:边界 选择器 自定义 列表 | 更新日期: 2023-09-27 17:56:39

Hello Stackoverflowers,

在下面的列表框中,当我将鼠标悬停在元素上时,选择框从窗口的左上角转到元素的右下角。对于美学和列表框.项目面板中画布上的鼠标事件来说,这都是一个问题。

我想知道是否可以在内部元素的形状上制作选择框(相同的形状并从元素坐标而不是左上角开始)。

 <ListBox ItemsSource="{Binding OverlayElements}"
             SelectedItem="{Binding SelectedItem}"
             Background="Transparent">
        <ListBox.ItemContainerStyle>
            <Style TargetType="{x:Type ListBoxItem}">
                <Setter Property="IsHitTestVisible" Value="True"></Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListBoxItem}">
                            <Border Background="{TemplateBinding Background}"
                                        BorderBrush="{TemplateBinding BorderBrush}"
                                        BorderThickness="{TemplateBinding BorderThickness}"
                                        HorizontalAlignment="Center">
                                <ContentPresenter/>
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsSelected" Value="True">
                                    <Setter Property="Background" Value="#33FF0000"></Setter>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ListBox.ItemContainerStyle>
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas/>
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
        <ListBox.Resources>
            <DataTemplate DataType="{x:Type model:EllipseOverlayElement}">
                <Path Stroke="{Binding Color}" StrokeThickness="{Binding Thickness}">
                    <Path.Data>
                        <EllipseGeometry
                            Center="{Binding Center}"
                            RadiusX="{Binding RadiusX}"
                            RadiusY="{Binding RadiusY}"/>
                    </Path.Data>
                </Path>
            </DataTemplate>
            <DataTemplate DataType="{x:Type model:LineOverlayElement}">
                <Path Stroke="{Binding Color}" StrokeThickness="{Binding Thickness}">
                    <Path.Data>
                        <LineGeometry
                            StartPoint="{Binding StartPoint}"
                            EndPoint="{Binding EndPoint}"/>
                    </Path.Data>
                </Path>
            </DataTemplate>
        </ListBox.Resources>
    </ListBox>

如果我不清楚,请告诉我。

列表框自定义选择器边界框

只是一个建议 - 你确定要在 ItemsPanelTemplate 中使用 Canvas 吗?我想 Canvas 导致了这个问题。

您可以简单地使用堆栈面板垂直放置项目,并使用数据模板可以包含 Elipse 或矩形。这样,您将在密闭空间中拥有形状。

让我知道它是否有效。

谢谢,维沙尔