Session 08 (08.12.23)

In der achten Session widmen wir uns dem Problem, dass das komplette Neuzeichnen des Canvas ineffizient ist und bei vollerem Spielbild ein Flackern erzeugt. Wir speichern dafür die Bitmap des vorherigen States und zeichnen nur die Unterschiede neu. Außerdem schreiben wir eine Funktion die uns das nächste Tetromino ausgibt.

Ziele

• Differenzbitmap erzeugen
• Hintergrund und Differenzbitmap zeichnen
• Funktion für nächsten Tetromino

Differenzbitmap erzeugen

class Renderer {
public:
    var p_bitmap;
    
    ...
    
    function render(playfield, score, lines, level) {
        var bitmap_diff = [];
        if this.p_bitmap == null then {
            bitmap_diff = playfield.bitmap;
        }
        else {
            for var row in 0:playfield.bitmap.size() do {
                var diff_row = [];
                for var column in 0:playfield.bitmap[row].size() do {
                    if playfield.bitmap[row][column] != this.p_bitmap[row][column] then {
                        if playfield.bitmap[row][column] == 0 then diff_row.push(" ");
                        else diff_row.push(playfield.bitmap[row][column]);
                    }
                    else diff_row.push(0);
                }
                bitmap_diff.push(diff_row);
            }
        }
        this.p_bitmap = deepcopy(playfield.bitmap);
    
        this.draw_playfield(bitmap_diff);
    }
}

Hintergrund und Differenzbitmap zeichnen

class Renderer {

    ...
    
    function draw_playfield(bitmap){
		for var column in 0:bitmap.size() do
			for var row in 0:bitmap[column].size() do {
				if (bitmap[column][row] == " ") then this.draw_background(column, row);
				else if (bitmap[column][row] != 0) then this.draw_block(column, row, bitmap[column][row]);
			}
	}
	
	function draw_background(column, row){
		canvas.setFillColor(0, 0, 0);
		canvas.fillRect(row * block_size, column * block_size, block_size, block_size);
	}
}

Funktion für nächsten Tetromino

class TetrominoPool{
	public:
	var pool = [];

	constructor(){
		this.fill_pool();
	}
	function fill_pool(){ ... }

	function get(){
		var tetromino = this.pool.pop();
		if this.pool.size() == 0 then this.fill_pool();
		return tetromino;
	}

	function next(){
		return this.pool[this.pool.size()-1];
	}
}