WPF TabItem OnMouseOver는 TabItem 내의 Button 가시성을 트리거합니다.

Question

TabItem이 포함 된 TabControl이 있습니다. 나는 포함하는 자신의 ItemTemplate을을 덮어 :

• TextBlock의가 TabItem의
• 버튼 (X)의 캡션을 보여주는

지금 나는 "X"를하고 싶습니다 탭을 종료하는 - 버튼은 TabItem이 선택되거나 마우스가 위에있을 때만 표시됩니다. 이것은 지금까지 내 XAML 코드

... 그것은 종류의 작동 DataTemplate을 내부 트리거와

<TabControl x:Name="tabControl" 
        ItemsSource="{Binding OpenedItems}"> 
      <TabControl.ItemTemplate> 
       <DataTemplate> 
        <Grid Name="grid" VerticalAlignment="Center"> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="*" /> 
          <ColumnDefinition Width="Auto" /> 
         </Grid.ColumnDefinitions> 
         <TextBlock Text="{Binding TabCaption}" 
            Grid.Column="0" 
            Foreground="White" 
            HorizontalAlignment="Left" 
            Margin="3" 
            Name="label_TabTitle" 
            VerticalAlignment="Center" /> 
         <Button Content="X" 
           Grid.Column="1" 
           Foreground="White" 
           HorizontalAlignment="Right" 
           Margin="3" 
           Name="button_close" 
           VerticalAlignment="Center" 
           Width="20" 
           Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}" 
           Visibility="Hidden" 
           Click="button_close_Click_1"> 
         </Button> 
        </Grid> 

        <DataTemplate.Triggers> 
         <Trigger Property="IsMouseOver" Value="True" > 
          <Setter TargetName="button_close" Property="Visibility" Value="Visible"/> 
         </Trigger> 
        </DataTemplate.Triggers> 
       </DataTemplate> 
      </TabControl.ItemTemplate> 
      <TabControl.ItemContainerStyle> 
       <Style TargetType="TabItem"> 
        <Setter Property="Background" Value="#1C1C1C" /> 
        <Setter Property="Content" Value="{Binding TabContentView}"/> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type TabItem}"> 
           <Grid Name="Grid" 
           Background="{StaticResource GrayBrush}"> 
            <ContentPresenter x:Name="ContentSite" 
                VerticalAlignment="Center" 
                HorizontalAlignment="Center" 
                ContentSource="Header" 
                RecognizesAccessKey="True"> 
            </ContentPresenter> 
           </Grid> 
           <ControlTemplate.Triggers> 
            <Trigger Property="IsSelected" Value="True"> 
             <Setter TargetName="Grid" Property="Background" Value="{StaticResource BlueBrush}" /> 
            </Trigger> 
            <Trigger Property="IsMouseOver" Value="True"> 
             <Setter TargetName="Grid" Property="Background" Value="{StaticResource LightBlueBrush}" /> 
            </Trigger> 
           </ControlTemplate.Triggers> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </TabControl.ItemContainerStyle> 
     </TabControl> 

..하지만 : 당신은을 보여주기 위해 레이블 바로 위에 마우스를 올려해야 단추. 기본적으로 버튼이 다시 사라 지므로 버튼을 클릭 할 수 없습니다.

이 WPF 템플릿에 대한 도움을 주시면 감사하겠습니다.

덕분에, 기독교

Answer 1

당신의 TabItem의이 배경이 그래서는 MouseOverEvent 잡기되지 않는 설정이없는 것처럼 그것은 보인다. TextBlock에는 전경 집합과 텍스트가 있으므로 MouseOverEvent를 캡처합니다. Background 하위 그리드를 DataTemplate으로 설정하고 Transparent으로 설정하면 MouseOverEvent이 감지되어 닫기 버튼이 표시됩니다.

<TabControl x:Name="tabControl" ItemsSource="{Binding OpenedItems}"> 
    <TabControl.ItemTemplate> 
     <DataTemplate> 
      <Grid Name="grid" VerticalAlignment="Center" Background="Transparent"> 
       ... 
      </Grid> 
      ... 
     </DataTemplate> 
    </TabControl.ItemTemplate> 
    ... 
</TabControl> 

Answer 2

당신은 불투명 대신 작동 가시성을 설정합니다. 공개 설정에 대한 참조가 모두 불투명으로 변경되었습니다.

내 코드 편집을 확인하고 싶을 수 있습니다. 100 % 확신하지 못했지만, 당신이 가지고있는 것의 복제본이지만 그 아이디어는 효과가 있습니다. 왜? 확실하지 않다. :) 숨겨진 버튼이 MouseEnter 이벤트를 삼키는 것 같지만 숨겨져 있기 때문에 전달하지 않습니다.

<TabControl x:Name="tabControl" 
        ItemsSource="{Binding OpenedItems}"> 
      <TabControl.ItemTemplate> 
       <DataTemplate> 
        <Grid Name="grid" VerticalAlignment="Center"> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="*" /> 
          <ColumnDefinition Width="Auto" /> 
         </Grid.ColumnDefinitions> 
         <TextBlock Text="{Binding TabCaption}" 
            Grid.Column="0" 
            Foreground="White" 
            HorizontalAlignment="Left" 
            Margin="3" 
            Name="label_TabTitle" 
            VerticalAlignment="Center" /> 
         <Button Content="X" 
           Grid.Column="1" 
           Foreground="White" 
           HorizontalAlignment="Right" 
           Margin="3" 
           Name="button_close" 
           VerticalAlignment="Center" 
           Width="20" 
           Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}" 
           Opacity="0" 
           Click="button_close_Click_1"> 
         </Button> 
        </Grid> 

        <DataTemplate.Triggers> 
         <Trigger Property="IsMouseOver" Value="True" > 
          <Setter TargetName="button_close" Property="Opacity" Value="1"/> 
         </Trigger> 
        </DataTemplate.Triggers> 
       </DataTemplate> 
      </TabControl.ItemTemplate> 
      <TabControl.ItemContainerStyle> 
       <Style TargetType="TabItem"> 
        <Setter Property="Background" Value="#1C1C1C" /> 
        <Setter Property="Content" Value="{Binding TabContentView}"/> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type TabItem}"> 
           <Grid Name="Grid" 
           Background="{StaticResource GrayBrush}"> 
            <ContentPresenter x:Name="ContentSite" 
                VerticalAlignment="Center" 
                HorizontalAlignment="Center" 
                ContentSource="Header" 
                RecognizesAccessKey="True"> 
            </ContentPresenter> 
           </Grid> 
           <ControlTemplate.Triggers> 
            <Trigger Property="IsSelected" Value="True"> 
             <Setter TargetName="Grid" Property="Background" Value="{StaticResource BlueBrush}" /> 
            </Trigger> 
            <Trigger Property="IsMouseOver" Value="True"> 
             <Setter TargetName="Grid" Property="Background" Value="{StaticResource LightBlueBrush}" /> 
            </Trigger> 
           </ControlTemplate.Triggers> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </TabControl.ItemContainerStyle> 
     </TabControl>