Nevron .NET Vision
Diagram for .NET / User's Guide / Document Object Model / Models / Shapes / Table Shape

In This Topic
    Table Shape
    In This Topic
     Overview

    The table shape is composed of cells. Each cell is a styleable diagram element and may also have borders (left, right, top, bottom or any combination of them), margins, padding, text and image. The cells are auto sized to fit their contents. You can change the contents of a cell by using its Text and Bitmap properties. The Margins and the Padding properties control the offset of the cell border from the grid border and the offset of the cell content from the cell border, respectively. There are scenarios in which you will want a cell to occupy several rows and columns. In such cases you can take advantage of the RowSpan and ColumnSpan properties thus specifying how many rows and columns the cell must occupy. When creating a table shape you should initialize it with the proper number of cells using the InitTable method. You can also add or insert rows to the table later by using the InsertRowAt method.  

    Besides cells, the table shape has a columns collection, too. Each column is auto sized by default, but if you set SizeMode to Fixed, and specify a value for the Width property, the column will be as wide as the value specified. The table shape provides some global properties for controlling the appearance of all of its cells. Such properties are: 

    • CellMargins and CellPadding - set the margins and the padding properties of all cells in the table to the specified values
    • GridVisible - determines whether to render the grid in which the cells are placed or not
    • PortDistributionMode - determines the way the ports are distributed along the table shape. The possible choices are shape based, grid based and cell based distribution
     Usage

    Let’s see how easy it is to create the shape presented in the previous chapter: 

    1. Create an instance of the NTableShape class, add it to the drawing document and initialize it with the proper number of cells (in our case 3 x 3 cells are needed):

      C#
      Copy Code
      NTableShape shape = new NTableShape(400, 400, 100, 100);
      nDrawingDocument1.ActiveLayer.AddChild(shape);
      shape.InitTable(3, 3);
      
      Visual Basic
      Copy Code
      Dim shape As NTableShape  = New NTableShape(400, 400, 100, 100)
      nDrawingDocument1.ActiveLayer.AddChild(shape)
      shape.InitTable(3, 3)
      
    2. Start the table shape update process by calling the BeginUpdate method.

      Important: always call this method when you need to change more than one property of the table and its cells because it will suppress the auto sizing of the table until the EndUpdate method is called and thus you will experience a significant performance gain:

      C#
      Copy Code
      shape.BeginUpdate();
      
      Visual Basic
      Copy Code
      shape.BeginUpdate();
      
    3. Write some code to set the text of the cells. You access a cell by specifying its column and row index to the indexer of the table shape object:

      C#
      Copy Code
      int i, j;
      int rowCount = shape.RowCount;
      int columnCount = shape.ColumnCount;
      for (i = 0; i < rowCount; i++)
      {
          for (j = 0; j < columnCount; j++)
          {
              shape[j, i].Text = string.Format("Cell {0}", i * columnCount + j + 1);
          }
      }
      
      Visual Baisc
      Copy Code
      Dim i As Integer
      Dim j As Integer
      Dim rowCount As Integer = shape.RowCount
      Dim columnCount As Integer = shape.ColumnCount
      For i As Integer = 0 To rowCount - 1 Step 1
          For j As Integer = 0 To columnCount - 1 Step 1
              shape(j, i).Text = String.Format("Cell {0}", i * columnCount + j + 1)
          Next
      Next
      
    4. Create a style sheet  for Cell 4 and make it span 2 rows and 2 columns:

      C#
      Copy Code
      NStyleSheet style1 = new NStyleSheet("style1");
      NStyle.SetFillStyle(style1, new NGradientFillStyle(GradientStyle.Horizontal, GradientVariant.Variant3, Color.FromArgb(192, 194, 194), Color.FromArgb(129, 133, 133)));
      NStyle.SetStrokeStyle(style1, new NStrokeStyle(1, Color.FromArgb(68, 90, 108)));
      NStyle.SetTextStyle(style1, new NTextStyle(new Font("Verdana", 14, FontStyle.Italic), Color.White));
      nDrawingDocument1.StyleSheets.AddChild(style1);
      
      shape[0, 1].StyleSheetName = "style1";
      shape[0, 1].ColumnSpan = 2;
      shape[0, 1].RowSpan = 2;
      
      Visual Basic
      Copy Code
      Dim style1 As NStyleSheet = New NStyleSheet("style1")
      NStyle.SetFillStyle(style1, New NGradientFillStyle(GradientStyle.Horizontal, GradientVariant.Variant3, Color.FromArgb(192, 194, 194), Color.FromArgb(129, 133, 133)))
      NStyle.SetStrokeStyle(style1, New NStrokeStyle(1, Color.FromArgb(68, 90, 108)))
      NStyle.SetTextStyle(style1, New NTextStyle(New Font("Verdana", 14, FontStyle.Italic), Color.White))
      nDrawingDocument1.StyleSheets.AddChild(style1)
      
      shape(0, 1).StyleSheetName = "style1"
      shape(0, 1).ColumnSpan = 2
      shape(0, 1).RowSpan = 2
      
    5. Set the image, the margins, the padding and the borders of Cell 9:

      C#
      Copy Code
      shape[2, 1].Text = string.Empty;
      shape[2, 1].Bitmap = new Bitmap(@"D:\car.jpg");
      shape[2, 1].Borders = TableCellBorder.All;
      shape[2, 1].Margins = new Nevron.Diagram.NMargins(10);
      shape[2, 1].Padding = new Nevron.Diagram.NMargins(10);
      
      Visual Basic
      Copy Code
      shape(2, 1).Text = String.Empty
      shape(2, 1).Bitmap = New Bitmap(@"D:\car.jpg")
      shape(2, 1).Borders = TableCellBorder.All
      shape(2, 1).Margins = New Nevron.Diagram.NMargins(10)
      shape(2, 1).Padding = New Nevron.Diagram.NMargins(10)
      
    6. Finally, do not forget to call the EndUpdate method which will resume the table shape autosizing feature and will also immediately resize the table shape to fit its contents:
       
      C#
      Copy Code
      shape.EndUpdate();
      
      Visual Basic
      Copy Code
      shape.EndUpdate()