WPF Text Editor Uygulaması
Bu WPF ile ikinci uygulamamız. Bu
uygulamamızda yukarıdaki gibi bir text editor
yapıcaz. Bold , italic ,kes , kopyala , yapıştır gibi işlemler için
fazlaca C# kodu kullanmamız gerekiyordu eğer bunu Windowss Form Application ile
yapmış olsaydık! WPF de bizim için bu event ları bir kütüphanede tanımlamışlar ve bizim işimizi oldukça kolaylaştırmışlar. Bu
uygulamada tek bir yer hariç C# kodu ile uğraşmayacağız ve çok az bir Xaml
koduyla bu işi halledeceğiz.
Bu tanımlanmış kütüphane
içerisinde aşağıdaki gibi hazır komutlar bulunmaktadır;
Uygulama komutları : New,Cut,Copy,Save,Paste,Open,Close
Düzenleme Komutları: ToggleBold,ToggleItalic,ToggleUnderline
MultiMedia Komutları: Play, Stop , Rewind , FastForward …
gibi
Tabi
bunlar tanımlanmış ama fonksiyonel olarak Save , Close gibi komutları kullanabilmek için
C# kodları yazmalıyız. Cut , Copy gibi
komutları ise direk kullanabiliyoruz.
Bu
komutlar sayesinde biz uygulamalarımızda kes , kopyala , yapıştır , italic ,
bold ve eğer varsa ses , video için stop , play … benzeri komutları Xaml
içerisin de kullanıyoruz. Xaml kodunun bitmiş hali aşağıda , açıklamalar ise
onun altında.
<Window x:Class="text_edit2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow"
Height="350" Width="525">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Menu Grid.Row="0">
<MenuItem Header="Dosya">
<MenuItem Header="Çıkış" Command
="Close"/>
</MenuItem>
<MenuItem Header="Düzenle">
<MenuItem Header="Kes" Command="Cut"/>
<MenuItem Header="Kopyala" Command="Copy"/>
<MenuItem Header="Yapıştır" Command="Paste"/>
<Separator/>
<MenuItem Header="Bold" Command="ToggleBold" FontWeight="Bold"
/>
<MenuItem Header="Italic" Command="ToggleItalic" FontStyle="Italic"
/>
</MenuItem>
</Menu>
<ToolBar Grid.Row="1">
<Button Command="Cut">Kes</Button>
<Button Command="Copy">Kopyala</Button>
<Button Command="Paste">Yapıştır</Button>
<Separator/>
<Button FontWeight="Bold" Command="ToggleBold">Bold</Button>
<Button FontStyle="Italic" Command="ToggleItalic">Italic</Button>
</ToolBar>
<RichTextBox Grid.Row="2" Margin="5"/>
</Grid>
<Window.CommandBindings>
<CommandBinding Command="Close" Executed="CommandBinding_Executed_1"/>
</Window.CommandBindings>
</Window>
|
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
|
Bu kod ile biz Grid içerisinde
uzunluğu değişen 3 satır eklemiş olduk. Bu satırlardan 1. ye Menu , 2. ye ToolBar , 3. ye de RichTextBox ımızı
ekleyeceğiz. En son eklenen satırdaki “*” dikkatinizi çekmiştir. Bu bizim o satıra eklenen ögemizin
daha geniş bir şekilde yerleştirilmesini sağlıyor. “Auto” ise en ideal şekilde yerleşimi sağlıyor.
<Menu Grid.Row="0">
<MenuItem Header="Dosya">
<MenuItem Header="Çıkış" Command="Close"/>
</MenuItem>
<MenuItem Header="Düzenle">
<MenuItem Header="Kes" Command="Cut"/>
<MenuItem Header="Kopyala" Command="Copy"/>
<MenuItem Header="Yapıştır" Command="Paste"/>
<Separator/>
<MenuItem Header="Bold" Command="ToggleBold" FontWeight="Bold"
/>
<MenuItem Header="Italic" Command="ToggleItalic" FontStyle="Italic"/>
</MenuItem>
|
Görüldüğü gibi Grid.Row = 0 yani
birinci satıra kendisi ayarlayarak Menu ögemizi yerleştirdi. Daha sonra Item
ile Menü de ne gibi sekmeler bulunacaksa bunları belirtiyoruz. Tabi ki
“Command” ile basıldığında ne yapılacaksa (event handling) bunu da
belirtiyoruz. Örneğin Yapıştır için Command = “Paste” gibi. Separator etiketi ise
resimde de gözüktüğü gibi “|” veya düz çizgi şeklinde yerine göre bir ayraç
niteliği taşır. Sadece ögeleri sınıflandırmak için kullanılan görseldir. Bunun
haricinde burada başka bir işlevi yok. Aşağıdaki resimde Yapıştır ile Bold arasındaki Separator dır.
<ToolBar Grid.Row="1">
<Button Command="Cut">Kes</Button>
<Button Command="Copy">Kopyala</Button>
<Button Command="Paste">Yapıştır</Button>
<Separator/>
<Button FontWeight="Bold" Command="ToggleBold">Bold</Button>
<Button FontStyle="Italic" Command="ToggleItalic">Italic</Button>
</ToolBar>
|
Yukarıdaki
kodda ise Grid deki 1. satıra ToolBar ekliyor. Bu ToolBar ımızda bizim kes ,
kopyala gibi butonlarımız bulunuyor. Buradaki Separator “|” şeklinde gözükmektedir.
<RichTextBox Grid.Row="2" Margin="5"/>
|
Bu da
son Grid satırımıza(2 ye) RichTextbox ımızı ekliyor. Margin bizim RichTextBox ögemizin sağ , sol , alt ve
üstten uzaklığını belirliyor.
Uygulamamız
hazır ancak menüdeki DosyaàÇıkış a bastığımızda uygulamanın sonlanmasını C# ile yapmalıyız. Bunun için aşağıdaki kod
satırlarını ekliyoruz.
<Window.CommandBindings>
<CommandBinding Command="Close" Executed="closeCommand_Executed"/> </Window.CommandBindings>
|
Bu kod bizim çıkışa bastığımızda
programın kapatılmasını sağlayacak olan fonksiyona götüren komut satırıdır. Biz
burada bir Cammand Binding ekliyoruz
ve Execute kullanarak
C# kısmındaki event handle
fonksiyonumuz çağırılıyor ve buradan uygulama sonlandırılıyor. closeCommand_Executed
fonksiyonunu kendisi siz yazarken tamamlayacaktır. Bu satırları yazdıktan
satırlardan birisi seçili iken Properties ‘ e gelip Event
Handlers kısmında aşağıdaki gibi fonksiyonun yazıldığını görebilirsiniz.
Bunun üzerine çift tıklayarak C# kısmına giderek aşağıdaki komutu yazalım.
private void
closeCommand_Executed(object sender, ExecutedRoutedEventArgs e)
{
Application.Current.Shutdown();
}
|
Uygulamamız
hazır! Çalıştırıp sonuçları gözlemleyebiliriz. Bu editor için Save komutu gibi komutlarıda kullanabilir ancak
bunlar içinde hemen üstteki yaptığımız gibi C# kodlarına ihityacımız vardır.
Şimdilik yapacaklarımız bu kadar diğer bir WPF yazımızda başka bir uygulamayla
devam ederiz.
0 yorum:
Yorum Gönder