Canvas | Engin Polat\'ın Windows 8 , Windows Phone 8 ve C# içerikli programcılık sitesi

Arşiv

Etiketlenen yazılar canvas

HTML5 sayfasında canvas ve javascript kullanarak çizim alanı oluşturma

08 May 2016 Yorum yapılmamış

Bir html sayfasında canvas elementi ve javascript kullanarak, mouse ile çizim yapabileceğimiz bir alan oluşturabiliriz. Örneğin, web sayfası üzerinde kullanıcının imzasını atabileceği bir alan oluşturabilmek mümkün.

Hemen yeni bir html dosyası oluşturalım ve aşağıdaki kodları yazalım;

Böylece sayfa üzerinde 400px x 400px alanında oluşturduğumuz canvas elementi üzerine mouse kullanarak çizim yapabileceğiz.

Unity3D ile sahneye saat ve gerisayım eklemek

27 January 2016 Yorum yapılmamış

Bu makaleyi okumadan önce Unity3D Kategorisindeki diğer makalelerimi okumanızı tavsiye ederim.

Bu makale sonunda sahneye saati ve 60 saniyeden geri sayımı gösteren iki yazı koyabileceksiniz.

Öncelikle Unity3D‘yi açarak bir oyun projesi oluşturuyoruz;

Hierarchy panelinden Main Camera nesnesini seçiyor ve Projection özelliğinde Ortographic değeri olduğunu kontrol ediyoruz. Scene alanında tam kamera’nın arkasından bakmak için GameObject menüsü altından Align View to Selected menüsüne tıklıyoruz.

Sahneye bir Text nesnesi eklemek için Hierarchy panelinde boş bir yere sağ tuşla tıklıyor ve UI kategorisi altından Text menüsünü seçiyoruz.

Oluşturulan Canvas ve Text‘in kamera’nın gördüğü alanın içerisinde olmasını sağlamak için Canvas seçili iken Render Mode özelliğine Screen Space – Camera değerini giriyoruz. Ayrıca Render Camera özelliğine Hierarchy panelinden Main Camera nesnesini sürükleyip bırakıyoruz.

Hierarchy panelinden Text nesnesini seçip Inspector panelinde gözüken Rect Transform kategorisi altından sahnede gözükeceği konumu belirliyoruz. Örneğin sahnenin sol üst köşesinde olması için left sütunu ile top satırının kesiştiği hücreye tıklıyoruz.

Hierarchy panelinde gözüken Text nesnesine isim olarak TimerText değerini verdikten sonra Edit menüsü altından Duplicate seçeneğini seçerek aynı nesneden bir tane daha oluşturuyoruz.

Yeni oluşturduğumuz Text nesnesine isim olarak CountdownText verip, sahnenin sağ üst köşesine hizalıyoruz.

Her iki Text nesnesinin de Inspector panelinden erişilebilen Font, Font Size ve Color değerlerini değiştirerek, sahnede büyük beyaz harfler gösterecek hale getiriyoruz.

Hierarchy panelinden Canvas nesnesini seçip Inspector panelinden Add Component butonuna tıklıyoruz ve New Script seçeneğini seçiyoruz.

Canvas nesnesine eklediğimiz yeni script’e TimeManager ismini verebiliriz.

TimeManager.cs dosyasını açarak için aşağıdaki kodları yazıyoruz;

using System;
using UnityEngine;
using UnityEngine.UI;

public class TimeManager : MonoBehaviour
{
	Text timerText;
	Text countdownText;

	float countdownTo = 60.0F;

	void Start()
	{
		timerText = GameObject.Find("TimerText").GetComponent<Text>();
		countdownText = GameObject.Find("CountdownText").GetComponent<Text>();
	}

	void Update()
	{
		countdownTo -= Time.deltaTime;

		if (countdownTo > 0)
		{
			countdownText.text = countdownTo.ToString();
		}

		timerText.text = DateTime.Now.ToString("hh:MM:ss");
	}
}

Öncelikle Start() methodunda ismi TimerText ve CountdownText olan iki nesneyi bulup içlerindeki Text elementlerine erişiyoruz ve bunları birer değişkende saklıyoruz. Böylece daha sonra bu nesnelere kolay bir şekilde erişebileceğiz.

Update() methodunda 60 saniyeden geri sayma yapabilmek için countdownTo değişkeninden geçen süreyi çıkartıyoruz ve elde ettiğimiz değeri sahnedeki CountdownText nesnesinde gösteriyoruz.

Son olarak Update() methodunda DateTime sınıfının Now özelliğinden elde ettiğimiz değeri saat:dakika:saniye formatına çeviriyoruz ve sahnedeki TimerText nesnesinde gösteriyoruz.

Eğer oyunu başlatacak olursak 60 saniyeden geri sayım ve bilgisayarın saati ekranda gözükecek;