datagrid滚动条样式

Datagrid是一种用于展示大量数据的控件，通常会存在大量的行和列，当数据超过控件边界时，滚动条就起到了非常重要的作用。滚动条样式是指滚动条在控件中的外观和行为。

一般来说，滚动条样式包括滚动条的颜色、宽度、高度、按钮的大小和形状、滚动区域的背景色等。

要定制datagrid的滚动条样式，可以通过CSS来进行样式的修改。可以修改滚动条的颜色、宽度等外观属性，也可以修改滚动条的行为属性。

例如，可以使用css选择器来选择滚动条，然后给滚动条设置背景色、宽度、高度等属性。可以通过border属性来设置滚动条的宽度，通过background-color属性来设置滚动条的颜色，通过width和height属性来设置滚动条的宽度和高度。

同时，可以使用伪类选择器来选择滚动条的按钮，然后通过设置相关属性来调整按钮的大小和形状。

最后，可以使用overflow属性对滚动条进行控制，来决定滚动条是始终显示还是只在需要时显示。

总之，通过CSS样式的修改，我们可以自定义datagrid滚动条的样式，使其更符合我们的需求和设计风格。

相关问题

wpf datagrid行拖拽 样式

要实现 WPF DataGrid 行拖拽的样式，可以使用以下方法：

1. 定义行拖拽的样式。可以在 XAML 中定义 DataGridRow 的 Style，添加一个 Thumb 控件，用于拖拽行。例如：

<Style TargetType="{x:Type DataGridRow}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type DataGridRow}">
                <Grid>
                    <Thumb x:Name="PART_DragThumb" Width="8" Height="8" Background="Transparent"
                           DragDelta="PART_DragThumb_DragDelta"/>
                    <DataGridCellsPresenter/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

其中，PART_DragThumb 是拖拽用的 Thumb 控件，DataGridCellsPresenter 显示单元格内容。

2. 在 DataGrid 的 RowStyle 中添加 PreviewMouseLeftButtonDown、PreviewMouseMove 和 PreviewMouseLeftButtonUp 事件处理程序，分别处理行拖拽的开始、移动和结束事件。在 PreviewMouseLeftButtonDown 事件中，启用拖拽操作，并将拖拽的行保存到 _draggedRow 变量中。在 PreviewMouseMove 事件中，根据鼠标移动的距离调整拖拽用的 Thumb 控件的位置。在 PreviewMouseLeftButtonUp 事件中，结束拖拽操作，并将 _draggedRow 置为 null。例如：

private DataGridRow _draggedRow;

private void DataGrid_RowStyle(object sender, EventArgs e)
{
    DataGridRow row = e.OriginalSource as DataGridRow;
    if (row != null)
    {
        row.PreviewMouseLeftButtonDown += DataGrid_RowPreviewMouseLeftButtonDown;
        row.PreviewMouseMove += DataGrid_RowPreviewMouseMove;
        row.PreviewMouseLeftButtonUp += DataGrid_RowPreviewMouseLeftButtonUp;
    }
}

private void DataGrid_RowPreviewMouseLeftButtonDown(object sender, MouseEventArgs e)
{
    _draggedRow = sender as DataGridRow;
    if (_draggedRow != null)
    {
        _draggedRow.IsSelected = true;
        DragDrop.DoDragDrop(_draggedRow, _draggedRow.Item, DragDropEffects.Move);
    }
}

private void DataGrid_RowPreviewMouseMove(object sender, MouseEventArgs e)
{
    if (_draggedRow != null && e.LeftButton == MouseButtonState.Pressed)
    {
        Point currentPoint = e.GetPosition(DataGrid);
        Vector diff = _dragStartPoint - currentPoint;

        if (Math.Abs(diff.X) > SystemParameters.MinimumHorizontalDragDistance || Math.Abs(diff.Y) > SystemParameters.MinimumVerticalDragDistance)
        {
            Thumb thumb = _draggedRow.Template.FindName("PART_DragThumb", _draggedRow) as Thumb;
            if (thumb != null)
            {
                DragDrop.AddPreviewDragOverHandler(thumb, DataGrid_DragOver);
                DragDrop.AddPreviewDropHandler(thumb, DataGrid_Drop);
                DataObject dragData = new DataObject("DataGridRow", _draggedRow.Item);
                DragDrop.DoDragDrop(thumb, dragData, DragDropEffects.Move);
                DragDrop.RemovePreviewDragOverHandler(thumb, DataGrid_DragOver);
                DragDrop.RemovePreviewDropHandler(thumb, DataGrid_Drop);
            }
        }
    }
}

private void DataGrid_RowPreviewMouseLeftButtonUp(object sender, MouseEventArgs e)
{
    _draggedRow = null;
}

3. 在 DataGrid 的 DragOver 和 Drop 事件处理程序中，根据当前鼠标位置和目标行位置计算出拖拽的行应该插入到哪个位置，并调整 DataGrid 的 ItemsSource 中对应的元素的位置。例如：

private void DataGrid_DragOver(object sender, DragEventArgs e)
{
    Thumb thumb = sender as Thumb;
    if (thumb != null)
    {
        Point dropPoint = e.GetPosition(DataGrid);
        DataGridRow row = DataGrid.ItemContainerGenerator.ContainerFromIndex(DataGrid.Items.Count - 1) as DataGridRow;
        double bottomEdge = row.TransformToAncestor(DataGrid).Transform(new Point(0, row.ActualHeight)).Y;

        if (dropPoint.Y <= bottomEdge)
        {
            DataGridRow targetRow = DataGrid.HitTest(dropPoint).VisualHit.GetParentOfType<DataGridRow>();
            if (targetRow != null && targetRow != _draggedRow)
            {
                int oldIndex = DataGrid.Items.IndexOf(_draggedRow.Item);
                int newIndex = DataGrid.Items.IndexOf(targetRow.Item);

                if (oldIndex < newIndex)
                {
                    DataGrid.Items.Insert(newIndex + 1, _draggedRow.Item);
                    DataGrid.Items.RemoveAt(oldIndex);
                }
                else
                {
                    DataGrid.Items.RemoveAt(oldIndex);
                    DataGrid.Items.Insert(newIndex, _draggedRow.Item);
                }

                _draggedRow.IsSelected = true;
                DataGrid.SelectedItem = _draggedRow.Item;
            }
        }
    }
}

private void DataGrid_Drop(object sender, DragEventArgs e)
{
    _draggedRow = null;
}

注意，以上代码中使用了 GetParentOfType 扩展方法，用于查找指定元素的父级元素中第一个指定类型的元素。可以在代码中添加以下代码实现该扩展方法：

public static T GetParentOfType<T>(this DependencyObject element) where T : DependencyObject
{
    while (element != null && !(element is T))
    {
        element = VisualTreeHelper.GetParent(element);
    }
    return element as T;
}

最后，可以根据需要自定义拖拽用的 Thumb 控件的样式，例如在 XAML 中添加以下代码：

<Thumb x:Name="PART_DragThumb" Width="8" Height="8" Background="Transparent"
       DragDelta="PART_DragThumb_DragDelta">
    <Thumb.Template>
        <ControlTemplate TargetType="{x:Type Thumb}">
            <Border Background="Gray" CornerRadius="4"/>
        </ControlTemplate>
    </Thumb.Template>
</Thumb>

这样就可以自定义拖拽用的 Thumb 控件的样式了。

DataGridCell样式

可以通过样式来自定义 DataGridCell 的外观，比如设置背景颜色、边框、字体颜色等。可以使用以下样式代码来定义 DataGridCell 的样式：

<Style TargetType="{x:Type DataGridCell}">
    <Setter Property="Background" Value="LightGray"/>
    <Setter Property="BorderBrush" Value="Black"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="Foreground" Value="Black"/>
    <Setter Property="Padding" Value="5"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type DataGridCell}">
                <Border BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Background="{TemplateBinding Background}"
                        Padding="{TemplateBinding Padding}">
                    <ContentPresenter />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

此样式设置 DataGridCell 的背景颜色为浅灰色，边框颜色为黑色，字体颜色为黑色，边框宽度为1像素，内边距为5像素。ContentPresenter 用于显示单元格中的内容。