Datagrid 奇怪的视觉效果答案

【问题标题】：Datagrid strange visual effectsDatagrid 奇怪的视觉效果
【发布时间】：2016-09-03 12:33:07
【问题描述】：

为什么我的DataGrid 看起来像这样？

我一直在添加一些样式，并产生了一些“副作用”。缺少一些线条，颜色在各处都不相同（中间较浅）。这是数据网格的 xaml：

<DataGrid x:Name="dataGrid" RowHeaderWidth="0"  CanUserResizeRows="False" HorizontalScrollBarVisibility="Disabled" BorderThickness="0" GridLinesVisibility="None" Height="400" Width="800" HorizontalAlignment="Right" CanUserAddRows="True" Margin="0,210,0,0" Background="Transparent" Foreground="Gray">
                    <DataGrid.Columns>
                        <DataGridTextColumn Header="Name"  CanUserResize="False" IsReadOnly="True" Binding="{Binding Path=Mp3Title}" Width="300" ></DataGridTextColumn>
                        <DataGridTextColumn Header="Download Info" CanUserResize="False" IsReadOnly="True"  Binding="{Binding Path=DownloadProgress}" Width="250"></DataGridTextColumn>
                        <DataGridTextColumn Header="State" CanUserResize="False" IsReadOnly="True"  Binding="{Binding Path=State}" Width="250"></DataGridTextColumn>
                    </DataGrid.Columns>
                    <DataGrid.Resources>
                        <Style TargetType="{x:Type DataGridColumnHeader}">
                            <Setter Property="Background" Value="Transparent" />
                            <Setter Property="Margin" Value="80,0" />
                        </Style>
                        <Style TargetType="{x:Type DataGridCell}">
                            <Setter Property="Background" Value="#FF181818"/>
                            <Setter Property="BorderThickness" Value="0"/>
                            <Setter Property="TextBlock.TextAlignment" Value="Left" />
                        </Style>
                    </DataGrid.Resources>
                </DataGrid >

我在文本列中添加项目的 cs 部分

GridInfo data = new GridInfo { Mp3Title = "Some item" ...etc... };
dataGrid.Items.Add(data);

是不是样式里的东西搞砸了？

【问题讨论】：

标签： c# wpf visual-studio datagrid

【解决方案1】：

您提供的上述代码看起来不错。这可能有一些定义，可能是 Window.Resources

点击时变亮？然后，应用它可能很有用。

<DataGrid.Resources>
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#FFFDFD0A"/>
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black"/>
    <SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" Color="#FFFDFD0A"/>
</DataGrid.Resources>

您可以根据自己的选择更改颜色。

或者，在没有任何输入（点击）的情况下颜色变浅了？你能解释更多吗？

【讨论】：

正如您在图片中看到的，网格的颜色有所不同。有些颜色较深，有些颜色较浅。我会投票给你，因为你的例子给了我一些想法，但是我找到了解决方案并让它变得更好。我将发布带有图片和 xaml 的答案。

【解决方案2】：

找到了解决方案，让它看起来更好看

xaml:

<DataGrid x:Name="dataGrid" RowHeaderWidth="0"  CanUserResizeRows="False" VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Disabled" BorderThickness="0" GridLinesVisibility="Horizontal" Height="200" Width="800" HorizontalAlignment="Right" CanUserAddRows="True" Margin="0,210,0,0" Background="Transparent" Foreground="Gray" MouseEnter="dataGrid_MouseEnter" MouseLeave="dataGrid_MouseLeave">
                    <DataGrid.Columns>
                        <DataGridTextColumn Header="Name"  CanUserResize="False" IsReadOnly="True" Binding="{Binding Path=Mp3Title}" Width="300" ></DataGridTextColumn>
                        <DataGridTextColumn Header="Download Info" CanUserResize="False" IsReadOnly="True"  Binding="{Binding Path=DownloadProgress}" Width="250"></DataGridTextColumn>
                        <DataGridTextColumn Header="State" CanUserResize="False" IsReadOnly="True"  Binding="{Binding Path=State}" Width="250"></DataGridTextColumn>
                    </DataGrid.Columns>
                    <DataGrid.Resources>
                        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="White"/>
                        <SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}" Color="Gray"/>
                        <Style TargetType="{x:Type DataGridColumnHeader}">
                            <Setter Property="Background" Value="Transparent" />
                            <Setter Property="Margin" Value="80,10" />
                            <Setter Property="Height" Value="30"/>
                        </Style>
                        <Style TargetType="{x:Type DataGridCell}">
                            <Setter Property="Background" Value="#FF181818"/>
                            <Setter Property="BorderThickness" Value="0"/>
                            <Setter Property="TextBlock.TextAlignment" Value="Left" />
                            <Setter Property="Height" Value="30"/>
                        </Style>
                    </DataGrid.Resources>
                </DataGrid >

【讨论】：

很高兴知道您找到了解决方案。似乎利用鼠标事件。作为提示，我认为您的 DataGrid 不是用户需要编辑的内容，设置 Readonly 可能可以避免用户误用。我也会赞成你的问题。希望你一如既往的出色！