Atölye › Adam Asmaca › 33/36. adım
Son satırda sadece 8 tuş var ve sola yaslı duruyor. Her satırı ortalayalım: satırın sol kenarını, o satırda kaç tuş olduğuna göre hesaplayacağız.
Hesap basit: tuşların toplam genişliğini tuvalin eninden çıkar, kalan boşluğu ikiye böl; yarısı sola, yarısı sağa.
```js
// The on-screen keyboard: rows of 9 keys, centered.
function keyRect(i) {
const row = Math.floor(i / 9)
const inRow = row === 2 ? 8 : 9
const left = (canvas.width - inRow * (KEY_W + 4) + 4) / 2
return { x: left + (i % 9) * (KEY_W + 4), y: KEYS_Y + row * (KEY_H + 6) }
}
```const inRow = row === 2 ? 8 : 9 → bu satırdaki tuş sayısı: üçüncü satırsa (row 2) 8, değilse 9.inRow * (KEY_W + 4) - 4 piksel tutar (son tuştan sonra boşluk yok, o yüzden
- 4).canvas.width - ... → tuvalde artan yer. / 2 → ikiye böl: sol kenar.- (... - 4) yerine + 4 yazılı; ikisi aynı şey.return satırında 8 + yerine artık left +.function keyRect(i) { satırının üstüne yorum satırını yaz.const row = ... satırının altına inRow ve left satırlarını yaz.return satırındaki 8 + kısmını left + yap.Beceriler: Canvas üzerine çizim
← Tuşları çiz Hatırlayan tuşlar →