Listbox customize Selektors Begrenzungsbox

Question

Hallo Stackoverflowers,

Im folgende Listenfeld der Auswahlbox, wenn i Maus über ein Element aus der oberen linken Ecke des Fensters des Elements nach unten rechts geht. Dies ist ein Problem sowohl für die Ästhetik als auch für das Mausereignis im Canvas in ListBox.ItemsPanel.

Ich würde gerne wissen, ob es möglich ist, die Auswahlbox an der Form des Elements im Inneren zu machen (gleiche Form und beginnend mit den Elementkoordinaten statt oben links).

<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> 

Sag mir, wenn ich nicht klar bin.

Answer 1

Nur ein Vorschlag - Möchten Sie wirklich Canvas in Ihrer ItemsPanelTemplate verwenden? Ich nehme an, Canvas verursacht dieses Problem.

Sie können einfach ein Stackpanel verwenden, um Objekte vertikal zu positionieren und Datatemplate zu verwenden. Sie können entweder eine Elipse oder ein Rechteck enthalten. Auf diese Weise haben Sie eine Form auf engem Raum.

Lassen Sie mich wissen, ob es funktioniert.

Danke, vishal