locked
DataGrid Cell Focus RRS feed

  • Question

  • Hi,

    Is there a way not to show the Cell Focus Background color or the focus rectangle when the user clicks on a cell ?

     

    Thanks

    Tuesday, January 18, 2011 10:52 PM

Answers

  • Hi Rajeshvee,

    Yes, it can, change the template of the DataGridCell. Bleow is the default style for the DataGridCell:

     <SolidColorBrush x:Key="{x:Static DataGrid.FocusBorderBrushKey}" Color="#FF000000"/>
     <Style TargetType="{x:Type DataGridCell}">
     <Setter Property="Background" Value="Transparent"/>
     <Setter Property="BorderBrush" Value="Transparent"/>
     <Setter Property="BorderThickness" Value="1"/>
     <Setter Property="Template">
      <Setter.Value>
      <ControlTemplate TargetType="{x:Type DataGridCell}">
       <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
       <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
       </Border>
      </ControlTemplate>
      </Setter.Value>
     </Setter>
     <Style.Triggers>
      <Trigger Property="IsSelected" Value="True">
      <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
      <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
      <Setter Property="BorderBrush" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
      </Trigger>
      <Trigger Property="IsKeyboardFocusWithin" Value="True">
      <Setter Property="BorderBrush" Value="{DynamicResource {x:Static DataGrid.FocusBorderBrushKey}}"/>
      </Trigger>
     </Style.Triggers>
     </Style>
    

    We can know from the style, it uses two triggers to change the colors for IsSekcted and IsKeyboardFocusWithin properties. So we have two solutions:

    #1: Overwrite the static color in the DataGrid.Resources, such as:

     <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black"/>
     <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="White"/>
     <SolidColorBrush x:Key="{x:Static DataGrid.FocusBorderBrushKey}" Color="Transparent"/>

    #2: Remove the triggers from the style of the DataGridCell: 

     <Style TargetType="{x:Type DataGridCell}">
     <Setter Property="Background" Value="Transparent"/>
     <Setter Property="BorderBrush" Value="Transparent"/>
     <Setter Property="BorderThickness" Value="1"/>
     <Setter Property="Template">
      <Setter.Value>
       <ControlTemplate TargetType="{x:Type DataGridCell}">
        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
         <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
        </Border>
       </ControlTemplate>
      </Setter.Value>
     </Setter>
     </Style>
    

    Hope this helps.

    Sincerely,


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by Jie Bao Thursday, January 27, 2011 3:51 AM
    Wednesday, January 19, 2011 8:28 AM

All replies

  • hi this will definitely solve the border issue,

    use this

    <DataGrid>
                <DataGrid.CellStyle>
                    <Style TargetType="DataGridCell">
                        <Setter Property="BorderThickness" Value="0,0,0,0"></Setter>
                    </Style>
                </DataGrid.CellStyle>
            </DataGrid>

    Best of luck

     


    Md. Masudur Rahman
    Wednesday, January 19, 2011 7:43 AM
  • Hi Rajeshvee,

    Yes, it can, change the template of the DataGridCell. Bleow is the default style for the DataGridCell:

     <SolidColorBrush x:Key="{x:Static DataGrid.FocusBorderBrushKey}" Color="#FF000000"/>
     <Style TargetType="{x:Type DataGridCell}">
     <Setter Property="Background" Value="Transparent"/>
     <Setter Property="BorderBrush" Value="Transparent"/>
     <Setter Property="BorderThickness" Value="1"/>
     <Setter Property="Template">
      <Setter.Value>
      <ControlTemplate TargetType="{x:Type DataGridCell}">
       <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
       <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
       </Border>
      </ControlTemplate>
      </Setter.Value>
     </Setter>
     <Style.Triggers>
      <Trigger Property="IsSelected" Value="True">
      <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
      <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
      <Setter Property="BorderBrush" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
      </Trigger>
      <Trigger Property="IsKeyboardFocusWithin" Value="True">
      <Setter Property="BorderBrush" Value="{DynamicResource {x:Static DataGrid.FocusBorderBrushKey}}"/>
      </Trigger>
     </Style.Triggers>
     </Style>
    

    We can know from the style, it uses two triggers to change the colors for IsSekcted and IsKeyboardFocusWithin properties. So we have two solutions:

    #1: Overwrite the static color in the DataGrid.Resources, such as:

     <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black"/>
     <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="White"/>
     <SolidColorBrush x:Key="{x:Static DataGrid.FocusBorderBrushKey}" Color="Transparent"/>

    #2: Remove the triggers from the style of the DataGridCell: 

     <Style TargetType="{x:Type DataGridCell}">
     <Setter Property="Background" Value="Transparent"/>
     <Setter Property="BorderBrush" Value="Transparent"/>
     <Setter Property="BorderThickness" Value="1"/>
     <Setter Property="Template">
      <Setter.Value>
       <ControlTemplate TargetType="{x:Type DataGridCell}">
        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
         <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
        </Border>
       </ControlTemplate>
      </Setter.Value>
     </Setter>
     </Style>
    

    Hope this helps.

    Sincerely,


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by Jie Bao Thursday, January 27, 2011 3:51 AM
    Wednesday, January 19, 2011 8:28 AM
  • Hi Bob,

    On this Microsoft doc page DataGrid Styles and Templates, I see the template for DataGridCell.  However, I don't see the Trigger/Setters from your answer.

    Example: IsSelected=True, then Background=SystemColors.HighlightBrush

    Where did you get this style?  I am interested to view for other controls.

    Thanks, Arpe

    Friday, October 12, 2012 6:06 AM