Merhaba sevgili yazılımperver dostlarım yazılarımıza hız kesmeden devam ediyoruz. SDL ile ilgili ilk yazımda, kuruluma bakmıştık ve sonrasında da; kaynak yönetimi, olayların kotarılması, görselleştirme ve bu nesnelerin oluşturulmasına yönelik kabiliyetlere göz atmıştık. Bu yazımda kalan konulara da değinip temel SDL3 uygulamamızı tamamlayacağız inşallah. Eğer ilk yazımı henüz okumadıysanız aşağıdaki bağlantıya bir göz atmanızı rica ediyorum:
Evet temel kabiliyetlere baktıktan sonra son olarak görselleştirme ve kalan kısımlara bakıyor olacağız.
Görselleştirme (Strateji Örüntüsü)
Elbette, SDL kullandığınız zaman yapacağınız ilk şey muhtemelen, ekrana bir şeyler çizdirmek olacaktır. Şimdi sıra geldi, işin en heyecanlı kısımlarına 🙂
Daha önceki yazılarımda da bahsettiğim gibi, SDL sizlere platformdan bağımsız bir alt yapı sunmakta ve her ne kadar OpenGL ya da DirectX kadar olmasa da, temel çizim kabiliyetleri sunmaktadır. Bu örneğimiz için temel çizim kabiliyetlerine, daire, dikdörtgen ve üçgen çizimine bakıyor olacağız (İleride resim ve diğer ileri seviye API’lere de bakıyor olabiliriz).
Bu tarz çizimleri, SDL’in sunduğu, SDL_RenderFillRect , SDL_RenderPoint ve SDL_RenderGeometry API’lerini kullanarak yapıyor olacağız. API’leri özellikle bu sırada verdim. Basitten daha karmaşık şekillerin çizimi için kullanılabilecek en önemli API’ler bunlar. Basit bir uygulama için bu API’leri kullanarak, gerekli çizimleri yapabilirsiniz. Biz örneğimizde bunu bir adım öteye taşımayı hedefliyoruz ve bu kapsamda da strateji örüntüsünü kullanıyor olacağız.
Peki nedir strateji tasarım örüntüsü? Temelde bu örüntü, bizlere, bir işlevin ya da işlemin, farklı yollarla, esnek ve genişleyebilir bir mimari ile yapılabilmesine olanak sağlar. Yine bu örüntü de, “Gang of four” tarafından yazılan kitapta geçen ve davranışsal (“behavioral”) örüntülere girmektedir. Aşağıda bu örüntüye yönelik genel sınıf diyagramını bulabilirsiniz:
Farklı şekil çizimleri, bizim için stratejiler olacak (bu bağlamda temel sınıfı RenderStrategy). Aşağıda bu arayüze yönelik kod parçasını da görebilirsiniz:
|
1 2 3 4 5 |
class RenderStrategy { public: virtual ~RenderStrategy() = default; virtual void Render(SDL_Renderer* renderer, const Transform& transform) = 0; }; |
Her bir stratejinin, buradaki Render API’sini gerçeklemesini bekliyoruz. Aşağıda, dikdörtgen için bunun nasıl yapıldığını görebilirsiniz. Temel çizim işlevleri, bu strateji sınıfları içerisinde gerçekleştiriliyor olacak.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
class RectangleRenderer : public RenderStrategy { private: SDL_Color mColor; int32_t mWidth, mHeight; public: RectangleRenderer(SDL_Color color, int32_t width, int32_t height); void Render(SDL_Renderer* renderer, const Transform& transform) override { SDL_SetRenderDrawColor(renderer, mColor.r, mColor.g, mColor.b, mColor.a); SDL_FRect rect = { transform.mX - (mWidth * transform.mScaleX) / 2.0f, transform.mY - (mHeight * transform.mScaleY) / 2.0f, mWidth * transform.mScaleX, mHeight * transform.mScaleY }; SDL_RenderFillRect(renderer, &rect); } }; |
Bizim için Context ise, bileşen temel sınıfından türettiğimiz, RenderComponent, sınıfımız olacak. Aşağıda da, bu sınıfa yönelik kod parçasını görebilirsiniz:
|
1 2 3 4 5 6 7 8 9 10 |
class RenderComponent : public Component { private: std::unique_ptr<RenderStrategy> mStrategy; public: RenderComponent(std::unique_ptr<RenderStrategy> strategy); void SetStrategy(std::unique_ptr<RenderStrategy> strategy); void Render(Renderer& renderer) override; }; |
Gördüğünüz gibi, kullanılacak strateji belirlendikten sonra, Render API’si ile ilgili çizimleri yapıyor olacağız.
Peki bu sınıfımızı kim kullanıyor olacak? Bu sınıflara yönelik nesnelerimizi ise, bir önceki yazımda bahsettiğim GraphicalObject nesnelerine, bileşen olarak ekliyor olacağız ve işimiz bitecek. Bu bileşen de, yine ilgili yazıda bahsettiğimiz fabrika sınıflar marifeti ile gerçekleştirilecek.
Peki, bu noktada strateji örüntüsünün bize faydaları neler diye bakacak olursak:
- Okunabilirlik: Uzun if/else ya da switch/case’lerden sizleri kurtarır,
- Esneklik: Çalışma zamanında ilgili çizim işlevlerini kolay bir şekilde değiştirme/kullanma,
- Genişleyebilirlik: Yeni çizim kabiliyetlerinin, yeni strateji sınıfları ile kolay bir şekilde eklenebilmesi,
- Test Edilebilirlik: Farklı, çizim kabiliyetlerinin kolayca test edilebilmesi.
Görselleştirme, konusunu kapatmadan önce son bir hususa daha değinelim. Yukarıdaki, çizim API’lerinin hepsinde, SDL_Renderer nesnesinin geçirildiğini görürsünüz. Bu veri yapısı, SDL_Window içerisinde çizim (render) ile ilgili işlevlerin kotarıldığı yerdir. Bu nesneyi de, uygulama içerisinde oradan oraya geçirmek yerine Singleton örüntüsü ile Renderer sınıf içerisinde tutup, buna ihtiyaç duyan sınıflara da (strateji sınıfları), bunu geçiriyoruz. Aşağıda bu sınıfa yönelik kod parçasını bulabilirsiniz:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
class Renderer { private: static std::unique_ptr<Renderer> mInstance; SDLRenderer mRenderer; explicit Renderer(SDL_Renderer* renderer); public: static Renderer& Instance(); static bool Initialize(SDL_Renderer* renderer); static void Shutdown(); SDL_Renderer* GetSDLRenderer() const; void Clear(SDL_Color color = {0, 0, 0, 255}); void Present(); }; |
Singleton örüntüsü, diğer örüntülere göre en az kullanılması önerilen örüntülerden birisidir. Bununla birlikte bizim örneğimizde, SDL_Renderer‘ın bütün SDL uygulamasında tek olması ve ortak olarak kullanılması sebebi ile bu kullanımı tercih ettik elbette, farklı yöntemler de kullanılabilir. Benzer kullanımlar, log, konfigürasyon yönetimi ve benzeri hususlar için de uygulanabilir.
Bununla birlikte uygulamamıza yönelik kabiliyetleri de tamamlamış oluyoruz.
Uygulama
Şimdi gelelim uygulamamıza. Öncelikle, git reposunu henüz indirmediyseniz aşağıdaki bağlantıdan bunu bir indirelim:
https://github.com/yazilimperver/cpp-playground
Daha sonra uygulamayı ister windows isterseniz linux’ten aşağıdaki komutlar ile oluşturup, çalıştırabilirsiniz:
- cmake -S . -B build
- cmake –build build
- Linux çalıştırma
- build/app/sdl3-example-app
- Windows çalıştırma
- build\app\Debug\sdl3-example-app.exe
Windows sürümü için SDL dll’i otomatik olarak ilgili dizine kopyalanmış olacak. Uygulamayı çalıştırdığınızda aşağıdaki gibi bir ekran gelecek:
burada W, A, S, D tuşları ile yeşik kareye hareket verip, space tuşu ile durdurabilirsiniz. Esc ile de uygulamadan çıkabilirsiniz.
İlgili girdiler ayrıca, komut satırına da basılıyor olacak.
Evet dostlarım, bu yazı ile birlikte artık hem linux hem de windows (inşallah ileride android) için SDL3 uygulamalarınıza temel alabileceğiniz, modern C++ ve temel yazılım mühendisliği pratiklerinin kullanıldığı bir uygulamayı tamamlamış olduk. Her türlü görüş ve önerinizi, yorumlar kısmına eklemeyi unutmayın. Önümüzdeki yazılarımızda bu, repoya bol bol dönüyor olacağız.