Bu WPF ile üçüncü uygulamamız. Bu
uygulamamızda basit bir paint aracı yaparak WPF ile Mouse event larımızı nasıl
kontrol ediyor ve kullanıyoruz bunlara bakıcaz.Yapıcağımız uygulamanın bitmiş hali aşağıdaki gibidir.
Öncelikle
yeni bir WPF projesi oluşturalım. Oluşturulan Projemizde ön tanımlı olarak
bulunan Grid i siliyoruz ve Window etiketi içerisine Aşağıdaki gibi bir Canvas ekliyoruz. Canvas ın ismini cnvs
, arka plan rengini ise Azure olarak
ayarlıyorum. Burada renkten ziyade Canvas a verdiğimiz isim önemlidir. Eğer ki isim vermezsek C#
kodu yazarken Canvas a erişemeyiz.
<Canvas Name="cnvs" Background="Azure">
</Canvas>
|
Canvas ı ekledikten sonra paint
için kullanacağımız eventlara göz atalım. Düşündüğümüzde Mouse un sol butonuna
tıkladığımızda ve basılı tutarak hareket ettirdiğimizde imlecin geçtiği noktalara
bir doğru çizmesi gerekiyor , bıraktığımızda ise çizim işleminin de sonlanması
gerekiyor. Xaml içerisinde MouseLeftButtonDown , basılı
iken hareket ettiriliyorsa MouseMove
ve sol butona tıklama işlemi bitmişse MouseLeftButtonUp elementlerini tanımlamalı ve
bunlara birer C# event handler fonksiyonları ekleyerek yapmak istediğimizi
yapmış oluruz. Öncelikle bu elementleri yukarıdaki Canvas içerisinde yazıyorum , aşağıdaki ise son
hali.
<Canvas Name="cnvs" Background="Azure" MouseLeftButtonDown="cnvs_MouseLeftButtonDown_1" MouseMove="cnvs_MouseMove_1" MouseLeftButtonUp="cnvs_MouseLeftButtonUp_1" MouseDown="cnvs_MouseDown_1">
</Canvas>
|
Bu
Elementlerin karşılığı olan tırnak içerisindeki fonksiyon adlarını program
otomatik tamamlayacaktır. Buradakinden farklı isimlerde kullanabiliriz. Şimdi
renk seçimi için çeşitli dörtgenler ekleyelim ve Xaml kısmındaki işimiz bitsin.
Canvas etiketleri
içerisine aşağıdaki gibi sırası ile kodlarımı ekliyorum.
<Rectangle Stroke="Black" Width="25" Height="25" Canvas.Left="5" Canvas.Top="5" Fill="Red"
/>
|
Rectangle ile dörtgenim oluşturuluyor. Stroke buradaki dörtgenin çerçeve rengini , Canvas.Left soldan ne kadar uzakta bulunduğunu , Canvas.Top ise üst taraftan ne kadar uzakta
olduğu belirtiyor. Bu kodu kopyalayıp hemen altına yapıştırıp birkaç yeri
değiştirerek en üstteki resim gibi çeşitli renkler elde ediyorum.
<Rectangle Stroke="Black" Width="25" Height="25" Canvas.Left="5" Canvas.Top="5" Fill="Red"
/>
<Rectangle Stroke="Black" Width="25" Height="25" Canvas.Left="5" Canvas.Top="35" Fill="Green"
/>
<Rectangle Stroke="Black" Width="25" Height="25" Canvas.Left="5" Canvas.Top="65" Fill="Yellow"
/>
<Rectangle Stroke="Black" Width="25" Height="25" Canvas.Left="5" Canvas.Top="95" Fill="White"
/>
<Rectangle Stroke="Black" Width="25" Height="25" Canvas.Left="5" Canvas.Top="125" Fill="Blue"
/>
<Rectangle Stroke="Black" Width="25" Height="25" Canvas.Left="5" Canvas.Top="155" Fill="Black"
/>
|
Xaml
kısmı hazır şimdi yaptığımız değişiklikleri kaydedip C# kısmına geçelim.
Öncelikle kullanacağım değişkenleri tanımlıyorum.
Point nokta;
bool durum;
Brush
fırca = Brushes.Black;
|
Nokta şuan
ki imleç pozisyonunu , durum resim çizilecek mi çizilmeyecek mi , fırça da boyama
rengini belirtiyor.
Mouse sola
tıklandığında aşağıdaki gibi durumu true , noktanın yerini belirliyorum ve CaptureMouse() ile imlecin
bulunduğu yeri takip ediyorum.
private void
cnvs_MouseLeftButtonDown_1(object sender, MouseButtonEventArgs e)
{
durum = true;
nokta =
e.GetPosition(cnvs);
cnvs.CaptureMouse();
}
|
Mouse
basılı iken hareket ettirildiğinde (x1,y1) ile (x2,y2) arasında çizgimin
çizilmesini aşağıdaki kodlarla sağlıyorum.
private void cnvs_MouseMove_1(object sender, MouseEventArgs e)
{
if (durum)
{
Line line = new Line();
line.X1 = nokta.X;
line.Y1 = nokta.Y;
nokta = e.GetPosition(cnvs);
line.X2 = nokta.X;
line.Y2 = nokta.Y;
line.Stroke = fırca;
line.StrokeThickness = 10;
cnvs.Children.Add(line);
}
}
|
Mouse sola
artık tıklanmıyorsa aşağıdaki gibi durumu false yapıyorum ve ReleaseCaptueMouse()
fonksiyonu ile imleci takip etmeyi bırakıyorum.
private void
cnvs_MouseLeftButtonUp_1(object sender, MouseButtonEventArgs e)
{
durum = false;
cnvs.ReleaseMouseCapture();
}
|
Dörtgenlerdeki
renkleri aktifleştirmek için aşağıdaki gibi kodumu yazıyorum.
private void cnvs_MouseDown_1(object sender, MouseButtonEventArgs e)
{
var rect = e.Source as Rectangle;
if(rect != null)
{
fırca = rect.Fill;
}
else
{
durum = true;
nokta = e.GetPosition(cnvs);
cnvs.CaptureMouse();
}
}
|
Paint
aracımız hazır hale geldi. Bir sonraki WPF yazımızda değişik bir uygulamayla
devam ederiz. Sizlere kolay gelsin!
0 yorum:
Yorum Gönder