Atölye › Missile Command Tarzı Savunma › 5/35. adım

Enkaz

Ne yapıyoruz

Çizim artık şehir kartlarına baksın. Ayaktaki şehir yine uzun mavi bir blok; yıkılmış şehir ise yere yapışmış, basık gri bir enkaz olsun. Aynı döngü ikisini de çizecek; yalnız renk ve boy alive'a göre seçilecek.

```js
for (const c of cities) {
  ctx.fillStyle = c.alive ? '#38bdf8' : '#44403c'
  ctx.fillRect(c.x - 16, GROUND - (c.alive ? 14 : 4), 32, c.alive ? 14 : 4)
}
```

Ne işe yarıyor

for (const c of cities) → artık sayıları değil şehir kartlarını geziyoruz; c.x şehrin ortası.
c.alive ? '#38bdf8' : '#44403c' → kısa bir "eğer": "soru ? evetse şu : değilse bu". Ayaktaysa mavi, değilse koyu gri.
c.alive ? 14 : 4 → boy: ayaktaysa 14, yıkıksa 4 piksel.
GROUND - (c.alive ? 14 : 4) → bloğun üstü; iki durumda da blok zeminde durur.

Sıra sende

draw içinde şehirleri çizen kısmı (ctx.fillStyle = '#38bdf8' satırı ve altındaki for döngüsü) sil; yerine yeni döngüyü yaz. Çalıştır: ekran aynı görünmeli (henüz hiçbir şehir yıkılmadı).

Beceriler: Canvas üzerine çizim

← Yıkılabilen şehirler Bir noktaya doğru ilerle →

Tüm adımlar