Сетка Таблица в WPF - PullRequest
Новая
       23

Сетка Таблица в WPF

5 голосов
/ 12 февраля 2011

Мне нужно создать сетку. Это должно быть редактируемым
И я должен установить количество строк и столбцов.
например 

mygrid.RowCount = 3;
mygrid.ColumnCount = 3;

Вот как это должно выглядеть:

enter image description here

Как привязать 2D массив к DataGrid?

Ответы [ 2 ]

16 голосов
/ 12 февраля 2011

Вы можете использовать элемент управления WPF DataGrid. Он отображает сетку ячеек, которые соответствуют коллекции объектов (строк), содержащих свойства (столбцы). Вам необходимо предоставить хранилище данных - набор объектов. Количество объектов в коллекции (количество коллекций) будет определять количество строк в сетке. DataGrid поддерживает редактирование данных в пользовательском интерфейсе.

Этот пример определяет три столбца и связывает их со свойствами A, B и C объекта данных. 

<DataGrid AutoGenerateColumns="False" 
          Height="200" 
          HorizontalAlignment="Left" 
          Name="dataGrid1" 
          VerticalAlignment="Top" 
          Width="200">
    <DataGrid.Columns >
            <DataGridTextColumn Binding="{Binding Path=A}" MinWidth="50" />
            <DataGridTextColumn Binding="{Binding Path=B}" MinWidth="50" />
            <DataGridTextColumn Binding="{Binding Path=C}" MinWidth="50" />
    </DataGrid.Columns>
</DataGrid>

Вам потребуется назначить (в коде или с помощью привязки данных) коллекцию объектов с этими свойствами для свойства ItemsSource в DataGrid, как и для любого другого ItemsControl. Как то так: 

public partial class MainWindow: Window
{
        public class DataObject
        {
            public int A { get; set; }
            public int B { get; set; }
            public int C { get; set; }
        }

        public MainWindow()
        {
            InitializeComponent();

            var list = new ObservableCollection<DataObject>();
            list.Add(new DataObject() { A = 6, B = 7, C = 5 });
            list.Add(new DataObject() { A = 5, B = 8, C = 4 });
            list.Add(new DataObject() { A = 4, B = 3, C = 0 });
            this.dataGrid1.ItemsSource = list;
}

И результат выглядит так при редактировании центральной ячейки:

WPF DataGrid

Примечание: класс сетки WPF предназначен только для макета. Он не обеспечивает поддержку редактирования данных.

1 голос
/ 12 февраля 2011

Вот общий метод создания ItemsControl, который использует Grid для разметки своих предметов. В этом примере (в котором используется источник данных XML) ItemsSource - это набор элементов со свойствами Row, Column и Data.

Обратите внимание на использование ItemContainerStyle. Это необходимо здесь, потому что для того, чтобы элемент управления Grid использовал присоединенные свойства Grid.Row и Grid.Column, эти свойства должны быть присоединены к объектам, вставленным в сетку - если вы попытаетесь установить их на TextBox что генерирует ItemsTemplate, сетка их не увидит, потому что смотрит на сгенерированный ContentPresenter, а не на TextBox внутри него. 

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Page.Resources>
    <XmlDataProvider x:Key="Data">
      <x:XData>
        <Data xmlns="">
          <Item Row="0" Column="0" Data="0,0"/>
          <Item Row="1" Column="1" Data="1,1"/>
          <Item Row="2" Column="1" Data="2,1"/>
          <Item Row="3" Column="2" Data="3,2"/>
          <Item Row="4" Column="4" Data="4,4"/>
          <Item Row="4" Column="3" Data="4,3"/>
        </Data>
      </x:XData>
    </XmlDataProvider>
  </Page.Resources>
  <DockPanel>
    <ItemsControl ItemsSource="{Binding Source={StaticResource Data}, XPath=/Data/Item}">
      <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
          <Grid>  
            <Grid.ColumnDefinitions>
              <ColumnDefinition Width="50"/>
              <ColumnDefinition Width="50"/>
              <ColumnDefinition Width="50"/>
              <ColumnDefinition Width="50"/>
              <ColumnDefinition Width="50"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
              <RowDefinition Height="30"/>    
              <RowDefinition Height="30"/>    
              <RowDefinition Height="30"/>    
              <RowDefinition Height="30"/>    
              <RowDefinition Height="30"/>    
            </Grid.RowDefinitions>
          </Grid>        
        </ItemsPanelTemplate>
      </ItemsControl.ItemsPanel>
      <ItemsControl.ItemContainerStyle>
        <Style TargetType="ContentPresenter">
          <Setter Property="Grid.Row" Value="{Binding XPath=@Row}"/>
          <Setter Property="Grid.Column" Value="{Binding XPath=@Column}"/>
        </Style>
      </ItemsControl.ItemContainerStyle>
      <ItemsControl.ItemTemplate>
        <DataTemplate>
          <TextBox Text="{Binding XPath=@Data, Mode=TwoWay}"/>
        </DataTemplate>
      </ItemsControl.ItemTemplate>
    </ItemsControl>
  </DockPanel>
</Page>
...