Makale Özeti

Bu yazımızda Windows Phone 7 ortamında basit bir Accelerometer kullanımı ile uygulama ekranlarında "Orientation" değişikliklerin nasıl yapılabildiğine değineceğiz.

Makale

Bugün neredeyse her cep telefonunda bir Accelerometer mevcut. Böylece en basit işlevsellik olarak telefonumuzu yana çevirdiğimizde algılamasını ve ekranı da ona göre toparlamasını isteyebiliriz. İtiraf etmek gerekirse zaten Accelerometer sahibi olup da bu işi yapmayan telefon kalmadı gibi :) Diğer yandan önemli olan bizim uygulamalarımızda bu durumu algılayıp uygun tepkiler verebilmemiz. Bunun için Windows Phone 7 üzerinde uygulama geliştirirken de kullanabileceimiz API'ler mevcut. İşte bu makalemizde bu API'lere göz atarak basit bir resim gösteren uygulama yazacağız.

[XAML]

<Grid x:Name="ContentGrid" Grid.Row="1">

    <Image HorizontalAlignment="Stretch" Name="image1"

          Stretch="Uniform" VerticalAlignment="Stretch"

          Source="/WindowsPhoneApplication5;component/Images/Koala.jpg" />

</Grid>

Yukarıda gördüğünüz kod ile ekrana bir Image nesnesi koyarak projemize eklediğimiz bir resmi göstermesini sağlıyoruz. Bu esnada Image nesnesinin her tarafa genişleyebilmesi için tüm Alignment özellikleri Stretch olarak ayarlanmış durumda fakat diğer yandan da resmin en boy oranı bozulmadan büyütülmesi için Stretch özelliği de Uniform olarak ayarlanmış durumda. Peki bu şekli ile uygulamamızı çalıştırdığımızda neler oluyor?

Farklı pozisyonlarda uygulamamız.
Farklı pozisyonlarda uygulamamız.

Eh herşey süper gibi duruyor. Resmimiz her şekilde kendine kalan alanda en büyük şekilde gözükmeye çalışıyor. Fakat genelde kullanıcıların telefonu yana çevirmiş olarak kullanmadıklarını :) ve eğer yana çeviriyorlarsa büyük ihtimal resmi ekrana yayıp daha geniş görmek istediklerini düşünebilir miyiz? Kesinlikle :) İşte bu durumda bizim kullanıcının telefonu çevirdiğini anlamamız, hangi tarafa çevirdiğinizi öğrenmemiz ve ona göre ekranı tekrar toparlamamız gerekecek. Hadi bakalım, başlayalım.

[C#]

        public MainPage()

        {

            InitializeComponent();

 

            SupportedOrientations = SupportedPageOrientation.Portrait | SupportedPageOrientation.Landscape;

 

            this.OrientationChanging += new EventHandler<OrientationChangedEventArgs>(MainPage_OrientationChanging);

        }

 

        void MainPage_OrientationChanging(object sender, OrientationChangedEventArgs e)

        {

            if (e.Orientation == PageOrientation.LandscapeLeft ||e.Orientation == PageOrientation.LandscapeRight )

            {

                TitleGrid.Visibility = System.Windows.Visibility.Collapsed;

                Grid.SetRow(ContentGrid, 0);

                Grid.SetRowSpan(ContentGrid, 2);

            }

            else

            {

                TitleGrid.Visibility = System.Windows.Visibility.Visible ;

                Grid.SetRow(ContentGrid, 1);

                Grid.SetRowSpan(ContentGrid, 1);

            }

        }

Kodumuzda ilk olarak sayfanın OrientationChanging event'ına bir listener ataçlıyoruz. Sayfamızın zaten başında SupportedOrientations kısmında hem yatay hem de dikey desteği olduğu için telefon sağa veya sola çevrildiği anda bu event çalışacaktır. Event'ımız çalıştıktan sonra yapmamız gereken ise telefonun hangi yöne nasıl döndüğünü angılayıp sonra da ekranda gerekli değişiklikleri yapmak. Bunun için söz konusu eventa gelen OrientationChangedEventArgs parametresi üzerinden Orientation özelliğini kullanabiliriz. Eğer telefon sola veya sağa döndürülmüş ve yan tutuluyorsa basit bir şekilde ekranın üstündeki yazıyı kaldırıp resmimizin bulunduğu kısmı ana sayfada ekrana yayıyoruz. Aksi durumda, yani telefon tekrar normal şeklinde tutulduğunda ise eski ayarları tekrar yüklüyoruz. Böylece çok basit bir şekilde telefonun durumunu algılayıp uygulamamızın tepki vermesini sağladık.

Farklı tutuşlara göre tepki veren uygulamamız.
Farklı tutuşlara göre tepki veren uygulamamız.

Sanırım son bir sorun kaldı. Dikkatinizi çektiyse örnek uygulamamızda bir de menü var (ApplicatioBar) ve söz konusu menü içerisindeki düğmeler bile telefonun durumuna göre sağa sola dönüyorlar fakat ekrandan yer kaybetmemiz neden oluyorlar. Aslında biz ekranda uygulamamızın ana yüzeyi dışında hiçbirşey gözüksün istemiyoruz. İşte bu gibi bir durumda uygulamayı tam ekran moduna alabilirsiniz.

[C#]

        void MainPage_OrientationChanging(object sender, OrientationChangedEventArgs e)

        {

            if (e.Orientation == PageOrientation.LandscapeLeft ||e.Orientation == PageOrientation.LandscapeRight )

            {

                TitleGrid.Visibility = System.Windows.Visibility.Collapsed;

                Grid.SetRow(ContentGrid, 0);

                Grid.SetRowSpan(ContentGrid, 2);

                this.FullScreen = true;

            }

            else

            {

                TitleGrid.Visibility = System.Windows.Visibility.Visible ;

                Grid.SetRow(ContentGrid, 1);

                Grid.SetRowSpan(ContentGrid, 1);

                this.FullScreen = false;

            }

        }

Yukarıda gördüğünüz şekilde basit bir değişiklik uygulamanın farklı durumda tamamen tam ekran çalışmasını sağlayabilir. Böylece ekranda uygulamamızın ana ekranı dışında hiçbirşey gözükmeyecektir.

FullScreen modunda uygulamamızın görünüşü.
FullScreen modunda uygulamamızın görünüşü.