2010-01-05 3 views
1

ListBox, Canvas 및 Thumb을 함께 사용하려면 어떻게합니까?ListBox, Canvas 및 Thumb을 함께 사용하려면 어떻게합니까?

나는 드래그 가능한 엄지 손가락을 포함하는 캔버스와 함께 ListBox의 선택 로직을 재사용하려고합니다.

Thumb이 마우스 이벤트를 처리하여 Thumb을 클릭해도 항목이 선택되지 않는 것처럼 보입니다.

절차형 코드의 대안을 사용하지 않고도 이러한 요소를 함께 사용할 수 있기를 기대했습니다. 이것이 가능한지 또는 어떻게해야하는지 아는 사람이라면 저에게 조언하십시오.

코드 예제가 이어집니다. XAML에서

나는이 목록 상자를 정의하고 ItemsPanel로 캔버스 지정, 내가 드래그 엄지 손가락을 만들로드 이벤트 핸들러에서

<Window x:Class="ListBoxCanvasThumb.Window1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Window1" Height="300" Width="300" 
    Loaded="Window_Loaded" 
    > 
    <Grid> 
     <ListBox 
      x:Name="listBox" 
      > 
      <ListBox.ItemsPanel> 
       <ItemsPanelTemplate>     
        <Canvas /> 
       </ItemsPanelTemplate> 
      </ListBox.ItemsPanel> 
     </ListBox> 
    </Grid> 
</Window> 

을 ListBoxItem의에 포장, 캔버스에 높은 게재 순위를 설정하고 다음 목록 상자에 추가 :

private void Window_Loaded(object sender, RoutedEventArgs e) 
{ 
    Thumb t = new Thumb(); 
    t.Width = 10; 
    t.Height = 10; 
    t.DragDelta += new DragDeltaEventHandler(thumb_DragDelta); 

    ListBoxItem i = new ListBoxItem(); 
    Canvas.SetLeft(i, 10); 
    Canvas.SetTop(i, 10); 
    i.Content = t; 

    listBox.Items.Add(i); 
} 

을 DragDelta 이벤트 처리기에서 나는 캔버스에 항목의 위치 업데이트 :

void thumb_DragDelta(object sender, DragDeltaEventArgs e) 
{ 
    ListBoxItem i = (ListBoxItem)((Thumb)sender).Parent; 
    Canvas.SetLeft(i, Canvas.GetLeft(i) + e.HorizontalChange); 
    Canvas.SetTop(i, Canvas.GetTop(i) + e.VerticalChange); 
} 

답변

3

Thumb 컨트롤의 사용은 정말 많이 당신에게 모든 것을 구입하지 않고, 당신이 무엇에 여러 가지 방법으로 충돌 하려고하는 것. 나는 그것을 없애 버릴 것이다.

그냥 아래로 마우스, 마우스 이동을 차단하여 Thumb없이 드래그 항목을 만들기 위해 매우 간단하고, 마우스 업 이벤트 : 마우스 왼쪽 버튼을 누른 상태에서

  • 는 "드래그"플래그를 설정, 현재주의 위치 및 캡처 마우스
  • "끌기"가 true이면 컨트롤의 마우스 위치와 원래 위치의 차이로 인해 Canvas.Left 및 Canvas.Top을 업데이트하십시오.
  • 마우스가 올라간 상태에서 "끌기"플래그 및 마우스 캡처 지우기

이렇게하면 Thumb은 키보드 및 마우스 클릭을 가로 채고 ListBox을 어지럽히 지 않습니다.

+0

이것은 나를 위해 작동하지 않습니다. 여전히 클릭을 삼켜 서 목록 상자가 선택되지 않습니다. 당신이 @AshleyDavis 그것을 고칠 수 있었습니까? – Carlo

1

내가 그 절차 적 코드를 사용하지 귀하의 요구 사항을 만족시킬 경우,

어쨌든 (? 또는이 단지 재생 예를했다) 분명히 당신이 이미 있기 때문에, 알고 PreviewMouseDownListBoxItem에 처리기를 추가하지 않고 해당 항목을 선택하십시오.

+0

답장을 보내 주셔서 감사합니다. 그러나 이것은 기본적으로 제가 이미하고있는 방식입니다. 문제는 내가 이것보다 더 많이하고 싶다는 것이다. 예를 들어 다중 선택 및 키보드 입력 (왼쪽 및 오른쪽 키를 사용하여 선택을 변경)을 구현하면 훨씬 많은 절차 코드가 생성됩니다. 나는 그 일을하기 시작했지만, 더 나은 방법이 있어야한다고 생각했다. –

+0

BTW 위의 Window_Loaded에서 사용한 절차 코드는 문제를 설명하기위한 것이고 실제 코드 데이터는 ItemSource에 개체 목록을 바인딩하고 DataTemplate을 사용하여 ListBox를 채 웁니다. –

1

Thumb을 ListBoxItem 템플리트로 이동하고 Thumb의 포커스 상태를 사용하여 선택을 시도해 볼 수 있습니다. 엄지 손가락은 기본적으로 초점을 맞추지 못하지만 켜기 만하면됩니다.

  <ListBox.ItemContainerStyle> 
      <Style TargetType="{x:Type ListBoxItem}"> 
       <Setter Property="Canvas.Left" Value="10" /> 
       <Setter Property="Canvas.Top" Value="10" /> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="{x:Type ListBoxItem}"> 
          <Border x:Name="Bd" ...> 
           <DockPanel> 
            <Thumb x:Name="dragger" DockPanel.Dock="Top" 
              Width="50" Height="20" Focusable="True"/> 
            <ContentPresenter/> 
           </DockPanel> 
          </Border> 
          <ControlTemplate.Triggers> 
           <Trigger SourceName="dragger" Property="IsFocused" Value="True"> 
            <Setter Property="IsSelected" Value="True" /> 
           </Trigger> 

...이를 위해

관련 문제