Session 09 (15.12.23) - RUB-INI-Theory-of-Machine-Learning/Info1_WS23-24 GitHub Wiki
In der neunten Session zeigen wir die das Level, die Punkte, die Lines, sowie den nächsten Tetromino an.
Ziele
- Rahmen erweitern um Informationen anzuzeigen
- Punkte, Level und Lines anzeigen
- Nächsten Tetromino anzeigen
Rahmen erweitern um Informationen anzuzeigen
class Renderer {
public:
var sidebar_size = 7;
...
constructor(width, height){
this.width = width;
this.height = height;
this.block_size = math.floor(math.min(
canvas.height()/(playfield_size["y"]+2),
canvas.width()/(playfield_size["x"]+2 + this.sidebar_size)
));
# We define the outline to be 1/8 of the block size
this.outline_size = this.block_size/8;
# set background color of the canvas once
canvas.setFillColor(0, 0, 0);
canvas.clear();
# draw sidebar once
for var column in 0:this.sidebar_size do {
for var row in 0:height+2 do {
if (row == 0 or row == height+1 or column == this.sidebar_size-1) then
this.draw_block(row, column + width + 1, "f");
}
}
# Headings for the standings
canvas.setFillColor(1,1,1);
canvas.setFont("Comic Sans MS", block_size);
canvas.text(block_size * (this.width+3), 2* block_size, "Score");
canvas.text(block_size * (this.width+3), 5* block_size, "Lines");
canvas.text(block_size * (this.width+3), 8* block_size, "Level");
}
}
Punkte, Level und Lines anzeigen
function draw_text(text, row){
canvas.setFillColor(0,0,0);
canvas.fillRect(block_size * (this.width + 3) , row * block_size -1, 4 * block_size, 2 * block_size);
canvas.setFillColor(1,1,1);
canvas.text(block_size * (this.width + 3), row * block_size, text);
}
class Renderer {
public:
var p_bitmap, p_score, p_level, p_lines;
...
function render(playfield, score, lines, level) {
...
if score != this.p_score then {
this.p_score = score;
this.draw_text(score, 3);
}
if lines != this.p_lines then {
this.p_lines = lines;
this.draw_text(lines, 6);
}
if level != this.p_level then {
this.p_level = level;
this.draw_text(level, 9);
}
}
}
Nächsten Tetromino anzeigen
function draw_next_tetromino(bitmap){
canvas.setFillColor(0,0,0);
canvas.fillRect(block_size * (this.width + 2.5) , 16 * block_size, 4 * block_size, 4 * block_size);
for var column in 0:bitmap.size() do
for var row in 0:bitmap[column].size() do {
if (bitmap[column][row] != 0) then this.draw_block(
column + 16,
row + 2.5 + this.width,
bitmap[column][row]
);
}
}
class Renderer {
public:
var p_tetromino;
...
function render(playfield, score, lines, level, next_tetromino) {
...
if next_tetromino != this.p_tetromino then {
this.p_tetromino = next_tetromino;
this.draw_next_tetromino(Tetromino.tetrominos[next_tetromino][0]);
}
}
}
Bei jedem Aufruf des Renderers müssen jetzt natürlich die entsprechenden Parameter übergeben werden:
renderer.render(playfield, score, lines, level, pool.next());
Der Renderer wird in allen Eventhandlern aufgerufen.