Atölye › Adam Asmaca › 6/36. adım
Seçim çalışıyor mu, görelim: kelimeyi tuvale yazacağız. Evet, gizli kelimeyi açıkça göstereceğiz, ama sadece bu adımda; bir sonraki adımda onu boşluklarla gizleyeceğiz.
Yazı yazmak da çizim gibidir: önce hizayı, yazı tipini ve rengi seç, sonra yaz.
```js
function draw() {
ctx.fillStyle = '#fefce8'
ctx.fillRect(0, 0, canvas.width, canvas.height)
ctx.textAlign = 'center'
ctx.font = 'bold 32px monospace'
ctx.fillStyle = '#1f2937'
ctx.fillText(word, canvas.width / 2, 340)
}
```ctx.textAlign = 'center' → yazının ortası verilen noktaya gelir. Böylece kısa kelime de uzun kelime de
ortalı durur.ctx.font = 'bold 32px monospace' → yazı tipi: kalın (bold), 32 piksel boyunda, monospace. Monospace
yazı tipinde her karakter aynı eni kaplar; birazdan harfler ve çizgiler bu sayede hizalı duracak.ctx.fillStyle = '#1f2937' → koyu gri yazı rengi.ctx.fillText(word, canvas.width / 2, 340) → word'ün içindeki yazıyı yazar. canvas.width / 2 → tuvalin
yatay ortası (/ bölme: 480 / 2 = 240). 340 → yukarıdan 340 piksel aşağı.draw fonksiyonunun içinde, ctx.fillRect(...) satırının altına bir boş satır bırak ve dört yazı satırını yaz
(kapanan }'den önce). Çalıştır'a birkaç kez bas: her seferinde başka bir kelime görebilirsin.
Beceriler: Canvas üzerine çizim
← Rastgele bir kelime seç Boşluklarla gizle →