İnternet'e Bağlı olmadan (offline çalışma)
CiK kütüphanesiyle http://www.cocuklaricinkodlama.com/cik adresinden online çalışabilirsiniz. Eğer internet bağlantınız yoksa veya offline çalışmak istiyorsanız, indirdiğiniz cik.zip dosyasını bilgisayarınızda bir klasöre açınız. Daha sonra index.html dosyasına çift tılayarak CiK Editörünü açıp çalışmaya başlayabilirsiniz.CiK Dosya Yapısı
CiK Ana kütüphanesi ve yardımcı kütüphaneleriyle pek çok kod dosyasından oluşur. Ana kütüphane ismi cik.js dir. CiK dosya ve klasör yapısı şöyledir:
Editör (Oyun Alanı)
CiK için bir editör'de geliştirilmiştir, kodları yazıp değişik sonuçlarını görülebildiği bir arabirim olan editöre oyun alanı da diyebiliriz. Editör iki kısımdan oluşmaktadır:1-Kodların yazıldığı ilk bölüm
2-Sonucun görüldüğü ikinci bölüm
Metotlar
CiK kütüphanesi bütün üst düzey programlama dillerinde oluğu gibi Metot ve Özelliklerden (Properties) oluşmuştur. Metotlar programlamada "eylem gerçekleştiren" kod yapılarıdır. Sayfaya yazı yazdırmak, resim eklemek vs... Birer metottur çünkü bir eylemi gerçekleştirmektedirler. CiK de metotlar akıllı kod tamamlamada
ikonu ile gösterilir.
Bazı metotlar parantez içinde gönderdiğiniz "parametreler" ile çalıştırılırlar.
Özellikler
Özellikler, bir program nesnesine değer atamak için kullanılır. Özellikler sayesinde bir program nesnesine renk, uzunluk, yükseklik gibi değerler atanır. Her nesnenin kendine ait özellikleri vardır, bu özelliklerin neler olduğunu dökümanın ilerliyen kısımlarında bulabilirsiniz. Ayrıca her nesneye ait bütün özellikler akıllı kod tamamlamada kullanıcıya sunulmuştur. Özelliklere ait akıllı kod tamamlama ikonu :
şeklindedir.
Bir nesneye özellik atama "=" operatörü ile yapılır:
Zincirleme Metotlar
CiK'de zincirleme metot yapıları da vardır. Buna göre bir metodu takip eden (noktadan sonra diğer bir metot) metod yapıları da kullanılmaktadır:
CiK API
API'ler programsal arabirimlerdir. API ler sayesinde kullanıcı, kütüphaneye ulaşır ve onu kullanır. CiK teki API ler yukarıda da açıklandığı gibi ağırlıklı olarak Metot ve Özelliklerden oluşuyor. Ana arabirim "cik" dik. Bütün ifadeler, "cik" ile başlar ve noktasal notasyonla diğer metot ve özelliklere erişilir. Aşağıdaki bölümlerde CiK deki metot ve özelliklerin tamamı verilmektedir ayrıca bunların kullanımları da anlatılmıştır. CiK kütüphanesi halen geliştirilme aşamasında olup bu metot ve özelliklere zaman içinde ilaveler yapılacaktır.CiK Metotları
cik.yaz("yazdırmak istediğiniz metin")
cik.tekrarla(tekrarSayısı, Metot) "tekrarla" metodu bir döngü ifadesidir. İki parametre almaktadır.
tekrarSayısı: Sayısal Değer
Metot: Bir CiK metodu (Çift tırnak içinde yazılmalı)
Girilen tekrarSayısı kadar ikinci parametredeki metot çalıştırılır:
cik.eğer(koşulİfadesi, Metot) koşulİfadesi: <,> , == , != karşılaştırma ifadeleri ("==" eşit ise "!=" eşit değilse)
Metod: Koşulun olumlanması durumunda çalıştırılacak CiK Metodu (çift tırnak içinde yazılır)
cik.yardım() Şu an okuduğunuz yardım sayfasını açar. Bir popup pencere olduğu için browser'ınızdan popup pencere açılması iznini vermeniz gerekir. Adres çubuğunun üzerinde popup olduğunu belirten bir ifade göreceksiniz buraya tıklayarak izin verebilirsiniz.
Çizim Metotları
cik.git.başlangıç(yatayUzaklık,dikeyUzaklık) İmleci (cursor) Yatay ve Dikey pozisyonlarda konumlandırır. Çizim için bir başlangıç noktası oluşturur. Devamında çizim metotları tanımlanır.
cik.git.başlangıç(yatayUzaklık,dikeyUzaklık).sağ(çizgiUzunluğu) çizgiUzunluğu:sayısal değer
"sağ" metodu çizim yönünü belirtir ve "git.başlangıç(yatayUzaklık,dikeyUzaklık)" metodunun devamında zincirleme olarak kullanılır. Bakış açımıza göre sağ tarafa parametrede belirtilen uzunluk kadar bir çizgi çizer.
cik.git.başlangıç(yatayUzaklık,dikeyUzaklık).sol(çizgiUzunluğu) çizgiUzunluğu:sayısal değer
"sol" metodu çizim yönünü belirtir ve "git.başlangıç(yatayUzaklık,dikeyUzaklık)" metodunun devamında zincirleme olarak kullanılır. Bakış açımıza göre sol tarafa parametrede belirtilen uzunluk kadar bir çizgi çizer.
cik.git.başlangıç(yatayUzaklık,dikeyUzaklık).aşağı(çizgiUzunluğu) çizgiUzunluğu:sayısal değer
"aşağı" metodu çizim yönünü belirtir ve "git.başlangıç(yatayUzaklık,dikeyUzaklık)" metodunun devamında zincirleme olarak kullanılır. Bakış açımıza göre aşağı tarafa parametrede belirtilen uzunluk kadar bir çizgi çizer.
cik.git.başlangıç(yatayUzaklık,dikeyUzaklık).yukarı(çizgiUzunluğu) çizgiUzunluğu:sayısal değer
"yukarı" metodu çizim yönünü belirtir ve "git.başlangıç(yatayUzaklık,dikeyUzaklık)" metodunun devamında zincirleme olarak kullanılır. Bakış açımıza göre yukarı tarafa parametrede belirtilen uzunluk kadar bir çizgi çizer.
Çizim için Zincirleme Metot Kullanımı
Yukarıdaki çizim metotlarını noktasal notasyonla zincirleme yazarak, kompleks çizimler oluşturabilirsiniz:
CiK Nesneleri
CiK kütüphanesi "dikdörtgen", "daire", "çokgen", "yıldız" gibi bir tanım nesnelerden oluşmuştur. Bu nesneler kütüphane geliştikçe daha da artacaktır. Nesneler "kenar uzunluğu", "renk" vb. gibi "özelliklere" sahiptir. Özelliklere Değer atayarak nesnelerimizin yapılarını değiştirebiliriz. Herhangi bir değer atanmadığı durumlarda "tanımlı" değerleri ile gösterilirler. Nesnelerimiz ayrıc "çiz" isminde metoda da sahiptir. Bu metot nesnelerimizin çizilmesi komutunu verir.Dikdörtgen Nesnesi
Özellikleri
- yatayUzaklık
- dikeyUzaklık
- genişlik
- yükseklik
- renk
Metodu
- çiz()
Kullanımı
cik.dikdörtgen.yatayUzaklık= 200
cik.dikdörtgen.dikeyUzaklık= 100
cik.dikdörtgen.genişlik=300
cik.dikdörtgen.yükseklik=200
cik.dikdörtgen.renk="#008b00"
cik.dikdörtgen.çiz()
Daire Nesnesi
Özellikleri
- yatayUzaklık
- dikeyUzaklık
- yarıçap
- renk
Metodu
- çiz()
Kullanımı
cik.daire.yatayUzaklık=120
cik.daire.dikeyUzaklık=150
cik.daire.yarıçap=100
cik.daire.renk="#00688b"
cik.daire.çiz()
Yıldız Nesnesi
Özellikleri
- yatayUzaklık
- dikeyUzaklık
- uçSayısı
- renk
Metodu
- çiz()
Kullanımı
cik.yıldız.yatayUzaklık=120
cik.yıldız.dikeyUzaklık=100
cik.yıldız.uçSayısı=8
cik.yıldız.renk="#00688b"
cik.yıldız.çiz()
Çokgen Nesnesi
Özellikleri
- yatayUzaklık
- dikeyUzaklık
- kenarSayısı
- kenarUzunluğu
- renk
Metodu
- çiz()
Kullanımı
cik.çokgen.yatayUzaklık=130
cik.çokgen.dikeyUzaklık=120
cik.çokgen.kenarSayısı=9
cik.çokgen.kenarUzunluğu=110
cik.çokgen.renk="#7cfc00"
cik.çokgen.çiz()
Resim Metotları
CiK kütüphanesinde tanımlı resimler bulunmaktadır. Zaman içinde bu resimlerin sayısı artacaktır. Resimler sayfaya metotlar sayesinde eklenir. Bu metotlara "cik.resim." yazarak erişilir. Metot isimleri aynı zamanda resimlerin isimleridir. Resim metotları 2 adet parametre alır. Bu parametreler resmin sayfanın yatay ve dikeyden uzunluğunu belirtir. Eğer parametreler belirtilmemişse tanımlı değerleriyle gösterilir:
cik.resim.balık()
cik.resim.köpek()
cik.resim.kedi()
cik.resim.penguen()
cik.resim.gemi()
cik.resim.tramvay()
cik.resim.karavan()
cik.resim.okulOtobüsü()
cik.resim.elma()
cik.resim.limon()
cik.resim.portakal()
