Atölye › Ritim Şeritleri › 14/35. adım
Oyunu ilk kez açan biri hangi tuşun hangi şeride gittiğini bilemez. Her şeridin altına, vuruş çizgisinin biraz aşağısına kendi harfini yazacağız: D F J K.
Canvas'a yazı da tıpkı kare gibi çizilir: önce kalemi ayarla (renk, hiza, yazı tipi), sonra yaz.
```js
ctx.fillStyle = 'white'
ctx.textAlign = 'center'
ctx.font = 'bold 14px sans-serif'
;['D', 'F', 'J', 'K'].forEach((k, lane) => ctx.fillText(k, LEFT + lane * LANE_W + LANE_W / 2, HIT_Y + 40))
```ctx.fillStyle = 'white' → yazı beyaz.ctx.textAlign = 'center' → yazıyı verdiğin x'e ortalar.ctx.font = 'bold 14px sans-serif' → kalın, 14 piksel boyunda, düz bir yazı tipi.['D', 'F', 'J', 'K'].forEach((k, lane) => ...) → dört harflik bir dizi; forEach her harf için bir kez çalışır:
k harf, lane sırası (0...3).ctx.fillText(k, LEFT + lane * LANE_W + LANE_W / 2, HIT_Y + 40) → harfi, şeridin ortasına
(LANE_W / 2 = 35 piksel içeri), çizginin 40 piksel altına yazar.; neden var? Satır [ ile başlıyor. Üstteki satırın sonunda noktalı virgül olmadığı için JavaScript bu
satırı öncekinin devamı sanardı (...'bold 14px sans-serif'[...]). Başa konan ; "yeni bir cümle başlıyor"
der.draw içinde, nota döngüsünün kapanan }'sinin altında bir boş satır bırak ve dört satırı yaz; fonksiyonun son
}'si altta kalsın. Çalıştır: her şeridin altında harfi görünmeli.
Beceriler: Canvas üzerine çizim
← Şeritlere tuşlar En yakın notaya vur →