Ana içeriğe atla

WPF - Popup Kontrolü

Windows Presentation Foundation ile uygulama geliştirirken kullanabileceğimiz kontrol paleti işlerimizi rahatlıkla yürütebileceğimiz kadar geniştir. Araç kutusu içerisinde yer alan kontroller Framework sürümünü arttırdıkça ve codeplex, code.msdn gibi sitelerde yer alan projeler yardımı ile daha da artmaya devam etmektedir. WPF 'in grafiksel ve görsel gücüne günlük yaşantı da kullanılan kontrollerin de kullanılabilir olması sayesinde en basit uygulamalardan en karmaşık uygulamalara kadar geliştirilebilme olanağı tanınıyor.

Bu yazımızda WPF üzerinde kullanılan en temel kontrollerin Popup kontrolünün özelliklerini inceliyor ve nasıl kullanıldığını, özellikleri incelemeye çalışıyor olacağız.

WPF - Popup Control
Popup kontrolü web uygulamalarında en sık kullandığımız kontrollerden biridir. Web uygulamalarında javascript yardımı ile alternatif bir bilgilendirme ya da işlem yapılacak olan ayrı bir pencere açılması sonucunda işlem gerçekleşebiliyor. Ya da biraz daha farklı düşünürsek ajax kullanıyoruz ve üye girişi yaptırmak istiyoruz. Popup içerisinde değerleri girdirebiliyoruz. Aynı istekleri masaüstü uygulamalarda da istenmesi durumu söz konusu olabiliyor. Hazırlanan klasik masaüstü uygulamalarında eğer 3. parti bir bileşen aracı ya da kendilerimizin özel olarak geliştirmiş olduğu bileşen kullanmıyorsak, form üzerindeki herhangi bir kontrole tıklanması sonucunda ya da bir işlem sonrasında child pencere çıkartarak bu işlemleri gerçekleştirmeye çalışıyoruz. Bu işlem biraz uğraştırıcı gibi geldi hep bana. Bu sebepten ötürü WPF ile uygulama geliştirirken en çok güze hoş gelen Popup kontrolü olmuştu. Web uygulamalarında olduğup gibi basitçe WPF Form uygulamalarında Popup kontrolünü kullanabiliyor ve işlemlerimizi gerçekleştirebiliyoruz.

Popup kontrolünü WPF projesinde kullanabilmek için XAML kod tarafına <Popup></Popup> eklemek yeterli olacaktır. Width ve Height özellikleri açılacak olan pencerenin hangi boyutlarda olacağını belirtir. Name özelliği ise kod tarafından eklenen popup kontrolüne erişilmek gerekirse kullanılacak olan ismi belirlenen bölümdür. Ayrıca unutulmaması gereken Name özelliğini vermiş olduğumuz değer form üzerinde kullanılmayan bir değer olmalıdır. HorizontalAlignment ve VerticalAlignment özellikleri açılan pencerenin formun yatay ve dikey olarak nasıl duracağını belirtmeye olanak tanır. Şimdi ise bahsettiğimiz bu özelliklerden yararlanarak formun üzerine bir Popup kontrolü ekleyelim.

Popup.xaml
<Popup Margin="10,10,0,3" Name="Popup1" Width="190" Height="200" HorizontalAlignment="Left" VerticalAlignment="Top" />

Popup kontrolünü yukarıda olduğu gibi basitçe kullanabiliyoruz. Ancak eksik bıraktığımız bir özelilk daha var ki o en önemlisi. Popup nasıl açılacak. Bu işlemin gerçekleşebilmesi için IsOpen özelliğine True, False değerlerinden birini atamak yeterli olacaktır. Ayrıca popup kontrolünü oluşturduk ancak bizler bu popup kontrolü içerisinde diğer kontrolleri de kullanmak istiyoruz. Bu işlem için ise Popup markupunu /> ile kapatmadan <Popup></Popup> aralığına yazmak yeterli olacaktır.

Popup.xaml
<Popup Margin="10,10,0,3" Name="Popup1" Width="190" Height="200" HorizontalAlignment="Left" VerticalAlignment="Top" IsOpen="True">
    <TextBlock Text="Hede Hüdü Sertur" Background="LightBlue"/>
</Popup>

İlk popup uygulamamızı hazırlamış oluyoruz. Çalıştırdığımızda ekran görüntüsü aşağıdaki gibi olacaktır.



Ayrıca popup kontrolünü yalnızca bu şekilde kullanılması gerek değildi.Layout kontrollerinden herhangi biri kullanılarak ta kullanılabilir. Ayrıca sadece tek bir kontrol değil. İsteğimiz doğrultusunda da bol bol kontrol kullanabiliriz. Popup kontrolü yalnız başına kullanılabilmekle birlikte bir kontrolün içerisinde de kullanılabilmesi mümkündür. Örneklemek gerekirse,

Popup.xaml
<Grid>
    <Button HorizontalAlignment="Left" Click="Button_Click" Width="150" Height="30"
           Margin="10,10,0,0" >
        <StackPanel>
            <Popup Margin="10,10,0,13" Name="Popup1" HorizontalAlignment="Left" VerticalAlignment="Top" Width="194" Height="200" IsOpen="True">
                <StackPanel>
                    <TextBlock Name="McTextBlock" Background="LightBlue" >
                         Hede Hüdü Sertur
                    </TextBlock>
                    <Button Content="Bu buton popup in içerisindedir." />
                </StackPanel>
            </Popup>
        </StackPanel>
    </Button>
</Grid>

Yukarıda hazırlamış olduğumuz kod parçası popup kontrolünü hemen çalıştırmaktadır. Ancak istersen Popup ı içerisine yerleştirdiğimiz kontrole tıklandığı anda açılmasınında sağlanabilmesi mümkündür. Bunun için butona tıklandığında IsOpen özelliğinin o anki değerini değiştirmek yeterli olacaktır.

Popup kontorolü ile yapabileceklerimizi biraz daha ileriyi götürüp WPF 'in diğer özelliklerinden de yararlanarak örnek bir uygulama hazırlayalım. İlk olarak form üzerinde bir buton ve CheckBox kontrol ekliyoruz. CheckBox kontrolünden seçili olan değere göre animasyon çıkacak veya çıkmayacaktır. Sonrasında ise animasyonlu bir şekilde popup kontrolü gelecek ve animasyonunu tamamlayacaktır. Şimdi bu basit işlemi yapacak olan XAML kodu hazırlayalım.

PopupAnimation.xaml
<Window x:Class="WPFControls.Popup"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Popup" Height="300" Width="300" Loaded="Window_Loaded">
    <StackPanel>
        <CheckBox Name="PCheckBox" Margin="10,10,0,0" Content="Popup Pencere"/>
            <Button HorizontalAlignment="Left" Width="129" Margin="10,10,0,0">
                <Button.Triggers>
                    <EventTrigger RoutedEvent="Button.Click">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation
                                    Storyboard.TargetName="theTransform"
                                    Storyboard.TargetProperty="(RotateTransform.Angle)"
                                    From="0" To="360" Duration="0:0:5" AutoReverse="True"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Button.Triggers>
                Animasyonu Başlat
            </Button>
            <Popup IsOpen="{Binding ElementName=PCheckBox,Path=IsChecked}"
                PlacementTarget="{Binding ElementName=PCheckBox}"
                AllowsTransparency="True"
                PopupAnimation="Slide"
                HorizontalOffset="150"
                VerticalOffset="100"
            >

                <Canvas Width="100" Height="100" Background="Green" Margin="150">
                    <Canvas.RenderTransform>
                        <RotateTransform x:Name="theTransform" />
                    </Canvas.RenderTransform>
                    <TextBlock TextWrapping="Wrap" Foreground="LightGray">
                        Popup Dönüyoooor. :)
                    </TextBlock>
                </Canvas>
            </Popup>

     </StackPanel>
</Window>

Hazırlamış olduğumız Popup kontrollü animasyon uygulamasını çalıştırdığımızda aşağıdaki gibi bir ekran görüntüsü elde ederiz.



Sonuç olarak bu yazımızda WPF kontrollerinden Popup kontrolünü incelemeye çalıştık. Web uygulamalarında sıklıkla kullanmış olduğumuz Popup özelliğini bir masaüstü uygulama da kullanabilmenin ne gibi avantajları olduğuna, nasıl kullanılabileceğine ve animasyon işlemlerinin popup kontrolü kullanılırken nasıl kullanabileceğimizi detaylı bir biçimde incelemeye çalıştık.

Umarım yararlı olabilmiştir.

Yorumlar

Bu blogdaki popüler yayınlar

Olasılıksız - Kitap Yorum

Olasılıksız hayatımda okuduğum en iyi kitaptı. Tek çırpıda hiç sıkılmadan, eğlenerek okudum bu kitabı, tavsiyem sizinde okumanız.Kitabın kapağı ve içeriği ile ilgili kısa bilgi aşağıdadır.Olasılık, tahmin, düşünceler, nöbetler, karışıklıklar, ileriyi görebilme zannı, dejavu ve tabii ki olasılıksız şeyler. Bu kelimelerle içli dışlı olabileceğiniz, bütün bu kelimelerin yaşamdaki yerini kavrayabileceğiniz müthiş bir uyarlama.Adam Fawer' ın ortaya çıkardığı bu uyarlama romanın müthiş bir çalışmanın ve araştırmanın sonucu ortaya çıktığının kitabın başından sonuna kadar farkındasınız. Bu uyarlamasını, derin araştırmalarıyla birleştirip romanı tekdüzelikten çıkarıp müthiş bir yere koyduğu için de Fawer' a müteşekkir oluveriyorsunuz. Sıkıcı diye nitelendirebileceğiniz teorik bilgileri bile bir çırpıda okuyuveriyorsunuz. Teorik bilgiler dahi olaylarla sonuna kadar bağlantılı aktarılmış. Tekdüzelikten çıkmış bir roman; olasılıksız. Her an olayın kurgusunun değişmesi olasılık dahilinde. …

.Net 3.5 SP1 – Full Install Packages (Tam Kurulum)

.Net Framework 3.5 SP1 ‘i bilgisayarınıza kurmak istediğinizde normal şartlar altında Microsoft ‘un sitesinde 2.7 mb ‘lik bir dosya indirir ve kurulum işlemlerinizi bu dosya üzerinden yaparsınız. Ancak bu indirmiş oluğunuz dosya yaklaşık 220 mb ‘lik veriyi internetten indirerek kurulum yapmaktadır. İnternet çıkışına izin verilmeyen kurumlar ve kuruluşlar için bu durum bir sıkıntı oluşturmaktadır. Bu sebepten ötürü aşağıdaki link yardımı ile tam yükleme paketini indirdikten sonra hiç internet ihtiyacınız olmadan .Net 3.5 SP1 ‘i kurabilmeniz mümkün olacaktır.Link

Çoklu Dil Desteği – Veri Tabanı Tasarım Örnekleri ile

Zaman içerisinde karşımıza çok farklı projeler gelebilmektedir. Ancak bu projeler içerisinde özellikle de global ölçekli ya da bu ölçekte uygulama geliştiren firmalarda bazı temel gereksinimler sürekli olarak karşımıza çıkabilmektedir. Bu gereksinimlerden biri ve belki de en önemlisi olan çoklu dil desteğinin veri tabanı (DB) katmanında nasıl yapıldığını kısa ve hızlıca inceliyor olacağız.Öncelikle çoklu dil desteği dediğimizde aklımıza gelen ilk çözüm yolu *.resx dosyalarını kullanmak gelmektedir. Ancak bu uzaktan yönetilen ya da anlık olarak metin değişikliği gereksinimi bulunan uygulamalarda bazı ufak problemler çıkartabilmektedir.Ne gibi problemler derseniz; iki grupta inceleyebiliriz. Web projeleri ve windows üzerinde çalışan projeler.Web projelerinde IIS üzerinde yer alan bir *.resx dosyasını değiştirdiğinizde son kullanıcı tarafında etkisi hemen görülmeyebilir. Cache mekanizmaları sebebiyle ortalama 15-30 dakika arasında bir görüntüleme süre farkı ile karşılaşabiliriz. Faha köt…