Tasarım Şablonları ve Güncel Teknolojiler (Patterns'n'Tech)

18 Şubat 2012 Cumartesi

Observer Pattern (İzleyici Şablonu)

Tür: Davranışsal Şablon

Diğer Adı: Yayınla-Abone Ol (Publish-Subscribe)

İzleyici Şablonu (Observer Pattern) öyle bir birden çoğa (one-to-many) ilişki tanımlar ki; bir nesne (konu [subject] yada izlenilen [observable]) değiştiği zaman ona kayılı olan (registered) tüm nesneler (izleyiciler [observers]) haberdar edilir (notified).

İzleyici şablonun amacı, belirli bir konuda yayın yapan kaynağın, bu bilgiye ihtiyaç duyan nesneler tarafından takip edilmesini sağlayacak bir arayüz sağlamaktır. Bu yüzden Yayınla-Abone Ol Şablonu da denir.

Yukarıda bu şablonun sınıf şemasını görüyoruz. Subject izlenilen, Observer ise izleyen nesneler için arayüz (interface) sınıflarıdır. Bu sınıflar standard Java kütüphanesinde de Observable ve Observer olarak yer alırlar.

Bir sınıfı yayıncı yada izleyici yapmak için ilk önce gerekli arayüzlere uyması (implement) gerekir. Ardından gereklli metotlar yeniden yazılarak (override) bu çerçeveye (framework, paradigm) uyulmuş olunur.

Devamı »

29 Aralık 2011 Perşembe

Wicket Javascript ve CSS Desteği

Geçen yayınımda Wicket projemize nasıl Wicket kontrolünü devre dışı bırakarak JavaScript ve CSS desteği eklenebileceğine deyinmiştim. Bu yayınımda ise, Wicket kütüphanesinin sağladığı JavaScript ve CSS desteği ekleme yeteneklerinden bahsedeceğim.

Wicket projelerinde, genellikle sayfa sınıflarının türediği bir veya birden fazla taban sayfa sınıfları mevcuttur. Bu taban sayfa sınıflarının en önemli özelliklerinden biri ise, JavaScript ve CSS eklentilerinin alt (türemiş) sınıflara aktarabilmesi özelliğidir. Bu yayınımda, bu özellikten yararlanacağım.

<!DOCTYPE html> 
<html xmlns:wicket="http://wicket.apache.org"> 
    <head> 
        <meta charset="UTF-8"> 
        <meta name="description" content="Base Page of Wicket Pages!" /> 
    </head> 
    <body> 
        <header wicket:id="headerpanel" />
        <section class="content_container"> 
            <wicket:child/> 
        </section> 
        <footer wicket:id="footerpanel" /> 
    </body> 
</html>

Devamı »

3 Aralık 2011 Cumartesi

Wicket Javascript ve CSS Desteği ve Wicket Resim Problemi Çözümü

Bu yayınımda çok teknik olmayarak, oldukça basitçe Wicket sayfamıza nasıl javascript ve CSS desteği ekleyebileceğimizi anlatacağım.

Wicket Framework'ü bize resim, bağlantı gibi bileşenleri iki şekilde eklememizi mümkün kılar.

Wicket kontrollü
Wicket kontrolsüz (yada HTML kontrollü)

Ben bu yayında sadece HTML kontrollü olarak CSS ve javascript desteğinin nasıl ekleneceğine değineceğim çünkü Wicket kontrollü olarak eklemek için oldukça fazla kaynak zaten mevcut.

Elimizde login.html şeklinde şablon olarak hazırlanmış bir sayfamız olsun. İlk olarak bu sayfayı Wicket sayfası haline çevirmemiz gerekir. Bunun için aşağıdaki adımlar izlenebilir.

1) Sayfanın ismi LoginPage.html olarak değiştirilir. (Bu adım opsiyoneldir. Fakat okunaklılık açısından bu yapıya uymak önerilir ve Java dosyası ile isim uyuşmasını korumak gerekmektedir).

2) Ardından aynı isimde LoginPage.java Java sınıf dosyası oluşturulur.

public class LoginPage extends WebPage {
}

3) LoginPage.html sayfımızın <html> etiketi aşağıdaki gibi değiştirilir.

<html xmlns:wicket="http://wicket.apache.org">

4) HTML sayfamızın <head> kısmına css/style.css CSS dosyasını eklemek için aşağıdaki kodlar sonuna eklenir.

<wicket:head>
    <wicket:link>
        <link rel="stylesheet" href="css/style.css" type="text/css"/>
    </wicket:link>
</wicket:head>

5) js/script.js gibi bir javascript dosyasını eklemek için ise <wicket:link> etiketini kullanırız.

<wicket:link>
    <script type="text/javascript" src="js/script.js" />
</wicket:link>

Resimlerin HTML kontrollü görünmesi için ise aynı şekilde <wicket:link> etiketini kullanabiliriz.

<wicket:link>
 <img src="images/image.png" alt="[image]" class="picture" />
</wicket:link>

21 Ekim 2011 Cuma

Yayınları PDF Olarak İndirme

Bazen blog sitelerinde yayınlanan makaleleri ayrık PDF olarak kaydetme ihtiyacı duyarız. Bu makaleleri seçip kopyalayıp düzenlemek yerine bizim için bunu otomatik olarak yapan bir mekanizma olsa daha iyi olurdu elbet!

Artık bu özelliği blog siteme eklemiş bulunuyorum! Her yayının sol alt köşesindeki "Print PDF" bağlantısına tıklayarak çıktı yada PDF olarak elde edebilirsiniz.

Kendi blogspot sitesine bu özelliği eklemek isteyenler için: http://www.printfriendly.com/button

16 Ekim 2011 Pazar

Blogger için Syntax Highlighting (Sentaks Boyama) II

Eğer herhangi bir programlama dilini kullanarak blog yazıyorsanız bu kodların boyanmasını ve daha anlaşılır hale gelmesini isteyeceksiniz. Bunu yapmanın bir yolu da sentaks boyamasıdır. Sentaks boyaması için yapılmış oldukça fazla çalışma vardır fakat ben burada basit bir tanesine değineceğim.

Daha önceki yayınımda Heisecoder'in blogundaki ilgili yayının linki vermiştim. Fakat bazı farklılıklar olduğu için uygulamada sıkıntı yaşayanlar için tekrar yazmaya karar verdim.

1) İlk olarak bu adrese gidip içereğini Ctrl+A ile hepsini seçip Ctrl+C ile kopyalayın.

2) Blogspot hesabınızdaki Tasarım ekranına geçin.

3) Burada "HTML'yi Düzenle" seçeneğine tıklayın. Karşınıza mesaj çıkınca "Devam et" deyin

4) Kopyaladığınız css bilgisini <b:skin><!--[CDATA[/* etiketlerinden sonra aşağıdaki gibi ekleyin:

5) Aşağıdaki kodları </head> etiketinden hemen önce ekleyin:

<!-- Add-in CSS for syntax highlighting -->
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js' type='text/javascript'></script>

Devamı »

14 Ekim 2011 Cuma

Sim6802 Benzetim Programının Adım Adım Kullanılması (64bit desteği ile)

Sim6802 programı çok eski bir program olduğu için 64 bitlik bilgisayarlarda doğal olarak çalışamıyor. Bunun için bir taklit edici (emulator) programa ihtiyaç duyarız. Ben bu yayınımda kolay olması açısından DOSBOX kullanacağız.

DOSBOX kullanımı haricinde kalan kısımlar 32 bitlik bilgisayarlar için değişmemektedir.

DOSBOX yer aldığı bilgisayarın diskine erişmek için ilk önce bir yolu (path) sürücü olarak tanımlamak gerekir. Bu işlem "mount" komutu ile yapılır. Bu işlem belleksizdir, yani her program açışımızda tanımlama işlemini tekrarlamak zorunda oluruz. Ancak yapılandırma dosyasına bir eklenti yaparak bu işlemi tekrarlı hale getirebiliriz. Bunun için ilk olarak sim6802 klasörüne gideriz. Bu örnekte C:\sim6802 yolunu kullanacağız.

1) İlk olarak Dosbox <sürüm numarası> Options.bat dosyasını çalıştırırız.

2) Bu karşımıza dosbox-<sürüm numarası>.conf dosyası açılır, burada [autoexec] etiketi altına yolumuzu tanıtan, oraya giden ve programı açan komut satırlarını da ekleriz.

Devamı »

9 Ekim 2011 Pazar

Projeye İçerik (Content) Eklenmesi ve Çizdirilmesi

Bir projede en önemli bileşenlerden biri de içeriktir. Hatta öyle ki, büyük oyunlarda (3 GB gibi) içerik projenin %99.99'unu kaplar. Çünkü çalıştırılabilir program olarak adlandırılan .EXE dosyaları sadece basit derlenmiş koddan başkasını içermez (gömülmüş içerikler hariç).

İçerik dosyaları o kadar gelişmiştir ki bazıları kod bile içerebilir. Bazen sadece kod içeren içerik dosyalarımız da olabilir. Bunlara script deriz. Bunları işlemek için kendimiz bir işleyici yazmamız gereklidir. Kendi script dilimizi yazmak istiyorsak önümüzde üç yolumuz vardır:

Dosyayı gerçek zamanda kendimiz çözümleriz ve gerekli komutları yürütmeye çalışırız.
Interpreter (Yorumlayıcı) şablonunu kullanırız.
Parser Generator (Çözümleyici Üretici) kullanırız.

Bu üç seçeneği de kullanmak işimize gelebilir. Küçük çaplı ve çözümlemesi kolay bir dil tasarlamışsanız birinci seçenek çok daha iyi olacaktır. Fakat biraz genişletilebilirlik ve düzen istiyorsanız artık ikinci seçenek sizin için daha iyi olacaktır. İkinci seçenek script dilleri için yeterli olabilir. Fakat gerçekten günümüzde kullanılan programlama dillerine (Java, C++ gibi) yakın bir dil tasarlamak istiyorsanız üçüncü seçenek kaçınılmaz olacaktır. Oyunlarda genellikle ikinci seçenek kullanılmakla beraber bazı büyük oyun motorlarında üçüncü seçeneğinde kullanıldığına rastladım.

Bu kısımda iki boyutlu ve üç boyutlu içeriğin nasıl eklenileceğini göstermeye çalışacağım. İlk olarak iki boyutlu içerik ile başlayalım:

Bir önceki bölümde oluşturduğumuz projenin alt projesi olan içerik projesine Add>Existing Item... seçeneği ile diskimizde olan içerikleri ekleyebilir.

Oyunun içerikleri içerik projesine (Content Project) eklenir. Örnek olarak bir iki boyutlu doku (texture) dosyası ekleyelim.

Devamı »