Microsoft Expression Blend ile WPF Kullanimi

Bilindigi uzere Microsoft Expression ile birlikte Microsoft Visual Studio ortak calisarak bircok tasarima donuk uygulamalara hareket getirmislerdir. Expression paketi ile birlikte gelen uygulamalar soyle; - Microsoft Expression Web : Web sitesi tasarimcisi ve HTML duzenleyicisi olarak kullanilir. - Microsoft Expression Blend + SketchFlow :  Windows Presentation Foundation (WPF) ve SilverLight uygulamalari icin gorsel kullanici ara yuzu yapicisi olarak kullanilir. - Microsoft Expression Design : Grid ve vektor grafiklerinde duzenleyici rollerde kullanilir. - Microsoft Expression Encoder : Media iceriklerini yazmak icin digital video kodlayicilardan olusur.

Birazdan yapacagimiz uygulamada Microsoft Expression Blend tarafinda uygulamamizin tasarimin kismini gerceklestiricez. Uygulamanin kod tarafini ise Visual Studio ile gerceklestirecegiz.  

Oncelikle Microsoft Expression Blend'te uygulamamizi tasarlamaya basliyoruz. Bunun icin tasarim ekranina, Bununla birlikte iki button ekliyor ve isimlerini belirtiyoruz.Assets sekmesinden bir Rectangle nesne aliyoruz ve uzerine de MediaElement ekliyoruz. XAML penceresinde buttonlarin content isimlerinide ayni sekilde belirliyoruz. Ayni zamanda MediaElement'in ismini belirliyoruz ki kod tarafindan metodlarimizi bu nesneye yonlendirebilelim.  

XAML Kaynak Kodu ;

<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Class="WpfApplication1.MainWindow" x:Name="Window" Title="MainWindow" Width="640" Height="480"> <Grid x:Name="LayoutRoot" RenderTransformOrigin="0.522,0.639"> <Button x:Name="

oynatoynat

" Content="

oynatoynat

"  HorizontalAlignment="Left" Margin="33.5,218.5,0,190.5" Width="121"/> <Button x:Name="

durdurdurdur

" Content="

durdurdurdur

"  Margin="205,221,306,188"/> <Rectangle Fill="#FFF4F4F5" Margin="33.5,31.5,305,0"  Stroke="Black" Height="177.5" VerticalAlignment="Top"/> <MediaElement Height="142"  Margin="50,48,0,0" Name ="

videovideo

"  VerticalAlignment="Top" HorizontalAlignment="Left" Width="260"/> </Grid> </Window>

Xaml Code View penceresinde nesnelerin isimlerini belirledikten sonra MediaElement nesnesinin Properties'inden Source kismindan herhangir bir video'yu ekliyoruz. Sonrasinda ise Project sekmesinden projemizin isminin uzerinde sag click yapiyoruz ve Edit in Visual Studio'yu secerek Visual Studio' da ki WPF kod tasarimi kismina yonlendirilmis oluyoruz. Hemen ardindan asagida ki kodlari code view ekraninda olusturmaya basliyoruz...

MainWindow.Xaml.Cs Kaynak Kodu ;

using System; using System.Collections.Generic; using System.Text; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Shapes; namespace WpfApplication1 { public partial class MainWindow : Window { public MainWindow() { this.InitializeComponent(); video.LoadedBehavior = MediaState.Manual; this.oynat.Click += new RoutedEventHandler(oynat_Click); this.durdur.Click += new RoutedEventHandler(durdur_Click); } void oynat_Click(object sender, RoutedEventArgs e) { video.Play(); } void durdur_Click(object sender, RoutedEventArgs e) { video.Stop(); }}}

Komutlari yazilip uygulama derlendikten sonra ki ekran ciktisi yandaki gibi olacaktir. Ve oynat butonu ile videomuz oynamaya baslayacaktir. Durdur butonumuz ile videomuz sonlandirilacaktir.