Kodmatik Murat BEKLER | Donanıma can veren ruh, yazılımdır.
HTML5 te en çok hoşunuza gidecek olan da bence budur. Yazı boyutunu ve stilini en kolay yönden yapabileceksiniz.
HTML5 gelen bir çok yenilikle hayallerinizi zorlamanızı tavsiye ederim sadece yapmak isteyebileceklerinizi düşünün. Çok fazla lafı uzatmadan konumuza geri döneyim.
HTML5 Canvas kullanarak metin çizmek için, font özelliğini ve tuval bağlamında fillText () yöntemini kullanabilirsiniz.
HTML5 Canvas metnin yazı tipini, boyutunu ve stilini ayarlamak için, boşluklarla ayrılmış yazı stilini, boyutunu ve ailesini içeren bir dizeye tuval bağlamda yazı özelliğini ayarlayabilirsiniz. Stil, normal italik veya kalın olabilir. aksi belirtilmediği sürece, yazı tipi stili normal varsayılan edilir.
Yazı tipi özelliği ayarlandıktan sonra, biz bir dize ve bir x ve y konumunu gerektirir fillText () yöntemi ile metin çizebilirsiniz.
Örnek:
<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="yazi" width="578" height="200"></canvas>
<script>
var canvas = document.getElementById('yazi');
var context = canvas.getContext('2d');
context.font = 'italic 40pt Calibri';
context.fillText('Merhaba Uzaylı!', 150, 100);
</script>
</body>
</html>
Kodumuzu çalıştırdığımızda aşağıdaki ekran görüntüsünü alacaksınız. 🙂
Önizleme:
