Book Image

Learning Dart, Second Edition - Second Edition

By : Ivo Balbaert
Book Image

Learning Dart, Second Edition - Second Edition

By: Ivo Balbaert

Overview of this book

Table of Contents (18 chapters)
Learning Dart Second Edition
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Preface
Index

Spiral 1 – drawing the board


The app starts with main() in educ_memory_game.dart:

library memory;

import 'dart:html';

part 'board.dart';

void main() {
  // Get a reference to the canvas.
  CanvasElement canvas = querySelector('#canvas');          (1)
  new Board(canvas);                                        (2)
}

Note

For the code files of this section refer to Chapter 7\code\educ_memory_game\spirals\s01 in the code bundle.

As we did in Chapter 5, Handling DOM in a New Way, we'll draw a board on a canvas element. So, we need a reference that is given in line (1). The Board view is represented in code as its own Board class in the board.dart file. Since everything happens on this board, we construct its object with canvas as an argument (line (2)). Our game board will be periodically drawn as a rectangle in line (4) by using the animationFrame method from the Window class in line (3):

part of memory;

class Board {

  CanvasElement canvas;
  CanvasRenderingContext2D context;
  num width,...