Квадрат на сетке

🔍 Сначала разберёмся: клетки и пиксели

Экран измеряется в пикселях — крошечных точках. Но думать об игре в пикселях неудобно. Поэтому мы делим поле на клетки, как тетрадь в клеточку. Одна клетка у нас 20 пикселей:

CELL = 20          # размер одной клетки
COLS = 30          # 30 клеток в ширину
ROWS = 20          # 20 клеток в высоту

Змейка «думает» в клетках: квадрат стоит в клетке (5, 10) — это колонка 5, строка 10. А рисовать надо в пикселях. Чтобы перевести клетку в пиксели — умножаем на размер клетки:

📝 Код урока (только новое)

# Координаты квадрата В КЛЕТКАХ (не в пикселях!)
x = 5
y = 10

while True:
    # ... события и screen.fill(BLACK) как в уроке 1 ...

    # Превращаем клетки в пиксели: умножаем на размер клетки
    rect = pygame.Rect(x * CELL, y * CELL, CELL, CELL)
    pygame.draw.rect(screen, GREEN, rect)

    pygame.display.flip()
    clock.tick(60)

🔍 Что такое Rect

Rect (от английского rectangle — прямоугольник) — это рамка, которая говорит pygame где и какого размера нарисовать квадрат. У неё ровно четыре числа:

pygame.Rect(  x,        y,        ширина,  высота )
pygame.Rect( x*CELL,   y*CELL,   CELL,    CELL  )

А рисует квадрат уже следующая строка:

pygame.draw.rect(screen, GREEN, rect)
#            куда     цвет   рамка