如何将控件位置绑定到数据网格的滚动位置

Question

我想通过在上面添加描述性标题（标签）来对 DataGrid 列进行分组：

（前两列上方的“标题 1”）

---

调整列大小时，标签会按其应有的方式响应：

（“标题 1”仍在前两列上方）

---

但是水平滚动 DataGrid 时标签不会移动其位置：

（“标题 1”不再位于前两列上方）

---

我已经尝试将所有内容添加到 ScrollViewer 中，但是当垂直滚动时，DataGrid 的标题以及顶部的标签将消失，而这是不应该的。

有什么想法如何将标签的水平位置绑定到 DataGrid 的水平滚动位置吗？ （最好仅在 xaml 中）

这是我的代码：

<Window x:Class="WpfApp2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="MainWindow" Height="250" Width="600">

<StackPanel Margin="10">
    
    <Grid Height="30" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="7"/>
            <ColumnDefinition Width="{Binding ElementName=ColId, Path=ActualWidth, Mode=OneWay}"/>
            <ColumnDefinition Width="{Binding ElementName=ColName, Path=ActualWidth, Mode=OneWay}"/>
        </Grid.ColumnDefinitions>
        <Label Grid.Column="1" 
               Grid.ColumnSpan="2" 
               Content="Header 1" 
               Background="LightYellow" 
               HorizontalContentAlignment="center" 
               BorderThickness="1" 
               BorderBrush="Black" 
               Margin="0,0,-1,-1"/>
    </Grid>

    <DataGrid Name="dgSimple"
              AutoGenerateColumns="False">
        <DataGrid.Columns>
            <DataGridTextColumn x:Name="ColId"
                                Header="ID"
                                Binding="{Binding Id}"/>
            <DataGridTextColumn x:Name="ColName"
                                Header="Name"
                                Binding="{Binding Name}"/>
            <DataGridTextColumn Header="Value1"
                                Binding="{Binding Value1}"/>
            <DataGridTextColumn Header="Value2"
                                Binding="{Binding Value2}"/>
        </DataGrid.Columns>
    </DataGrid>
    
</StackPanel>

using System.Collections.Generic;
using System.Windows;

namespace WpfApp2
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = this;
        List<Item> items = new()
        {
            new Item()
            {
                Id = 1,
                Name = "Name1",
                Value1="Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
                Value2="Sem integer vitae justo eget. Pellentesque diam volutpat commodo sed."
            },
            new Item() { Id = 2, Name = "Name2" },
            new Item() { Id = 3, Name = "Name3" }
        };
        dgSimple.ItemsSource = items;
    }
}

public class Item
{
    public int Id { get; set; }
    public string Name { get; set; } = "";
    public string Value1 { get; set; } = "";
    public string Value2 { get; set; } = "";
}

}

Answer 1

XAML 是一种标记语言。不要用它来实现这种行为。无论如何，您不能直接绑定到

DataGrid

的水平偏移。

您可以直接在视图中或在

附加行为

中处理

ScrollChanged

的DataGrid事件：

private void dgSimple_ScrollChanged(object sender, ScrollChangedEventArgs e)
{
    label.Margin = new Thickness(-e.HorizontalOffset, 0, -1, -1);
}

不要忘记将

HorizontalAlignment

的

Label

属性设置为

Left

以防止其拉伸：

<Label x:Name="label" Grid.Column="1" HorizontalAlignment="Left" ... />