Çözüldü Metin2 gui tasarımları nasıl yapılır?

raskolnikov demiş ki:

1- Oyun için bir gui designer aracı olmadığından tüm tasarım ve tasarımı etkileyen dinamik işlemler manuel olarak Python'da yazılıyor.


2- Ui bileşenlerini (pencere, buton, yazı ve yazı girilebilecek alan vs) göstermek/gizlemek ve barındırdığı veriyi gerektiğinde dinamik olarak güncellemek için yani her yerinde kullanıldığından, bir yerinde kalıyor demek zor.
Örneğin zindan takip penceresini düşün, bir liste var ve sağda da zindan ile ilgili detaylar (ismi, nerede bulunduğu, level aralığı vs) var. Listeden bir tanesine tıklıyorsun ve sağdaki bilgiler güncelleniyor. Burada iki değişim var.
Bir tanesi tasarım değişikliği bir tanesi de veri değişimi. Liste index'ine göre bir dictionary yapısından bilgiler geliyor, bunlara göre de örneğin render target sistemi varsa o boss'un modeli gösteriliyor falan filan.


3- Eski oyunlarda olan bir pratik bu, hâlâ da modern oyunlarda kullanılıyor. Örneğin oyundaki bir onay butonunu düşün, bu birden fazla yerde kullanılabilir. Karakter seçme ekranında karakteri silerken bu butonu görebilirsin, simyada sınıf arındırması yaparken görebilirsin, yere eşya atarken onaylarken görebilirsin vs. Her kullanım için dosya olarak bir kopyasını oluşturmak gittikçe çok fazla yer kaplayacak. .sub uzantılı dosyalar bu noktada şu işe yarıyor; bir tane imaj dosyası oluşturuyorlar ve içerisine ui bileşenlerini ekliyorlar. Örneğin butonun normal hali, üzerine gelindiğindeki (hovered) ve basıldığındaki hali (pressed) bulunuyor.
Küçük, orta, büyük butonlar olabiliyor, her biri için bir .sub dosyası yazılıyor. Büyük resim içerisinden 4 nokta arasında kalan kısmı almak için. Böylelikle her istediğin uygun yerde o butonu kullanabiliyorsun.


4- Eğer sistemin pencere boyutu çoğu çözünürlük için sorunsuz görüntülenebilecek boyuttaysa işi kolaylaştırmak için bunu yapabiliyorlar. Gui üzerindeki her ui bileşenini tek tek oluşturmak yerine Photoshop gibi bir yazılımla hepsini tut-sürükle yöntemiyle kolayca yapıp oyunda pencere arkaplanı amacıyla kullanıyorlar. Bu genellikle en az ZOrder (sanki Metin2'de farklı bir ismi vardı ama mantık aynı) değerine sahip olan bileşen oluyor.
Hangi ui bileşeninin hangi katmanda olacağını belirliyor bu değer. Monitörde x=genişlik, y=uzunluğu ifade ediyor, z de az önce anlattığım amaçla kullanılıyor. Tüm tasarım tek katmanda olamaz. Örneğin arkaplan için bir imaj dosyası koyduğunda bu, en az ZOrder değerine sahip olur. Örneğin sonradan bir resim, buton vs eklendiğinde bunlar arkaplan üzerine bineceğinden her şey normal gözükür.


5- Sanırım Windows.dds, Public.dds dosyalarından bahsediyorsun. Öyle değilse, biraz daha açarsan soruyu cevaplarım.
.sub dosyaları tam olarak bu iş için.


6- Bir ana pencere oluyor, sonradan eklenen diğer pencereler buna göre konumlandırıldığı için tek pencereymiş gibi gözüküyor.
Diğer pencereler genellikle ana pencere sınıfı içerisinde bir üye değişken olarak tutuluyor.


7- Renk kodu kullanımını destekleyen fonksiyonları inceleyip alabildiği değerlere göre değer verip deneyebilirsin. Aynı rengi bulamayabilirsin.


8- Bu da 3. maddedeki ihtiyaçtan dolayı çıkan bir çözüm. Bu resimelr sadece balık oyununda kullanılacakmış gibi gözüküyor, o zaman neden tasarımı Photoshop'ta bitirip öyle kullanmadılar? diye sorabilirsin. Öyle yaptıklarını varsayalım, bahsettiğin resimde görebiliyorsun; 4 tane buton var. Her birinin olaya göre (normal, hovered, pressed) durumlarını tasarlamışlar. Photoshop'ta tasarım yapılıp bitirilmiş olsa, oyuna aktardığında buton üzerine geldiğinde bir parlama vs göremeyeceksin. Sabit bir fotoğrafa bakıyormuşsun gibi. Aslında yine .sub dosyasıyla o butonu alıp butonun olduğu yere yerleştirerek bir illüzyon yapabilirsin, her şey normal gözükür ama madem bunu yapacaktın o zaman neden en başta yapmadın. Çok saçma yani.
Kaldı ki bu tasarımlar bu oyun için tasarlanmış olsa bile, bazı parçaları başka yerlerde kullanılmaya müsait. Yani sonradan başka yerlede ihtiyaç duyulabilir.

Hepsini görmek için tıklayın...