如何创建一个包含面板的动态网格

问题描述：

我有一个要求，动态创建一个有3列的WPF网格，行数取决于我需要的面板数量。第一个面板将在网格位置0,0,0,1 - > 0,2 - > 1,0 - > 1,1等下一个。因此，如果我需要20个面板，网格将有3列和7行。网格应该填满整个窗口如何创建一个包含面板的动态网格

并且每个面板上都应该有一个标题和一个进度条。我想我有我的面板作为一个单独的用户控件

我开始接触WPF所以任何帮助将是巨大的

非常感谢

你的问题是什么？ – Zak 2012-07-25 17:03:09

我必须写什么代码才能实现上述目标？ – Bob 2012-07-25 17:05:34

你现在试过什么代码？ – Zak 2012-07-25 17:06:16

答

以下示例显示如何创建行数和列数，并将对象（本例中为Label）放入每个单元格中。看看你是否可以从那里推断。

public partial class MainWindow : Window 
{ 
    Grid grid1; 
    public MainWindow() 
    { 
     InitializeComponent(); 

     int cellCount = 14; 
     int numCols = 3; 
     int numRows = (cellCount + 1)/numCols; 
     grid1 = new Grid(); 

     this.AddChild(grid1); 

     for(int i=0; i<numCols; ++i) 
      this.grid1.ColumnDefinitions.Add(new ColumnDefinition()); 
     for (int i = 0; i < numRows; ++i) 
      this.grid1.RowDefinitions.Add(new RowDefinition()); 

     foreach (var g in this.grid1.RowDefinitions) 
     { 
      g.Height = new GridLength(100); 
     } 

     foreach (var g in grid1.ColumnDefinitions) 
     { 
      g.Width = new GridLength(100); 
     } 

     for(int i=0; i<cellCount; ++i) 
     { 
      int idx = grid1.Children.Add(new Label()); 
      Label x = grid1.Children[idx] as Label; 

      x.Content = "Cell " + i; 
      x.SetValue(Grid.RowProperty, i/numCols); 
      x.SetValue(Grid.ColumnProperty, i % numCols); 
     } 
    } 
}

该示例以几乎完全空的XAML开始。它只有Window元素。

答

你必须做的代码 - 据我所知，在后面。

你只需将需要的单元格除以3即可。

从网格派生出一个控件。为单元号创建一个自定义附属属性。然后重写MeasureOverride，并按四舍五入的行数设置网格rowdefinitions。然后在每个项目上设置grid.row和grid.column，以对应从控件读取的单元格编号。

然后调用默认的grid.measureoverride。

public class ArrangeGrid : Grid 
{ 
    public ArrangeGrid() 
    { 
     ColumnDefinitions.Add(new ColumnDefinition()); 
     ColumnDefinitions.Add(new ColumnDefinition()); 
     ColumnDefinitions.Add(new ColumnDefinition()); 
    } 
    public static DependencyProperty GridCellProperty = DependencyProperty.RegisterAttached("GridCell", typeof(int), typeof(ArrangeGrid)); 

    public static void SetGridCell(UIElement element, int value) 
    { 
     element.SetValue(ArrangeGrid.GridCellProperty, value); 
    } 

    [AttachedPropertyBrowsableForChildren] 
    public static int GetGridCell(UIElement element) 
    { 
     return (int)element.GetValue(ArrangeGrid.GridCellProperty); 
    } 

    protected override Size MeasureOverride(Size constraint) 
    { 
     RowDefinitions.Clear(); 

     int rowCount = this.Children.Count/3; 
     if (this.Children.Count % 3 != 0) 
     { 
      rowCount += 1; 
     } 

     while (RowDefinitions.Count < rowCount) 
     { 
      RowDefinitions.Add(new RowDefinition()); 
     } 

     foreach (var child in this.Children) 
     { 

      int gridCell = ArrangeGrid.GetGridCell((UIElement)child); 
      int gridRow = gridCell/3; 
      int gridCol = gridCell % 3; 

      ((UIElement)child).SetValue(Grid.RowProperty, gridRow); 
      ((UIElement)child).SetValue(Grid.ColumnProperty, gridCol); 

     } 

     return base.MeasureOverride(constraint); 
    } 
}

很明显，您可以在没有GridCell属性的情况下执行此操作。如果你跳过网格单元，那里有一些错误，但你应该能够适应这个代码的使用。

如何创建一个包含面板的动态网格

相关推荐