C# 带有行标题和列标题的ItemsControl WPF

我需要将对象

RegisterBean

的可更新列表

ObservableCollection-listOfRegisters

表示为带有行和列标题的矩阵对象包含3个属性：

byte deviceAddress;
byte register;
byte[] data;

并且只应显示一个属性数据。 预期结果如图所示：

我使用通常的datagrid实现了这个结构，但问题是要更新它，因为我使用了一个带有

newDataTable（）

的转换器作为返回值。这是不正确的，因为它会闪烁并重新渲染所有对象

我昨天请求帮助。这个解决方案正在发挥作用：

<ItemsControl ItemsSource="{Binding listOfRegisters}">
   <ItemsControl.ItemsPanel>
       <ItemsPanelTemplate>
           <UniformGrid Columns="16"/>
                </ItemsPanelTemplate>
           </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
           <DataTemplate>
               <TextBox Text="{Binding Data, Converter={StaticResource ByteToStringValueConverter}}"/>
          </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

但我不知道如何更改usercontrol的结构和添加头。使用

itemscontrol

的解决方案的结果：

谢谢

UPD:

---

标题应该是静态的，没有任何排序和类似的内容，只需在其周围添加一个网格，如下所示：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <Grid Grid.Row="0" Grid.Column="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Label Grid.Column="0" Content="Col 0"/>
        <Label Grid.Column="1" Content="Col 1"/>
        <Label Grid.Column="2" Content="Col 2"/>
    </Grid>
    <Grid Grid.Row="1" Grid.Column="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Label Grid.Row="0" Content="Row 0"/>
        <Label Grid.Row="1" Content="Row 1"/>
        <Label Grid.Row="2" Content="Row 2"/>
    </Grid>
    <UniformGrid Rows="3" Columns="3" Grid.Column="1" Grid.Row="1">
        <Button Content="00"/>
        <Button Content="01"/>
        <Button Content="02"/>
        <Button Content="10"/>
        <Button Content="11"/>
        <Button Content="12"/>
        <Button Content="20"/>
        <Button Content="21"/>
        <Button Content="22"/>
    </UniformGrid>
</Grid>

---

只需在其周围添加一个网格，如下所示：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <Grid Grid.Row="0" Grid.Column="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Label Grid.Column="0" Content="Col 0"/>
        <Label Grid.Column="1" Content="Col 1"/>
        <Label Grid.Column="2" Content="Col 2"/>
    </Grid>
    <Grid Grid.Row="1" Grid.Column="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Label Grid.Row="0" Content="Row 0"/>
        <Label Grid.Row="1" Content="Row 1"/>
        <Label Grid.Row="2" Content="Row 2"/>
    </Grid>
    <UniformGrid Rows="3" Columns="3" Grid.Column="1" Grid.Row="1">
        <Button Content="00"/>
        <Button Content="01"/>
        <Button Content="02"/>
        <Button Content="10"/>
        <Button Content="11"/>
        <Button Content="12"/>
        <Button Content="20"/>
        <Button Content="21"/>
        <Button Content="22"/>
    </UniformGrid>
</Grid>

---

我开始说，可能检查DataGrid的错误会更好，并且不需要重新编写控件，但是如果您仍然想使用

项控件

假设ViewModel中有两个包含标题的集合（ColHeaders和RowHeaders），您可以添加另外两个包含标题的面板

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto"/>
        <ColumnDefinition Width="auto"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
    </Grid.RowDefinitions>

    <!-- Column Headers -->
    <ItemsControl Grid.Column="1" Grid.Row="0"  ItemsSource="{Binding ColHeaders}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding}" Width="30" Height="30"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

    <ItemsControl Grid.Row="1" Grid.Column="1" ItemsSource="{Binding listOfRegisters}">
       <ItemsControl.ItemsPanel>
           <ItemsPanelTemplate>
               <UniformGrid Columns="16"/>
                    </ItemsPanelTemplate>
               </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
               <DataTemplate>
                   <TextBox Text="{Binding Data, Converter={StaticResource ByteToStringValueConverter}}"/>
              </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

    <!-- RowHeaders -->
    <ItemsControl Grid.Column="0" Grid.Row="1" ItemsSource="{Binding RowHeaders}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding}" Width="30" Height="30"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

---

我还调整了文本块和文本框的大小，以便对齐所有内容。

我开始说，可能检查DataGrid的错误会更好，并且不需要重新编写控件，但是如果您仍然想使用

项控件

假设ViewModel中有两个包含标题的集合（ColHeaders和RowHeaders），您可以添加另外两个包含标题的面板

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto"/>
        <ColumnDefinition Width="auto"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
    </Grid.RowDefinitions>

    <!-- Column Headers -->
    <ItemsControl Grid.Column="1" Grid.Row="0"  ItemsSource="{Binding ColHeaders}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding}" Width="30" Height="30"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

    <ItemsControl Grid.Row="1" Grid.Column="1" ItemsSource="{Binding listOfRegisters}">
       <ItemsControl.ItemsPanel>
           <ItemsPanelTemplate>
               <UniformGrid Columns="16"/>
                    </ItemsPanelTemplate>
               </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
               <DataTemplate>
                   <TextBox Text="{Binding Data, Converter={StaticResource ByteToStringValueConverter}}"/>
              </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

    <!-- RowHeaders -->
    <ItemsControl Grid.Column="0" Grid.Row="1" ItemsSource="{Binding RowHeaders}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding}" Width="30" Height="30"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

---

我还调整了文本块和文本框的大小，以便对齐所有内容。

ItemsControl

没有列

GridView

使用它（例如，

ListView

使用它）。因此，您有一个主要工作的

DataGrid

，有一个小的更新问题，而不是试图解决更新问题，您决定将整个基础结构降级为

ItemsControl

，然后，您想知道如何改进

ItemsControl

，使其行为更像

数据网格

？@grek40您100%正确，但我认为这是解决问题的方法。如果您有任何建议-欢迎：）您能给出一个带有具体值的

RegisterBean

对象的具体示例，该对象用于

deviceAddress

、

register

和

data

（请多个字节），并解释它将出现在哪一行/哪一列中，将显示什么以及如何编辑？@grek40这是从

0x00

到

0xFF

的设备寄存器表示。长度可以是1或2字节（取决于设备）。每个单元格显示

注册表项的
数据
属性。例如：
deviceAddress=0x60，寄存器0x5A，data={0xFF}
。DeviceAddress仅用于绑定选定项并在以后使用它（我不会在这个具体视图中显示它）。寄存器值给出了datagrid中具体bean的位置（
0x5A
将位于行
0x5
和列
A
）的交叉处）。数据应该像图片上一样显示为单元格值。
ItemsControl
没有列
GridView
使用它（例如，
ListView
使用它）。因此，您有一个主要工作的
DataGrid
，有一个小的更新问题，而不是试图解决更新问题，您决定将整个基础结构降级为
ItemsControl
，然后，您想知道如何改进
ItemsControl
，使其行为更像
数据网格
？@grek40您100%正确，但我认为这是解决问题的方法。如果您有任何建议-欢迎：）您能给出一个带有具体值的
RegisterBean
对象的具体示例，其中包含
deviceAddress
、
register
和
data
（请多个字节）的具体值，并解释它将显示在哪一行/列中，显示什么以及如何显示