Atölye › Hafıza Kartları › 11/25. adım
Açık bir kart nasıl görünecek? Beyaz bir kare ve ortasında meyvesi. Kapalı kart ise eskisi gibi mor.
Her kart için "açık mı?" diye soracağız ve cevaba göre iki yoldan birini seçeceğiz: if (eğer) ... else (değilse).
Kartlar henüz kapalı başladığı için ekran aynı görünecek; denemesi aşağıda.
```js
ctx.textBaseline = 'middle'
ctx.font = '44px sans-serif'
ctx.textAlign = 'center'
for (const card of cards) {
const x = cardX(card)
const y = cardY(card)
if (card.faceUp) {
ctx.fillStyle = '#f8fafc'
ctx.fillRect(x, y, CARD, CARD)
ctx.fillText(card.symbol, x + CARD / 2, y + CARD / 2)
} else {
ctx.fillStyle = '#6366f1'
ctx.fillRect(x, y, CARD, CARD)
}
}
```ctx.textBaseline = 'middle' ve ctx.textAlign = 'center' → verilen nokta yazının tam ortası olsun (dikeyde ve
yatayda).ctx.font = '44px sans-serif' → 44 piksel boyunda yazı: meyveler büyük görünsün.if (card.faceUp) { ... } else { ... } → koşul: kart açıksa ilk bloğu, değilse else bloğunu çalıştır.ctx.fillStyle = '#f8fafc' → neredeyse beyaz: kartın ön yüzü.ctx.fillText(card.symbol, x + CARD / 2, y + CARD / 2) → meyveyi kartın ortasına yaz. / bölme: CARD / 2
kartın yarısı (42.5).else bloğu eski iki satır: kapalı kart mor.draw içindeki kart döngüsünün üstüne üç ctx satırını yaz.if ... else yapısına al: if (card.faceUp) { ile başla, beyaz kare ve meyveyi
yaz, } else { de, iki mor satırı içeri al, } ile kapat.Beceriler: Canvas üzerine çizim, Oyun durumları
← Durmadan çiz Adil bir karıştırma →