आइटम नियंत्रण के लिए टेम्पलेट के रूप में ग्रिड कैसे सेट करें?

Question

मैं ItemsControl बनाने की कोशिश कर रहा हूं जो ग्रिड को ItemsPanel के रूप में इस तरह से उपयोग करता है कि इसमें दो कॉलम हैं, जहां पहली कॉलम चौड़ाई उस कॉलम में सबसे बड़ी वस्तु की चौड़ाई है, और जैसा कि पंक्तियां हो सकती हैं प्रदर्शित सभी आइटम

असल में, मैं निम्नलिखित चाहते हैं, लेकिन किसी भी तरह तो एक ItemsControl भीतर मैं वस्तुओं का संग्रह करने के लिए बाध्य कर सकते हैं कि:

<Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="auto"/> 
      <ColumnDefinition Width="*"/> 
     </Grid.ColumnDefinitions> 

     <Grid.RowDefinitions> 
      <RowDefinition Height="auto"/> 
      <RowDefinition Height="auto"/> 
      <RowDefinition Height="auto"/> 
     </Grid.RowDefinitions> 

     <Label Content="{Binding Items[0].Header}"/> 
     <TextBox Text="{Binding Items[0].Content}" Grid.Column="1"/> 

     <Label Content="{Binding Items[1].Header}" Grid.Row="1"/> 
     <TextBox Text="{Binding Items[1].Content}" Grid.Row="1" Grid.Column="1"/> 

     <Label Content="{Binding Items[2].Header}" Grid.Row="2"/> 
     <TextBox Text="{Binding Items[2].Content}" Grid.Row="2" Grid.Column="1"/> 
    </Grid> 

संपादित करें: राहेल जवाब महान काम किया है, यहाँ एक काम उदाहरण है ।

(मैं Grid.IsSharedSizeScope = "सही" ItemsPanel में ले जाया गया, यकीन नहीं करता है, तो राहेल (जो काम नहीं किया) ItemTemplate में रख लिए होती)

namespace WpfApplication23 
{ 
    public partial class Window1 : Window 
    { 
     public List<Item> Items { get; set; } 

     public Window1() 
     { 
      Items = new List<Item>() 
      { 
       new Item(){ Header="Item0", Content="someVal" }, 
       new Item(){ Header="Item1", Content="someVal" }, 
       new Item(){ Header="Item267676", Content="someVal" }, 
       new Item(){ Header="a", Content="someVal" }, 
       new Item(){ Header="bbbbbbbbbbbbbbbbbbbbbbbbbb", Content="someVal" }, 
       new Item(){ Header="ccccccc", Content="someVal" } 
      }; 

      InitializeComponent(); 

      DataContext = this; 
     } 
    } 

    public class Item 
    { 
     public string Header { get; set; } 
     public string Content { get; set; } 
    } 
} 

<Window x:Class="WpfApplication23.Window1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 

    <ItemsControl ItemsSource="{Binding Items}"> 

     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
       <StackPanel Grid.IsSharedSizeScope="True"/> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 

     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Grid> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition SharedSizeGroup="ColumnOne" /> 
         <ColumnDefinition Width="*" /> 
        </Grid.ColumnDefinitions> 
        <Label Content="{Binding Header}"/> 
        <TextBox Text="{Binding Content}" Grid.Column="1"/> 
       </Grid> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
    </ItemsControl> 
</Window> 

Answer 1

कई समस्याएं एक ItemsControl के लिए यहां हैं:

• सबसे बड़ा आइटम
• पंक्तियों
• ItemsControl

पिछले एक है में से प्रत्येक यात्रा के लिए एक से अधिक आइटम जनरेट कर रहा है की एक गतिशील संख्या बनाने का की चौड़ाई मैच के लिए अपने पहले कॉलम हो रही वास्तव में सबसे बड़ी समस्या है, क्योंकि ItemsControlContentPresenter में प्रत्येक ItemTemplate को लपेटता है, इसलिए ItemsControl के प्रत्येक इटरेशन के लिए पैनल में एक से अधिक आइटम बनाने का कोई डिफ़ॉल्ट तरीका नहीं है। आपका अंतिम परिणाम इस प्रकार दिखाई देगा:

<Grid> 
    ... 

    <ContentPresenter> 
     <Label Content="{Binding Items[0].Header}"/> 
     <TextBox Text="{Binding Items[0].Content}" Grid.Column="1"/> 
    </ContentPresenter> 
    <ContentPresenter> 
     <Label Content="{Binding Items[1].Header}" Grid.Row="1"/> 
     <TextBox Text="{Binding Items[1].Content}" Grid.Row="1" Grid.Column="1"/> 
    </ContentPresenter> 
    <ContentPresenter> 
     <Label Content="{Binding Items[2].Header}" Grid.Row="2"/> 
     <TextBox Text="{Binding Items[2].Content}" Grid.Row="2" Grid.Column="1"/> 
    </ContentPresenter> 
</Grid> 

मेरे सबसे अच्छे सुझाव एक ItemTemplate कि एक 1X2 Grid शामिल बनाने के लिए होगा, और Grid.IsSharedSizeScope का उपयोग पहले कॉलम साझा की चौड़ाई बनाने के लिए। (ItemsPanelTemplate डिफ़ॉल्ट StackPanel रहेगा।)

इस तरह, अंतिम परिणाम इस प्रकार दिखाई देगा:

<StackPanel> 
    <ContentPresenter> 
     <Grid IsSharedSizeScope="True"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition SharedSizeGroup="ColumnOne" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
      <Label Content="{Binding Header}"/> 
      <TextBox Text="{Binding Content}" Grid.Column="1"/> 
     </Grid> 
    </ContentPresenter> 
    <ContentPresenter> 
     <Grid IsSharedSizeScope="True"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition SharedSizeGroup="ColumnOne" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
      <Label Content="{Binding Header}"/> 
      <TextBox Text="{Binding Content}" Grid.Column="1"/> 
     </Grid> 
    </ContentPresenter> 
    ... 
</StackPanel> 

Answer 2

आप एक ListView उपयोग कर सकते हैं

<ListView ItemsSource="{Binding MyList}"> 
    <ListView.View> 
     <GridView> 
      <GridView.ColumnHeaderContainerStyle> 
       <Style TargetType="{x:Type GridViewColumnHeader}"> 
        <Setter Property="Visibility" Value="Collapsed" /> 
       </Style> 
      </GridView.ColumnHeaderContainerStyle> 
      <GridViewColumn 
       Header="" 
       Width="Auto" 
       DisplayMemberBinding="{Binding Header}"/> 
      <GridViewColumn 
       Header="" 
       DisplayMemberBinding="{Binding Value}"/> 
     </GridView> 
    </ListView.View> 
</ListView> 

ColumnHeaderContainerStyle छुपाता GridViewHeader