Hot-Link Menu in Right-Side Column

Last Updated 6-30-2010

  • More Computers
  • More Games
  • More Electronics
  • More Books
  • More Software
  • Visual Basic Multi-Dimensional Arrays

    Earlier on this page, we used parallel arrays with a common index. That method is bulky and awkward at best. In their infinite wisdom, the developers of Visual Basic anticipated this circumstance and allowed for multidimensional arrays. For this example, we will use a two-dimensional array for rows and columns, but the concept extends to 32 dimensions.

    To demonstrate the concept of two-dimensional arrays we will create a 4 x 4 Two Dimensional Array with contents as indicated in diagram below:

    Row\Col 0 1 2 3
    0 0 1 2 3
    1 4 5 6 7
    2 8 9 10 11
    3 12 13 14 15

    Figure Array-27: 2 Array Table of Data

    One way to display a two-dimensional array, is by using the DataGridView Control. Create a new project in Visual Basic, and call it something like TwoDimensionalArray. Drag a DataGridView from the Visual Basic Toolbox onto the blank form as indicated in the diagram below:

    Select Data Grid

    Figure Array-28: Visual Basic Select Data Grid View

    Buy from Centurion

    Once you place it on the form change the size in the Visual Basic Properties Window to about 450 x 125 as indicated in the diagram below:

    Set Data Grid Size

    Figure Array-29: Visual Basic Set Data Grid View Size

    There are several properties that can allow you to precisely set the size of the Data Grid Data elements, but for now we will just approximate the size to expedite completing the two-dimensional array example. We will use the default name of DataGridView1, since it is the only control on our form. When you have finished setting the size property, your design form should look like the diagram below:

    Data Grid Design View

    Figure Array-30: Visual Basic Data Grid Design View

    Help Support this site - Click this ad

    Double click on an area of the form not covered by the Visual Basic DataGridView control to bring up the Visual Basic Source Code Window. This will create the Form1_Load subroutine that will execute our code without having to program buttons to display the data. We will model our Visual Basic DataGridView after an Excel spreadsheet. Enter the code displayed below into the Form1_Load subroutine:

    Public Class Form1
        Private Sub Form1_Load(ByVal sender As System.Object, _ 
    		ByVal e As System.EventArgs) Handles MyBase.Load
            Const NumberOfColumns As Integer = 4
            Const NumberOfRows As Integer = 4
            Dim ColumnNumber As Integer
            Dim RowNumber As Integer
            Dim A As Integer = Asc("A")
            Dim Array2D(NumberOfRows, NumberOfColumns) As Integer
            DataGridView1.ColumnCount = NumberOfColumns
            DataGridView1.RowCount = NumberOfRows
            'Make the headers
            For RowNumber = 0 To NumberOfRows - 1
                DataGridView1.Rows.Item(RowNumber).HeaderCell.Value = _
    		(RowNumber + 1).ToString
            For ColumnNumber = 0 To NumberOfColumns - 1
                DataGridView1.Columns.Item(ColumnNumber).HeaderCell.Value = _
    			Chr(A + ColumnNumber).ToString
                DataGridView1.Columns.Item(ColumnNumber).HeaderCell.Style.Alignment = _
            'Fill the Array
            For RowNumber = 0 To NumberOfRows - 1
                For ColumnNumber = 0 To NumberOfColumns - 1
                    Array2D(RowNumber, ColumnNumber) = _
    			RowNumber * NumberOfColumns + ColumnNumber
            'Fill the Data Grid
            For RowNumber = 0 To NumberOfRows - 1
                For ColumnNumber = 0 To NumberOfColumns - 1
                    DataGridView1.Item(ColumnNumber, RowNumber).Value = _ 
    			Array2D(RowNumber, ColumnNumber)
                    DataGridView1.Item(ColumnNumber, RowNumber).Style.Alignment = _
        End Sub
    End Class

    Figure Array-31: Visual Basic Form_Load Source Code for 2-Dimensional Array

    Help Support this site - Click this ad

    Since there are several new concepts introduced in this code, we should probably comment on those now, so we understand how the program functions:

    • Const NumberOfColumns As Integer = 4: Sets the current maximum size of columns to 4.
      • Const declares a value that cannot be changed after the initial declaration.

    • Const NumberOfRows As Integer = 4: Sets the current maximum size of rows to 4.

    • Dim ColumnNumber As Integer: Index to step through the Columns in our array.

    • Dim RowNumber As Integer: Index to step through the Rows in our array.

    • Dim A As Integer = Asc("A"): The variable A has the Ascii equivalent of the letter A
      • This will allow us to count: A, B, C, D instead of 1, 2, 3, 4

    • Dim Array2D(NumberOfRows, NumberOfColumns) As Integer: Declaring our 4 x 4 two-dimensional Array.

    • DataGridView1.ColumnCount= NumberOfColumns: Sets the number of columns(width) of our data display.

    • DataGridView1.RowCount=NumberOfRows: Sets the number of Rows(length) of our data display.

    • Help Support this site - Click this ad

    • The next 2 For Loops place names in the Header Cells.

    • For RowNumber=0 to NumberOfRows-1: Index through every Vertical Element

    • DataGridView1.Rows.Item(RowNumber).HeaderCell.Value=(RowNumber+1).ToString:
      • DataGridView1:Tell Visual Basic we are referring to the only control in our program.
      • .Rows: Tell Visual Basic we are referring to a vertical element on the control.
      • .Item(RowNumber): Tell Visual Basic which Row we want to access.
        • 0 is at the top, the highest number is at the bottom.
      • .HeaderCell: We want to modify the Header or description of the row.
      • .Value: This refers to the text we see on the screen.
      • =(RowNumber+1): Excel starts numbering its rows with 1 not 0.
        • 1 is the correction factor (offset).
      • .ToString: The headers can only have strings, or else Visual Basic gets unhappy.

    • For ColumnNumber=0 to NumberOfColumns-1: Index through every Horizontal Element.

    • DataGridView.Columns.Item(ColumnNumber).HeaderCell.Value=Chr(A+ColumnNumber).ToString.
      • DataGridView1: Tell Visual Basic the reference for this command is the 1 control we have in the program.
      • .Columns: Tell Visual Basic we are referring to a horizontal element on the control.
      • .Item(ColumnNumber): Tell Visual Basic which Column we want to access.
        • 0 is at the left, the highest number is at the right.
      • .HeaderCell This means we are going to modify one of the headers at the top of the control.
      • .Value: This refers to the text we see on the screen.
      • =Chr(A+ColumnNumber): chr means we are going to count letters instead of numbers like Excel does.
      • .ToString: The header must contain a string - numbers or single letters won't fly.

    • The following For Loop fills the Array with values from Fig Array-27:

    • For RowNumber = 0 to NumberOfRows-1: Index through every Vertical Element.

    • For ColumnNumber = 0 to NumberOfColumns-1: Index through each Horizontal Element of every row.
    • Array2D(RowNumber, ColumnNumber)=RowNumber*NumberOfColumns+ColumnNumber:
      • Adds 1 through each pass.
      • Places the value in the correct two-dimensional Array element.

      Help Support this site - Click this ad

    • The following For Loop transfers the data from the Array to the Data Grid.

    • For RowNumber=0 to NumberOfRows-1: Index through every vertical element in the table.
    • For ColumnNumber=0 to NumberOfColumns-1: Index through each horizontal element of every row.
    • DataGridView1.Item(ColumnNumber, RowNumber).Value=Array2D(RowNumber, ColumnNumber):
      • DataGridView1: Reference the Data Grid Control.
      • .Item(ColumnNumber, RowNumber): Select a cell on the Data Grid control.
      • .Value=: Update the data in the cell in the Data Grid control.
      • Array2D(RowNumber, ColumnNumber): Select the proper Data Element from the array.
        • Notice Row and Column order switched between Array and Data Grid control.
        • The computer will keep the data in the correct order and make the correct transformation.

    • DataGridView1.Item(ColumnNumber, RowNumber).Style.Alignment=DataGridViewContentAlignment.MiddleCenter:
      • DataGridView1:The Data Grid control.
      • .Item(ColumnNumber, RowNumber): Same data cell we wrote the data to.
      • .Style: Defines the text style attribute used in the data cell.
      • .Alignnment=: The text attribute that will be changed is the text alignment in the data cell.
      • DataGridViewContentAlignment: How Visual Basic refers to the cell's text alignment attribute.
      • .MiddleCenter: Align the text in the middle center of the cell.
        • Because I think middle center alignment looks better.

    Looks like it's time to take this puppy out for a test spin, and see what we get. Press the Green Triangle to run the program and see what it looks like... When I run it, I get the output as shown in the diagram below:

    Data Grid at Runtime

    Figure Array-32: Visual Basic DataGridView at RunTime

    Not too shabby. You can move the cursor around and change the values on the screen, although without the proper event routines, the actual data isn't updated, the screen just changes.

    In the next section we talk about the Length and Sort methods of the array class. To demonstrate these characteristics we work with the DataGridView controls a little more to gain some more familiarity with them. In order to continue this guide and work with Visual Basic Array Methods, press the Button Below:

    Help Support this site - Click this ad


    Visual Basic

    Introduction to VB.NET

    .NET Framework

    VS2008 IDE

    How VB is Compiled

    Start Visual Studio

    Windows Form App

    Save Your Work

    VB OOP Programming

    Visual Basic Code

    Exit Code

    Button Event Code

    Coding Recommendations


    Error List Window

    Comment Syntax

    Help Window

    Language Essentianl

    Built-In Data Types

    Declare Variables

    Declare Constants

    Code Arithmetic Expressions

    Assignment Statements

    Operator Precedence

    Type Casting

    Math Class

    String Declaration

    Conversion Functions

    Conversion Methods

    Formatting Functions

    String Formatting

    Variable Scope


    Nullable Types

    Loop Constructs

    For Next Loop

    Do While Loop

    Do Until Loop



    Exit Do | Exit For


    Nested Loops


    Array Declaration

    Rnd( ) Function

    Listbox Control


    Parallel Arrays

    Key Event Args

    Dynamic Arrays

    Redimension Array

    Set Breakpoint

    Start Debugger

    ReDim Preserve

    MultiDimensional Arrays

    DataGridView Control

    Length and Sort Methods


    Pad Right

    Split Method

    IsNumeric Function

    Multiform Projects

    Add Form To Project

    Form Object Methods

    Form Show Method

    ShowDialog Method

    Form Close Method

    Form Accept Button

    Multiform Project Example

    ASP.NET Web Programming

    Create Data Source

    Configure Access Data Source

    Add Product Class

    Extract Local Database Data

    Order PageLoad VB Code

    Add New Web Page

    Set Start Page

    Display Cart Aspx Code

    Display Cart Design View

    Sorted List Definition

    VB.NET Session State

    Create CartItem Class

    GetCartContents Function

    Add To Cart Event Handler

    Remove Cart Item Event

    Clear Cart Event Handler