web-dev-qa-db-fra.com

Désactiver la bordure de cellule actuelle DataGrid en mode de sélection FullRow

J'utilise un DataGrid en mode de sélection de ligne (c'est-à-dire, SelectionUnit="FullRow"). Je souhaite simplement supprimer la bordure placée autour de la cellule en cours lorsque l'utilisateur sélectionne une ligne afin d'obtenir une sélection de ligne complète (et aucune sélection au niveau de la cellule). La notion selon laquelle la grille conserve la cellule actuelle ne me dérange pas, je souhaite simplement supprimer cette saturée frontière de cellule actuelle, peut-être en modifiant le style de la cellule actuelle. Quelle est la manière la plus simple de faire ça?

45
Michael Goldshteyn

Vous pouvez définir la BorderThickness pour DataGridCell à 0

<DataGrid ...
          SelectionUnit="FullRow">
    <DataGrid.CellStyle>
        <Style TargetType="DataGridCell">
            <Setter Property="BorderThickness" Value="0"/>
            <!-- Update from comments.
                 Remove the focus indication for the selected cell -->
            <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
        </Style>
    </DataGrid.CellStyle>
    <!-- ... -->
</DataGrid>
96
Fredrik Hedblad

J'ai vu une autre réponse proche, mais elle ne s'est pas débarrassée du rectangle de focus. Voici comment effacer toutes les frontières.

<DataGrid.Resources>
    <Style TargetType="{x:Type DataGridCell}">
        <Setter Property="BorderThickness" Value="0" />
        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
    </Style>
</DataGrid.Resources>

De plus, comme techniquement, ces cellules ont toujours le focus (vous ne le voyez pas), pour que la touche de tabulation passe à la rangée suivante au lieu de la cellule suivante, je définis un style de cellule basé sur ce qui précède, mais qui ajoute également le Suivant...

<DataGrid.Resources>
    <Style x:Key="NoFocusDataGridCell" TargetType="{x:Type DataGridCell}" BasedOn="{StaticResource {x:Type DataGridCell}}">
        <Setter Property="Focusable"        Value="False" />
        <Setter Property="IsTabStop"        Value="False" />
        <Setter Property="IsHitTestVisible" Value="False" />
    </Style>
</DataGrid.Resources>

... alors je l'applique à toutes les définitions sauf la première colonne. Ainsi, la touche de tabulation passe à la ligne suivante, pas à la cellule suivante.

Retour aux frontières cependant. Si vous voulez les cacher mais que vous voulez toujours qu'ils fassent partie de la mise en page pour des raisons d'espacement, changez ce qui précède en ceci ...

<DataGrid.Resources>
    <Style TargetType="{x:Type DataGridCell}">
        <Setter Property="BorderBrush" Value="Transparent" />
        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
    </Style>
</DataGrid.Resources>

Prendre plaisir! :)

9
MarqueIV
<Style x:Key="DataGrid" TargetType="DataGrid">
    <Setter Property="CellStyle">
        <Setter.Value>
            <Style TargetType="DataGridCell">
                <Setter Property="BorderThickness" Value="0"/>
                <Setter Property="Foreground" Value="{Binding Foreground, RelativeSource={RelativeSource TemplatedParent}}" />
                <Setter Property="Background" Value="{Binding Background, RelativeSource={RelativeSource TemplatedParent}}" />
            </Style>
        </Setter.Value>
    </Setter>
</Style>
6
marius

Si vous souhaitez afficher une bordure uniquement lorsque la cellule est modifiable et sélectionnée, vous pouvez remplacer le modèle DataGridCell et ajouter un multitrigger lorsque la cellule IsSelected et non IsReadOnly. Ensuite, aucune bordure ne sera affichée pour les cellules si vous définissez IsReadOnly = true pour la colonne ou DataGrid

<ControlTemplate x:Key="MellowDataGridCellTemplate" TargetType="{x:Type DataGridCell}">
    <Grid>
        <ContentPresenter VerticalAlignment="Center" />
        <Rectangle Name="FocusVisual" Stroke="White" StrokeThickness="1" Fill="Transparent" HorizontalAlignment="Stretch" 
                           VerticalAlignment="Stretch" IsHitTestVisible="false" Opacity="0" />

    </Grid>
    <ControlTemplate.Triggers>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsReadOnly" Value="False" />
                <Condition Property="IsSelected" Value="True" />
            </MultiTrigger.Conditions>
            <Setter TargetName="FocusVisual" Property="Opacity" Value="1"/>
        </MultiTrigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

Utilisez le modèle dans un style

<Style TargetType="{x:Type DataGridCell}" x:Key="MellowGridDataGridCell">
    <Setter Property="Template" Value="{StaticResource MellowDataGridCellTemplate}" />
</Style>

Et utiliser le style

<DataGrid CellStyle={StaticResource MellowGridDataGridCell >
    ...
</DataGrid>
0
AxdorphCoder

Si vous utilisez xceedDataGridControl, définissez NavigationBehavior sur RowOnly

<xcdg:DataGridControl NavigationBehavior="RowOnly" SelectionMode="Single"  ....
0
Simon_Weaver