Lua Academy · Ders

Şekil ve Görüntü Çizme

Grafikleri ekranda görüntüleyin.

Şekil ve Görüntü Çizme, CoddyKit'te ücretsiz bir Lua Academy dersidir. Bu, 4 dersinin 2. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Lua Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Lua Academy kursu toplamda 4 dersten oluşur.

love.graphics Modülü

LÖVE içindeki tüm görüntüleme işlemleri love.graphics üzerinden gerçekleşir. İşlevlerini love.draw içinde çağırırsınız; geri çağırma işlevi döndüğünde motor kareyi görüntüler.

Temel şekilleri, görüntüleri, metinleri ve çizgileri çizebilir; ayrıca renkleri ve dönüşümleri yönetebilir. Her karede her şey baştan çizilir.

Dikdörtgen Çizme

love.graphics.rectangle, önce bir kip, ardından konum ve boyut alır. Kip, katı bir şekil için 'fill' veya yalnızca dış çizgi için 'line' olabilir.

Koordinatlar pencerenin sol üst köşesinden başlar; x sağa, y ise aşağıya doğru artar.

function love.draw()
  love.graphics.rectangle('fill', 50, 50, 120, 80)
  love.graphics.rectangle('line', 200, 50, 120, 80)
end

Çemberler ve Elipsler

love.graphics.circle(mode, x, y, radius), merkezi x, y konumunda olan bir çember çizer. Dikdörtgenlerde olduğu gibi 'fill' veya 'line' kabul eder.

Oval şekiller için yatay ve dikey yarıçapları ayrı olan love.graphics.ellipse işlevini kullanın. Yumuşaklığı denetlemek için ek bir segment bağımsız değişkeni aktarabilirsiniz.

function love.draw()
  love.graphics.circle('fill', 150, 150, 40)
  love.graphics.ellipse('line', 300, 150, 60, 30)
end

Renkleri Ayarlama

love.graphics.setColor, bundan sonra çizilecek her şeyin renk tonunu ayarlar. Güncel LÖVE sürümlerinde bileşenler 0 ile 1 arasında değer alır; bu nedenle beyaz renk 1, 1, 1 şeklindedir.

Renk duruma bağlıdır: ayarlandıktan sonra yeniden değiştirene kadar sonraki tüm çizimlere uygulanır. Renk tonunun değişmesini istemediğiniz görüntüleri çizmeden önce beyaza sıfırlayın.

function love.draw()
  love.graphics.setColor(1, 0, 0)   -- red
  love.graphics.rectangle('fill', 20, 20, 60, 60)
  love.graphics.setColor(1, 1, 1)   -- back to white
end

Çizgiler ve Noktalar

love.graphics.line, bir dizi x, y noktasını birbirine bağlar. love.graphics.setLineWidth, çizgilerin ve dış çizgisi çizilmiş şekillerin kalınlığını denetler.

Bağlantılı bir yol çizmek için aynı anda çok sayıda nokta aktarabilirsiniz. Bu, izler, yollar veya basit vektör çizimleri için kullanışlıdır.

function love.draw()
  love.graphics.setLineWidth(3)
  love.graphics.line(10, 10, 80, 60, 150, 20)
end

Görüntü Yükleme

Görüntüleri love.load içinde love.graphics.newImage ile bir kez yükleyin. Bu işlem, yeniden kullanmak üzere bir değişkende saklayacağınız bir görüntü nesnesi döndürür.

Görüntüleri hiçbir zaman love.draw içinde yüklemeyin; aksi hâlde dosya her karede yeniden okunur ve performans düşer.

function love.load()
  sprite = love.graphics.newImage('player.png')
end

Görüntü Çizme

love.graphics.draw(image, x, y), bir görüntüyü verilen konumda görüntüler. Varsayılan olarak görüntünün sol üst köşesi x, y konumuna yerleşir.

Ek bağımsız değişkenler döndürme, ölçek ve başlangıç noktası kayması ekleyerek her grafik öğesinin görünümü üzerinde tam denetim sağlar.

function love.draw()
  love.graphics.draw(sprite, player.x, player.y)
end

Döndürme ve Ölçekleme

Tam imza draw(image, x, y, r, sx, sy, ox, oy) şeklindedir. Burada r radyan cinsinden döndürme açısı, sx ve sy ise ölçek katsayılarıdır.

Orijin kaydırması ox, oy dönme merkezini belirler. Bir görüntünün merkezi etrafında döndürmek için orijini, görüntünün genişliğinin ve yüksekliğinin yarısı olarak ayarlayın.

local w, h = sprite:getWidth(), sprite:getHeight()
love.graphics.draw(sprite, x, y, angle, 1, 1, w/2, h/2)

Metin Çizme

love.graphics.print(text, x, y), geçerli yazı tipini kullanarak bir dize çizer. love.graphics.setFont etkin yazı tipini değiştirir.

love.load içinde love.graphics.newFont('font.ttf', 24) ile özel yazı tipleri oluşturun. Rengin, şekillerde olduğu gibi metni de renklendirdiğini unutmayın.

function love.draw()
  love.graphics.setColor(1, 1, 1)
  love.graphics.print('Score: ' .. score, 10, 10)
end

Temizleme ve Arka Plan

LÖVE her karede ekranı otomatik olarak temizler, ancak love.load içinde love.graphics.setBackgroundColor ile temizleme rengini ayarlayabilirsiniz.

Özel çizim sırasında elle denetim için love.graphics.clear arabelleği bir renkle doldurur. Çoğu oyun yalnızca arka planı bir kez ayarlar ve temizleme işlemini motora bırakır.

function love.load()
  love.graphics.setBackgroundColor(0.1, 0.1, 0.2)
end

Sprite Sayfaları için Dörtgenler

Bir Dörtgen, görüntünün dikdörtgen bir bölgesini seçerek tek bir sprite sayfasında birçok kare bulundurmanızı sağlar. Bunu love.graphics.newQuad ile oluşturun.

Yalnızca bu bölgeyi görüntülemek için dörtgeni love.graphics.draw(image, quad, x, y) işlevine aktarın. Sprite animasyonunun temeli budur.

local sheet = love.graphics.newImage('sheet.png')
local frame = love.graphics.newQuad(0, 0, 32, 32, sheet:getDimensions())
-- love.graphics.draw(sheet, frame, x, y)

Hızlı Kontrol

LÖVE ile çizim konusundaki bilginizi sınayın.

Özet

love.draw içinde love.graphics ile dikdörtgenler, daireler, çizgiler, görüntüler ve metin çizersiniz. setColor, sonraki çizimleri renklendirir ve durum bilgisi taşır.

Görüntüleri love.load içinde newImage ile bir kez yükleyin, ardından döndürme, ölçekleme ve sprite sayfaları için dörtgenler ekleyerek draw ile görüntüleyin.

Sıkça Sorulan Sorular

“Şekil ve Görüntü Çizme” dersi ücretsiz mi?

Evet — “Şekil ve Görüntü Çizme” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Lua Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Lua Academy kursu toplamda 4 dersten oluşur.

“Şekil ve Görüntü Çizme” dersinde ne öğreneceğim?

Grafikleri ekranda görüntüleyin. Lua Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

Lua Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te Lua Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 2. dersidir.

“Şekil ve Görüntü Çizme” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu Lua Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her Lua Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← Lua Academy Sayfasına Dön