web-dev-qa-db-ja.com

FullRow選択モードでDataGridの現在のセルの境界線を無効にする

行選択モードでDataGridを使用しています(つまり、SelectionUnit="FullRow")。ユーザーが行を強調表示するときに現在のセルの周囲に配置されている境界線を削除して、真の完全な行選択(およびセルレベル選択なし)を行うだけです。現在のセルを維持するグリッドの概念は気にせず、おそらく現在のセルのスタイルを変更することによって、その厄介な現在のセルの境界線を削除したいだけです。これを行う最も簡単な方法は何ですか?

48

BorderThicknessDataGridCellを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>
97
Fredrik Hedblad

ここで別の答えがありましたが、それは近いものでしたが、フォーカス長方形を取り除きませんでした。すべての境界線を消去する方法は次のとおりです。

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

また、技術的にはこれらのセルはまだフォーカスを取得しているため(表示されません)、タブキーを次のセルではなく次の行に進めるために、上記に基づいてセルスタイルを定義しますが、以下...

<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>

...次に、最初の列定義以外のすべてに適用します。これにより、タブキーは次のセルではなく、次の行に進みます。

ただし、国境に戻ります。それらを非表示にしたいが、それらをスペーシング理由のレイアウトの一部にしたい場合は、上記をこれに変更してください...

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

楽しい! :)

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

セルが編集可能かつ選択されている場合にのみ境界線を表示する場合は、DataGridCellテンプレートをオーバーライドし、IsReadOnlyではなくセルがIsSelectedの場合にマルチトリガーを追加できます。列またはDataGridにIsReadOnly = trueを設定すると、セルに境界線は表示されません。

<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>

スタイルでテンプレートを使用する

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

そしてスタイルを使用する

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

xceedDataGridControlを使用している場合は、NavigationBehaviorRowOnlyに設定します

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