Datagrid鼠標懸停標題圖像重疊

當鼠標懸停在列標題上時，我有圖像顯示。但是，imp事情是它應該顯示在columnheader區域下面。 enter image description here Datagrid鼠標懸停標題圖像重疊

我能夠創建，但它的重疊與下面的單元格。這是圖像。 enter image description here

這裏是我的代碼：

<Style TargetType="{x:Type DataGridColumnHeader}"> 
      <Setter Property="HorizontalContentAlignment" Value="Center" /> 
      <Setter Property="Height" Value="26" /> 
      <Setter Property="Width" Value="126" /> 
      <Setter Property="Foreground" Value="{DynamicResource ContrastWhiteBrush}" /> 
      <Setter Property="Background" Value="{DynamicResource ContentToGreyedOutBrush}" /> 
      <Setter Property="Template" Value="{StaticResource ColumnHeaderControlTemplate}" /> 
      <Style.Triggers> 
       <Trigger Property="IsMouseOver" Value="True"> 
        <Setter Property="Background" Value="{DynamicResource GridHeaderMouseOverBrush}" /> 
       </Trigger> 
       <Trigger Property="prism:DataGridProperties.IsMouseOverGridCellColumnHeader" Value="True"> 
        <Setter Property="Background" Value="{DynamicResource GridHeaderMouseOverBrush}" /> 
       </Trigger> 
      </Style.Triggers> 

    <ControlTemplate x:Key="ColumnHeaderControlTemplate" TargetType="{x:Type DataGridColumnHeader}" > 
    <AdornerDecorator> 
     <Grid Background="{TemplateBinding Background}" x:Name="dgColumnHeader" Panel.ZIndex="10001"> 
      <ad:Interaction.Behaviors> 
       <GridColumnHeaderControl:GridAdornerBehavior AdornerTemplate="{StaticResource AdornerDataTemplate}" Panel.ZIndex="19999"> 
        <ad:Interaction.Triggers> 
         <ad:EventTrigger SourceName="dgColumnHeader" EventName="MouseEnter"> 
          <ad:InvokeCommandAction CommandName="ShowAdornerCommand"/> 
         </ad:EventTrigger> 
         <ad:EventTrigger SourceName="dgColumnHeader" EventName="MouseLeave"> 
          <ad:InvokeCommandAction CommandName="HideAdornerCommand"/> 
         </ad:EventTrigger> 
        </ad:Interaction.Triggers> 
       </GridColumnHeaderControl:GridAdornerBehavior> 
      </ad:Interaction.Behaviors> 
      <Border x:Name="border" BorderBrush="Black" BorderThickness="0,0,1,1" Grid.ColumnSpan="1"> 
       <Rectangle Width="116" Margin="3,3,3,3" HorizontalAlignment="Center" RadiusX="7" RadiusY="7" x:Name="PART_Rectangle" Fill="{DynamicResource ContentOutofFocusBrush}"></Rectangle> 
      </Border> 
      <ContentPresenter x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center" Content="{TemplateBinding Content}" /> 
     </Grid> 
    </AdornerDecorator> 
    <ControlTemplate.Triggers> 
     <Trigger Property="IsMouseOver" Value="True"> 
      <Setter TargetName="PART_Rectangle" Property="Fill" Value="{DynamicResource ActiveItemBrush}" /> 
     </Trigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate> 

    <DataTemplate x:Key="AdornerDataTemplate"> 
    <Grid HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,13,0,0" Grid.ZIndex="99"> 
     <Button Content="X" Width="28" Height="26" Panel.ZIndex="10002" Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ctrls:RhinoDataGrid}}, Path=RemoveSelectedColumnCommand}"> 
      <Button.Style> 
       <Style TargetType="{x:Type Button}"> 
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/> 
        <Setter Property="Foreground" Value="Red"/> 
        <Setter Property="Background" Value="{DynamicResource GridHeaderMouseOverBrush}"/> 
        <Setter Property="HorizontalContentAlignment" Value="Center"/> 
        <Setter Property="VerticalContentAlignment" Value="Center"/> 
        <Setter Property="FontWeight" Value="Heavy"></Setter> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type Button}"> 
           <Grid> 
            <Border Background="{TemplateBinding Background}" CornerRadius="0,0,12,12" BorderThickness="1,0,1,1" BorderBrush="Black"> 
             <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                  Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True"/> 
            </Border> 
           </Grid> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </Button.Style> 
     </Button> 
    </Grid> 
</DataTemplate>

一些如何我的rowHeader工作。我的行標題寬度爲36，關閉按鈕寬度爲28，左邊距爲26.以及一些圖像如何與單元格不重疊 enter image description here

請幫我解決。感謝迪

來源

2012-05-01 Dee Choksi

也許問題在於你定義了一個Adorner裝飾器作爲ColumnHeaderControlTemplate的一部分。您是否嘗試從ControlTemplate中刪除AdornerDecorator，並將DataGrid元素放入一個AdornerDecorator中？ – roberther

頭的高度是26

<Setter Property="Height" Value="26" />

你怎麼能指望它來顯示其高度> 26的圖像？

來源

2012-05-01 13:19:24 Paparazzi

我不想增加標題的高度，但我想採取像佔位符，這應該是透明的，並給高度> 26. 一些如何我的行標題關閉按鈕與類似的代碼工作。我將行標題的圖像附加到我的問題上。 –

有趣和令人費解。 – Paparazzi

爲了顯示其他控件頂部的「關閉」按鈕，您必須添加「彈出」控件並添加「關閉」按鈕作爲其子控件。您可以定義最多一個孩子，可以是任何UIElement。您應該爲DatagridColumnHeader的鼠標懸停事件定義事件觸發器，並設置彈出控件的「IsOpen = true」。例如

<Popup Name="myPopup"> 
    <TextBlock Name="myPopupText" 
      Background="LightBlue" 
      Foreground="Blue"> 
    Popup Text 
    </TextBlock> 
</Popup>

您還可以設置以下屬性以獲得預期結果。

AllowsTransparency="True" 
     Placement="Relative" 
      PlacementTarget="{Binding ElementName=Border}" /* your control name */ 
      HorizontalOffset="0" 
      VerticalOffset="60" 
      PopupAnimation="Fade"

來源

2012-05-02 20:16:43

Datagrid鼠標懸停標題圖像重疊

回答

相關問題