2つの異なるコントロールでセルの幅/高さを接続しますか？

Question

同じアイテムのアマウンド（動的量）を含む2つのコントロールを作成する必要があります。最初のコントロールはキーを表し、2つ目は値を表します。

ユーザーが上部の列の幅をサイズ変更すると、（値の）下の行の同じ列に影響するようにする必要があります。

これが私が望むものの例です：

<Window 
  DataContext="{Binding RelativeSource={RelativeSource Self}}"
  x:Class="MainWindow"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Window.Resources>
    <ItemsPanelTemplate x:Key="ItemsPanelTemplate">
      <VirtualizingStackPanel Orientation="Horizontal"/>
    </ItemsPanelTemplate>
  </Window.Resources>
  <StackPanel>
    <ItemsControl ItemsSource="{Binding Keys}" 
                  ItemsPanel="{StaticResource ItemsPanelTemplate}"/>
    <ItemsControl Grid.Row="1" ItemsSource="{Binding Values}" 
                  ItemsPanel="{StaticResource ItemsPanelTemplate}"/>
  </StackPanel>
</Window>

---

Imports System.Collections.Specialized
Class MainWindow
  Private Sub Window_Loaded(ByVal sender As Object,
                            ByVal e As RoutedEventArgs) Handles MyBase.Loaded
    DataContext =
      New StringDictionary From
      {
        {"key1", "value1"},
        {"key2", "value2"},
        {"key3", "value3"},
        {"key4", "value4"}
      }
  End Sub
End Class

結果：

繰り返しになりますが、細胞の境界とセルの幅と高さをサポートするDatagridのようなコントロールを作成して、他のコントロールの幅 +許可を変更する必要があります。

私はそれをxamlyにすることを好みます。注：カスタムコントロールなので、必要に応じて適切なプロパティを宣言できます。ただし、セルの高さと幅は動的で、特定の列/行に対して個別でなければならないことを忘れないでください。

を参考に これ 質問、私はそれをわずかに異なる方法で作成しました（セルの3番目のコントロールを持っています）が、質問はまだ同じです。柱とセルの高さの幅を動的にし、ユーザーに影響に影響を与える能力をユーザーに与えたいお互い。

アップデート

Decycloneの答え 私が実装したいものですが、私は彼が設定した例を試しました ItemsControls ' Grid.IsSharedSizeScope Trueへの財産ですが、それは機能しませんでした、ここに結果があります（トリミング）：

2つの異なるコントロール間で共有サイズのスコープを適用することは可能ですか？

Answer 1

私は何かを試して、うまくいくようです：

xaml：

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication2"
        Title="MainWindow"
        Height="350"
        Width="525">
    <Window.Resources>
        <local:GroupNameGenerator x:Key="GroupNameGenerator1" />
        <local:GroupNameGenerator x:Key="GroupNameGenerator2" />
    </Window.Resources>
    <Grid>
        <StackPanel Grid.IsSharedSizeScope="True">
            <ItemsControl Name="ItemsControl1">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal" />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition SharedSizeGroup="{Binding Converter={StaticResource GroupNameGenerator1}}" />
                            </Grid.ColumnDefinitions>
                            <Border BorderBrush="Black"
                                    BorderThickness="1"
                                    Margin="5"
                                    Padding="5">
                                <TextBlock Text="{Binding}" />
                            </Border>
                        </Grid>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
            <ItemsControl Name="ItemsControl2">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal" />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition SharedSizeGroup="{Binding Converter={StaticResource GroupNameGenerator2}}" />
                            </Grid.ColumnDefinitions>
                            <Border BorderBrush="Black"
                                    BorderThickness="1"
                                    Margin="5"
                                    Padding="5">
                                <TextBlock Text="{Binding}" />
                            </Border>
                        </Grid>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </StackPanel>
    </Grid>
</Window>

コード：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Collections.ObjectModel;

namespace WpfApplication2
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        ObservableCollection<Int32> list1 = new ObservableCollection<Int32>();
        ObservableCollection<String> list2 = new ObservableCollection<String>();

        public MainWindow()
        {
            InitializeComponent();

            for (int i = 0; i < 25; i++)
            {
                list1.Add(i + 1);
                list2.Add(new String('0', ((i + 1) / 3)));
            }

            ItemsControl1.ItemsSource = list1;
            ItemsControl2.ItemsSource = list2;
        }
    }

    public class GroupNameGenerator : IValueConverter
    {
        public Int32 Index { get; set; }

        public GroupNameGenerator()
        {
            Index = 0;
        }

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            return String.Format("Group{0}", ++Index);
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

Answer 2

こんにちはサンプルの次のリンクを確認してください。sites.google.com/site/html5tutorials/paralleldatabinding.zip

接続されたサンプルは列が最適化されています。つまり、多数の列と行の数が少ない。サンプルには、50kの列と10行が含まれています。 1秒より少ないレンダリング。