Knight Online UIF EDITOR v1.0 (2026)

[DeltaSoft]

KNIGHT ONLINE UI EDITOR (UIE) KULLANIM KILAVUZU​

Versiyon: v2.3.26.400 | Kirasoftware (2016-2026)

BÖLÜM 1: GİRİŞ

Knight Online UI Editor (UIE), Knight Online oyunu için UI (Kullanıcı Arayüzü) dosyalarını oluşturmak, düzenlemek ve yönetmek için tasarlanmış profesyonel bir grafik editörüdür. Bu araç, oyun geliştiricileri ve mod yapımcıları için essential bir kaynaktır.​

UIE, Knight Online'ın özel UIF formatını kullanarak UI elemanlarını kaydeder. Bu format, oyunun runtime'da kullandığı özel bir yapıya sahiptir ve doğrudan düzenlenebilir.​

Bu Kılavuz Hakkında

Bu dokümantasyon, UIE'nin tüm özelliklerini kapsamlı bir şekilde açıklamaktadır. Bölümler, yeni başlayanlar için temel bilgilerden başlayarak ileri düzey tekniklere kadar ilerlemektedir.​

Kılavuz, aşağıdaki konuları içermektedir:​

• UIE'nin temel özellikleri ve kullanım alanları
• Sistem gereksinimleri ve kurulum
• Arayüz tanıtımı ve navigasyon
• UI bileşenlerinin oluşturulması ve düzenlenmesi
• Animasyon sistemi
• Texture yönetimi
• İleri düzey teknikler ve ipuçları

Her bölüm, pratik örnekler ve adım adım talimatlar içermektedir.​

BÖLÜM 2: UIE NEDİR?

UIE (UI Editor), Knight Online için UI tasarımı yapmanıza olanak tanıyan bir Windows masaüstü uygulamasıdır. MFC (Microsoft Foundation Classes) kullanılarak geliştirilmiştir ve Direct3D teknolojisini kullanmaktadır.​

Temel Özellikler

UIE, aşağıdaki temel özellikleri sunar:​

• Çoklu UI Bileşen Desteği: Button, Image, String, Static, Edit, Progress, TrackBar, ScrollBar, Area, List, Tree, Flash ve daha fazlası
• Görsel Düzenleme: Sürükle-bırak ile UI elemanlarını konumlandırma
• Hiyerarşi Görünümü: Tüm UI elemanlarının ağaç yapısında görüntülenmesi
• Özellik Paneli: Seçili elemanların tüm özelliklerini düzenleme
• Texture Yönetimi: DX Texture formatında görselleri düzenleme
• Animasyon Sistemi: UI elemanları için animasyon oluşturma
• Toplu İşlemler: Birden fazla dosya üzerinde toplu değişiklik yapma

UIF Formatı

UIE, .UIF uzantılı dosyalar kullanır. Bu dosyalar XML benzeri bir yapıda saklanır ve aşağıdaki bilgileri içerir:​

• UI elemanlarının pozisyonları ve boyutları
• Texture referansları ve UV koordinatları
• Font bilgileri ve metin içerikleri
• Olay işleyicileri (event handlers)
• Animasyon verileri
• Stil ve görünüm ayarları

Kullanım Alanları

UIE, aşağıdaki senaryolarda kullanılır:​

• Yeni UI elemanları tasarlama
• Mevcut UI'leri modifiye etme
• Oyun arayüzünü özelleştirme
• Animasyonlu UI efektleri oluşturma
• Texture atlas'larını düzenleme
• UI dosyalarını analiz etme ve debug etme

BÖLÜM 4: KURULUM
Kurulum Adımları

UIE'yi kurmak için aşağıdaki adımları izleyin:​

1. Adım: UIE kurulum dosyasını indirin​

2. Adım: Kurulum dosyasını çalıştırın​

3. Adım: Kurulum sihirbazını takip edin​

4. Adım: Kurulum konumunu seçin (varsayılan: C:\Program Files\Kirasoftware\UIE)​

5. Adım: "Kur" butonuna tıklayın​

6. Adım: Kurulum tamamlandıktan sonra UIE'yi başlatın​

İlk Yapılandırma

UIE'yi ilk kez çalıştırdığınızda, aşağıdaki ayarları yapmanız gerekir:​

• Base Path (Temel Yol): Knight Online veri dosyalarının bulunduğu klasörü seçin
• Tema Ayarları: Arayüz rengi ve görünüm tercihlerinizi belirleyin
• Kısayol Tuşları: İsterseniz kısayol tuşlarını özelleştirin

Base Path Ayarlama

Base Path, UIE'nin texture dosyalarını ve diğer kaynakları bulmak için kullandığı temel klasördür. Bu ayarı değiştirmek için:​

• Üst menüden Tools > Options seçin
• Base Path alanına klasör yolunu girin
• veya Browse butonuna tıklayarak klasörü seçin
• OK butonuna tıklayarak kaydedin

Kurulum Sorunlarını Çözme

Kurulum sırasında sorun yaşarsanız:​

• DLL Hataları: Visual C++ Redistributable paketini yeniden kurun
• DirectX Hataları: DirectX End-User Runtime'ı güncelleyin
• Çalışma izinleri: UIE'yi yönetici olarak çalıştırmayı deneyin
• Uyumluluk: Windows uyumluluk modunu ayarlayın

BÖLÜM 5: ARAYÜZ

UIE arayüzü, verimli çalışma için optimize edilmiş bir tasarıma sahiptir. Ana pencere üç ana bölümden oluşur.​

Pencere Düzeni

UIE penceresi aşağıdaki bölümlerden oluşur:​

• Menu Bar (Üst Menü): Dosya, Düzenle, Görünüm, Ekle, Araçlar ve Yardım menüleri
• Toolbar (Araç Çubuğu): Sık kullanılan komutların hızlı erişim ikonları
• Hierarchy View (Hiyerarşi Görünümü): Sol panel - UI elemanlarının ağaç yapısı
• Canvas (Tuval): Orta panel - UI'nin görsel düzenleme alanı
• Property View (Özellik Paneli): Sağ panel - Seçili elemanın özellikleri
• Status Bar (Durum Çubuğu): Alt kısım - Anlık bilgiler

Hiyerarşi Görünümü (Sol Panel)

Hiyerarşi görünümü, tüm UI elemanlarını ağaç yapısında gösterir. Bu panel şunları sağlar:​

• UI elemanlarının hiyerarşik ilişkilerini görüntüleme
• Elemanları sürükleyerek yeniden düzenleme
• Elemanları seçme ve vurgulama
• Context menü ile hızlı işlemlere erişim

Panel, her UI elemanının solunda bir ikon gösterir. İkon rengi, elemanın türüne göre değişir.​

Canvas (Orta Panel)

Canvas, UI'nin görsel olarak düzenlendiği ana çalışma alanıdır. İki modda çalışır:​

• Preview Mode (Önizleme Modu): UI'yi son haliyle görüntüler
• Edit Mode (Düzenleme Modu): UI elemanlarını seçme, taşıma ve boyutlandırma

Edit modunda, seçili elemanların etrafında manipülasyon tutamaçları görünür.​

Özellik Paneli (Sağ Panel)

Özellik paneli, seçili UI elemanının tüm özelliklerini düzenlemenize olanak tanır. Panel şu özellik gruplarını içerir:​

• Base Properties (Temel Özellikler): ID, pozisyon, boyut
• Appearance (Görünüm): Renk, stil, görünürlük
• Behavior (Davranış): Olaylar, animasyonlar
• Type-Specific (Türe Özgü): Eleman türüne göre değişen özellikler

BÖLÜM 6: UIF FORMAT

UIF (UI File), Knight Online'ın kullandığı özel UI dosya formatıdır. Bu format, binary ve text tabanlı veri yapılarını birleştirir.​

Dosya Yapısı

UIF dosyaları aşağıdaki ana bölümlerden oluşur:​

• Header (Başlık): Dosya formatı ve versiyon bilgisi
• UI Tree (UI Ağacı): Tüm UI elemanlarının hiyerarşik yapısı
• Properties (Özellikler): Her elemanın özellikleri
• Resources (Kaynaklar): Texture ve font referansları

Kaydetme ve Yükleme

UIF dosyalarını kaydetmek için:​

• Ctrl+S: Aktif dosyayı kaydet
• Ctrl+Shift+S: Farklı kaydet
• File > Save As: Yeni isimle kaydet

Dosya yüklemek için:​

• Ctrl+O: Dosya açma dialogu
• Drag & Drop: Dosyayı pencereye sürükle-bırak

Export (Dışa Aktarma)

UI elemanlarını dışa aktarmak için:​

• Hiyerarşi görünümünde elemanı seçin
• File > Export seçin
• Çıktı formatını ve konumunu belirleyin

Import (İçe Aktarma)

Harici UI dosyalarını içe aktarmak için:​

• Hedef elemanı seçin (veya yeni ekleme için boş alan)
• File > Import seçin
• İçe aktarılacak dosyayı seçin

Texture Yollarını Değiştirme

Batch olarak texture yollarını değiştirmek için:​

• Tools > Batch Tool > Change Image Path seçin
• Değiştirilecek dosyaları seçin
• Eski ve yeni yolları girin

BÖLÜM 7: UI BİLEŞENLERİ

UIE, çeşitli UI bileşenlerini destekler. Her bileşen farklı amaçlar için tasarlanmıştır.​

Temel Bileşenler

1. Image (Görsel)

Texture görüntülemek için kullanılır. Özellikleri:​

• Texture dosyası referansı
• UV koordinatları (texture içindeki bölge)
• Pozisyon ve boyut

2. Button (Buton)

Tıklanabilir butonlar oluşturur. Durumları:​

• Normal: Varsayılan görünüm
• Down: Basılı durumda
• On: Fare üzerindeyken
• Disable: Pasif durumda

3. String (Metin)

Metin görüntülemek için kullanılır. Özellikleri:​

• Font ailesi ve boyutu
• Renk (RGBA)
• Hizalama (sol, orta, sağ)
• Metin içeriği

4. Static (Statik)

Arka plan görseli ve metin birleşimi. Özellikleri:​

• Background image
• Üzerinde metin
• Otomatik boyutlandırma

5. Edit (Düzenleme)

Kullanıcı girişi için metin kutusu. Özellikleri:​

• Input/Ouput modları
• Karakter limiti
• Password mode
• Multi-line desteği

6. Progress (İlerleme)

İlerleme çubuğu gösterimi. Özellikleri:​

• Background texture
• Foreground (dolgu) texture
• Yatay/Dikey yön

7. TrackBar (Kaydırma Çubuğu)

Değer seçimi için. Özellikleri:​

• Background texture
• Thumb (kaydırıcı) texture
• Min/Max değerleri
• Yatay/Dikey yön

8. ScrollBar (Kaydırma)

İçerik kaydırma için. Özellikleri:​

• Up/Left butonu
• Down/Right butonu
• Track bar
• Otomatik visible/pos ayarı

9. Area (Alan)

Tıklanabilir boş alan. Özellikleri:​

• Sadece region tanımı
• Görsel içermez
• Olay işleme için kullanılır

10. List (Liste)

Listedeki string öğeleri. Özellikleri:​

• String listesi
• Otomatik scroll
• Seçim yönetimi

11. Tree (Ağaç)

Hiyerarşik liste yapısı. Özellikleri:​

• Tree item desteği
• Collapse/Expand
• Seviye yönetimi

12. Flash

Adobe Flash içeriği için. Özellikleri:​

• SWF dosya referansı
• Playback kontrolü
• Parametre geçirme

BÖLÜM 8: YENİ UI OLUŞTURMA

UI Ekleme Temelleri

Yeni UI elemanı eklemek için şu adımları izleyin:​

• Eklemek istediğiniz eleman türünü seçin (Insert menüsü veya toolbar)
• Canvas üzerinde konumlandırın
• Özellikler panelinde ayarları yapın

Button Oluşturma

Yeni bir buton oluşturmak için:​

• Insert > Button seçin
• Texture seçin (4 durum için)
• Her durum için UV koordinatlarını ayarlayın
• Region'ı düzenleyin

Spoyler: Button Oluşturma Adımları

1. Insert > Button seçin​

2. Texture dosyasını seçin​

3. "Normal" durumu için bölge seçin​

4. "Down" durumu için bölge seçin​

5. "On" durumu için bölge seçin​

6. "Disable" durumu için bölge seçin​

7. Buton pozisyonunu ayarlayın​

8. Gerekirse click area tanımlayın​

String Oluşturma

Yeni bir metin elemanı oluşturmak için:​

• Insert > String seçin
• Font seçin (font dialogundan)
• Renk seçin
• Metin içeriğini girin
• Region'ı ayarlayın

Image Oluşturma

Yeni bir görsel elemanı oluşturmak için:​

• Insert > Image seçin
• Texture dosyasını seçin
• Texture üzerinde bölge seçin (UV koordinatları)
• Görsel pozisyonunu ayarlayın

Progress Oluşturma

Yeni bir ilerleme çubuğu oluşturmak için:​

• Insert > Progress seçin
• Background texture seçin
• Foreground texture seçin
• Yönü belirleyin (yatay/dikey)

ScrollBar Oluşturma

Yeni bir kaydırma çubuğu oluşturmak için:​

• Insert > ScrollBar seçin
• Up/Left butonu için texture seçin
• Down/Right butonu için texture seçin
• Track bar için texture seçin
• Yönü belirleyin

Group (Grup) Oluşturma

Birden fazla elemanı gruplamak için:​

• Gruplanacak elemanları seçin (Ctrl+tıklama ile)
• Edit > Make Group seçin
• Grup otomatik oluşturulur

BÖLÜM 9: DÜZENLEME

Seçme İşlemleri

UI elemanlarını seçmek için:​

• Tek seçim: Eleman üzerine tıklayın
• Çoklu seçim: Ctrl tuşunu basılı tutarak tıklayın
• Alan seçimi: Canvas üzerinde sürükleme yapın

Taşıma

Elemanları taşımak için:​

• Sürükle-bırak: Mouse ile sürükleyin
• Ok tuşları: Piksel piksel hareket
• Kısayol tuşları: Shift+Ok tuşları ile 10 piksel hareket

Precision hareket için kısayol tuşları:​

• Ctrl+X: X ekseninde +1 piksel
• Ctrl+Y: Y ekseninde +1 piksel
• Ctrl+Shift+X: X ekseninde -1 piksel
• Ctrl+Shift+Y: Y ekseninde -1 piksel

Boyutlandırma

Elemanları boyutlandırmak için:​

• Köşe tutamaçları: Eşit ölçekleme
• Kenar tutamaçları: Tek yönde boyutlandırma
• Özellik paneli: Kesin değer girişi

Precision boyutlandırma için:​

• Ctrl+W: Genişlik +1 piksel
• Ctrl+H: Yükseklik +1 piksel
• Ctrl+Shift+W: Genişlik -1 piksel
• Ctrl+Shift+H: Yükseklik -1 piksel

Kopyalama ve Yapıştırma

Elemanları kopyalamak için:​

• Ctrl+C: Seçili elemanları kopyala
• Ctrl+V: Yapıştır (orijinal konumdan +10,+10 offset)
• Ctrl+D: Doğrudan çoğalt

Silme

Elemanları silmek için:​

• Delete tuşu: Seçili elemanları sil
• Edit > Delete: Aynı işlev

Z-Order (Z Sırası)

Elemanların görünüm sırasını değiştirmek için:​

• Edit > Move to Lowest: En alta taşı
• Edit > Move to Lower: Bir seviye aşağı
• Edit > Move to Upper: Bir seviye yukarı
• Edit > Move to Highest: En üste taşı

Parent/Child İlişkileri

Elemanları parent yapmak için:​

• Child olacak elemanları seçin
• Parent olacak elemanı son seçimde seçili tutun
• Edit > Parent seçin

Elemanları parent'tan çıkarmak için:​

• Seçili elemanları seçin
• Edit > Unparent seçin

Geri Alma ve Yineleme

Değişiklikleri geri almak için:​

• Ctrl+Z: Geri al
• Ctrl+Y: Yinele (Redo)

BÖLÜM 10: ANİMASYON

UIE, UI elemanları için temel animasyon desteği sunar.​

Animasyon Dialogu

Animasyon oluşturmak için:​

• Tools > Animate seçin
• Animasyon dialog penceresi açılır
• Frame sayısını belirleyin
• Animasyonu önizleyin

Animasyon Türleri

Desteklenen animasyon türleri:​

• Position: X,Y koordinat değişimi
• Scale: Boyut değişimi
• Rotation: Döndürme (varsa)
• Alpha: Şeffaflık değişimi
• Color: Renk geçişleri

Keyframe (Anahtar Kare)

Animasyonda anahtar kareler oluşturmak için:​

• Animasyon dialogunda frame seçin
• Özellikler panelinde değerleri ayarlayın
• Keyframe otomatik oluşturulur

Playback (Oynatma)

Animasyonu oynatmak için:​

• Play: Animasyonu başlat
• Stop: Animasyonu durdur
• Loop: Döngü modunu aç/kapa
• Speed: Oynatma hızını ayarla

Easing (Yumuşatma)

Animasyon geçişlerini yumuşatmak için easing fonksiyonları kullanılır:​

• Linear: Sabit hız
• Ease-In: Yavaş başlangıç
• Ease-Out: Yavaş bitiş
• Ease-In-Out: Yavaş başlangıç ve bitiş

BÖLÜM 11: TEXTURE YÖNETİMİ

Texture yönetimi, UIE'nin en önemli özelliklerinden biridir. Texture dosyaları, UI elemanlarının görsel görünümünü belirler.​

Texture Dialogu

Texture dialogu, görselleri seçmek ve UV koordinatlarını ayarlamak için kullanılır. Dialog üç modda çalışır:​

• Select Mode: UV bölgesi seçme
• Zoom Mode: Yakınlaştırma/uzaklaştırma
• Hand Mode: Pan (kaydırma)

UV Koordinatları

UV koordinatları, texture üzerindeki bölgeyi belirler. Değerler 0.0 ile 1.0 arasındadır:​

• U (Yatay): Soldan sağa 0.0 - 1.0
• V (Dikey): Yukarıdan aşağıya 0.0 - 1.0

UV koordinatlarını ayarlamak için:​

• Texture dialogunu açın
• Select modunda sürükleyerek bölge seçin
• Köşe tutamaçları ile hassas ayar yapın
• Auto-select butonları ile otomatik seçim yapın

Auto-Select Özelliği

Texture dialogunda iki auto-select butonu bulunur:​

• Auto-Select H (Yatay): Texture'ı yatay olarak eşit bölgelere ayırır
• Auto-Select V (Dikey): Texture'ı dikey olarak eşit bölgelere ayırır

Image Type Seçimi

Texture dialogunda image type dropdown menüsü bulunur. Bu menü, farklı UI durumları için bölgeleri seçmenize olanak tanır:​

• Button: Normal, Down, On, Disable
• Progress: Back, Fore
• TrackBar: Back, Thumb

Texture Değiştirme

Mevcut bir texture'ı değiştirmek için:​

• Elemanı seçin
• Özellikler panelinde texture yolunu değiştirin
• veya Edit > Replace Texture kullanın

Toplu Texture Değiştirme

Birden fazla dosyada texture yolunu değiştirmek için:​

• Tools > Batch Tool > Change Image Path seçin
• Değiştirilecek UIF dosyalarını seçin
• Eski dosya yolunu ve yeni dosya yolunu girin
• İşlemi onaylayın

Kullanılmayan Dosyaları Bulma

Kullanılmayan texture dosyalarını tespit etmek için:​

• Tools > Batch Tool > Gather Image File Names seçin
• UIF dosyalarını seçin
• Karşılaştırma klasörünü seçin
• Kullanılmayan dosyalar listelenir

Ekleme Kısayolları

Menü	İşlev
Insert > Image	Yeni görsel ekle
Insert > String	Yeni metin ekle
Insert > Button	Yeni buton ekle
Insert > Static	Yeni statik eleman ekle
Insert > Edit	Yeni düzenleme kutusu ekle
Insert > Progress	Yeni ilerleme çubuğu ekle
Insert > TrackBar	Yeni kaydırma çubuğu ekle
Insert > ScrollBar	Yeni scrollbar ekle
Insert > Area	Yeni alan ekle
Insert > List	Yeni liste ekle
Insert > Group	Yeni grup ekle
Insert > Tree	Yeni ağaç ekle
Insert > Tree Item	Yeni ağaç öğesi ekle
Insert > Flash	Yeni Flash elemanı ekle

BÖLÜM 13: İPUÇLARI VE TEKNİKLER

Verimlilik İpuçları

UIE'yi daha verimli kullanmak için aşağıdaki ipuçlarını uygulayın:​

• Base Path'i doğru ayarlayın: Texture dosyalarının bulunduğu klasörü Base Path olarak belirleyin
• Sık kaydedin: Düzenleme sırasında düzenli olarak Ctrl+S ile kaydedin
• Hiyerarşiyi kullanın: Sol paneldeki ağaç yapısını aktif kullanın
• Kısayolları öğrenin: Klavye kısayolları iş akışınızı hızlandırır
• Grid'i açın: Hassas hizalama için grid görünümünü kullanın

Texture Atlas Kullanımı

Texture atlas, birden fazla görseli tek bir dosyada birleştirme tekniğidir. Avantajları:​

• Daha az dosya sayısı
• Daha hızlı yükleme
• Daha az bellek kullanımı
• Tutarlı görünüm

Atlas oluştururken dikkat edilecekler:​

• Her görsel için yeterli boşluk bırakın
• 2'nin kuvveti boyutlar kullanın (256, 512, 1024)
• Alpha kanalını kontrol edin
• UV koordinatlarını hassas ayarlayın

Performans Optimizasyonu

Büyük UI dosyalarında performansı artırmak için:​

• Gereksiz elemanları silin: Kullanılmayan UI elemanlarını temizleyin
• Texture boyutlarını optimize edin: Büyük texture'ları küçültün
• Z-order'ı düzenleyin: Edit > Z-Order ile katman sırasını düzeltin
• Batch analiz kullanın: Tools > Analyze UIF ile dosyaları inceleyin

Batch İşlemler

Toplu işlemler, birden fazla dosya üzerinde aynı anda değişiklik yapmanıza olanak tanır:​

• Change Image Path: Texture dosya yollarını toplu değiştirme
• Change Font: Font ailesini toplu değiştirme
• Gather Image Names: Kullanılan texture dosyalarını listeleme
• Analyze UIF: UIF dosyalarını analiz etme ve raporlama

BÖLÜM 14: SIKÇA SORULAN SORULAR (FAQ)
Genel Sorular
Spoyler: UIE hangi işletim sistemlerinde çalışır?

Teknik Sorular
Spoyler: Texture boyutu sınırı var mı?

Spoyler: Alpha kanalı nasıl kullanılır?

Spoyler: Animasyon dosyaları nereye kaydedilir?

Sorun Giderme
Spoyler: Dosya açılırken hata alıyorum

İletişim ve Destek

UIE ile ilgili sorularınız ve geri bildirimleriniz için:​

İndirme & Paylaşım Bilgisi
Yenilik güncellemeleri gelecektir. Tüm güncellemeler sürekli olarak ücretsiz olacaktır.

Ziyaretçiler için gizlenmiş link,görmek için Giriş yap veya üye ol.

Pass : KiraSoftWare2026