links to this page:    Morphic for beginners TableLayoutExample with 100 squares

  | container cellLength fontSize cell s |
  cellLength := 40.
  fontSize := 9.  
  container := Morph new.
  container width: 10 * cellLength.
  container height: 10 * cellLength.
 
  container layoutPolicy: TableLayout new.
  container listDirection: #leftToRight.
  container wrapCentering: #topLeft.
  container wrapDirection: #topToBottom.
 
  
  1 to: 100 do:  [:i |  cell := Morph new. 
                    cell height: cellLength. 
                    cell color: {Color red . Color black. Color white} atRandom.
                    cell width: cellLength. 
                    cell borderWidth: 1.
                    cell layoutPolicy: TableLayout new.
                    cell  listDirection: #leftToRight.
                    cell listCentering: #center.
                    cell minCellSize: cell extent.
                    s := StringMorph contents: i printString font: (StrikeFont familyName: 'Bitmap DejaVu Sans' size: fontSize).
                    cell addMorph: s.
                    container addMorphBack: cell
                  ].
 
  container openInWorld.

"http://wiki.squeak.org/squeak/2325"

| container cellLength cellInsetValue fontSize cell s |
  cellLength := 50.
  fontSize := 24.  
  cellInsetValue := 15.
  container := Morph new.
  container color: Color black.
  container width: (10 * (cellLength + cellInsetValue)).
  container height: (10 * (cellLength +  cellInsetValue)).
 
  container layoutPolicy: TableLayout new.
  container listDirection: #leftToRight.
  container wrapCentering: #topLeft.
  container wrapDirection: #topToBottom.
  container cellInset: cellInsetValue.
 
  
  1 to: 100 do:  [:i |  cell := BorderedMorph new.
	            cell useRoundedCorners. 
                    cell height: cellLength. 
                    (i <= 100) ifTrue: [cell color: Color red].
                    (i <= 80) ifTrue: [cell color: Color gray twiceLighter].
                    (i <= 60) ifTrue: [cell color: Color gray twiceLighter twiceLighter twiceLighter].
                    (i <= 40) ifTrue: [cell color: Color red twiceLighter].
                    (i <= 20) ifTrue: [cell color: Color gray twiceLighter].
                    cell width: cellLength. 
                    cell borderWidth: 1.
                    cell layoutPolicy: TableLayout new.
                    cell  listDirection: #leftToRight.
                    cell listCentering: #center.
                    cell minCellSize: cell extent.
                    s := StringMorph contents: i printString font: (StrikeFont familyName: 'Bitmap DejaVu Sans' size: fontSize).
                    cell addMorph: s.
                    container addMorphBack: cell
                  ].
 
  container openInWorld.