Center | Engin Polat\'ın Windows 8 , Windows Phone 8 ve C# içerikli programcılık sitesi

Arşiv

Etiketlenen yazılar center

Windows Phone 8 için Maps kullanımı

16 February 2013 Yorum yapılmamış

Yeni Maps API sayesinde Windows Phone 8 için harita tabanlı uygulamalar geliştirebiliyoruz.

Öncelikle WindowsPhoneMaps isimli yeni bir Windows Phone App projesi oluşturalım;

Windows Phone 8 App Project : Windows Phone Maps

Proje oluşturduktan sonra gelen Windows Phone Platform versiyon seçim penceresinde Windows Phone OS 8.0 seçeneğinin seçili olduğundan emin olmalıyız;

Windows Phone 8.0 SDK

Windows Phone 8 projemizde Map kontrolünü kullanabilmek için öncelikle ID_CAP_MAP Capability‘sini WMAppManifest.xml dosyasında etkinleştirmeliyiz;

WMAppManifest.xml : ID_CAP_MAP Capability

İlk olarak MainPage.xaml dosyasında phone:PhoneApplicationPage tag’ına

xmlns:maps="clr-namespace:Microsoft.Phone.Maps.Controls;assembly=Microsoft.Phone.Maps"

xml namespace‘ini eklememiz gerekiyor.

Artık Map kontrolünü ekranımıza ekleyebiliriz;

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,12">
	<maps:Map />
</Grid>

Ekrana eklediğimiz Map kontrolünün belli bir koordinatı göstermesi için Center özelliğini ayarlamamız gerekmektedir. İstanbul için örnek;

Center="41.0205, 29.0865"

Kodumuzun son hali;

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,12">
	<maps:Map Center="41.0205, 29.0865" />
</Grid>

Yakınlaşma miktarını ayarlamak için de ZoomLevel özelliğini kullanmamız gerekmektedir;

ZoomLevel="14"

ZoomLevel özelliği 1 ile 20 arasında değer almaktadır. 1 değeri ile en yakın zoom, 20 ile en uzak zoom ayarlamış oluruz.

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,12">
	<maps:Map Center="41.0205, 29.0865" ZoomLevel="14" />
</Grid>

Haritanın gösterim modunu CartographicMode özelliğine atayacağımız değer ile belirleyebiliriz. Varsayılan değeri Road olan CartographicMode özelliğine MapCartographicMode enum’ından şu değerler atanabilir;

  • Road
  • Aerial
  • Hybrid
  • Terrain
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,12">
	<maps:Map Center="41.0205, 29.0865" ZoomLevel="14" CartographicMode="Terrain" />
</Grid>

MapCartographicMode.RoadMapCartographicMode.AerialMapCartographicMode.HybridMapCartographicMode.Terrain

Ayrıca ColorMode özelliğine MapColorMode enum’ından Light veya Dark değerlerinden birini atayarak harita’nın aydınlık veya karanlık gözükmesini sağlayabiliriz.

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,12">
	<maps:Map ColorMode="Dark" />
</Grid>

MapColorMode.LightMapColorMode.Dark

Ayrıca Heading özelliğine 0 ile 360 arası değer atayarak haritanın yukarısında hangi yönün bulunacağını belirleyebiliriz. Örneğin, 0 değerini atayarak haritanın yukarısında Kuzey yönünün gözükmesini, 90 değerini atayarak Batı yönünün gözükmesini, 180 değerini atayarak Güney yönünün gözükmesini, 270 değerini atayarak Doğu yönünün gözükmesini sağlayabiliriz.

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,12">
	<maps:Map Center="41.0205, 29.0865" ZoomLevel="14" Heading="270" />
</Grid>

Son olarak Pitch özelliğine 0 ile 75 arası değer atayarak haritaya bakış açımızı değiştirebiliriz. Örneğin haritada 60 derecelik açı ile İstanbul şöyle gözüküyor;

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,12">
	<maps:Map Center="41.0205, 29.0865" ZoomLevel="14" Pitch="60" />
</Grid>

Pitch

Not : Harita kontrolü üzerinde daha fazla geliştirme seçeneği elde etmek için (örneğin Pushpin) Windows Phone Toolkit‘i indirip projenize ekleyebilirsiniz.

Windows 8 Metro Style Uygulamalarda ProgressRing Kullanımı

23 November 2011 4 yorum

Uygulamalarımızda uzun süren işlemler sırasında, kullanıcıya işlemin sürdüğünü göstermek için genellikle yükleniyor (loading) göstergeleri kullanırız.

Windows 8 için geliştirdiğimiz Metro Style uygulamalarda bu yeteneği uygulamamıza katmak için ProgressRing sınıfından faydalanabiliriz.

Bu makalede uygulamanın açılışı esnasında bir yükleniyor (loading) göstergesi ekrana getireceğiz, 5 saniye bekledikten sonra (uygulamanın ihtiyaç duyacağı tüm modüllerin yüklenmesi 5 saniye sürecek diye varsayıyoruz) yükleniyor göstergesini ekrandan kaldıracak ve Gerekli Modüller Yüklendi metnini ekranda göstereceğiz.

Hemen yeni bir Visual Studio 2011 açarak örnek proje üzerinde geliştirmeye başlayalım;

Yeni Proje oluşturma dialog kutusunda Windows Metro Style grubunda yer alan Application proje şablonunu seçelim ve projemize bir isim verelim (bu örnekte benim kullandığım isim, ProgressRingOrnek)

Proje oluşturulduğunda MainPage.xaml dosyasının içeriği;

<UserControl x:Class="ProgressRingOrnek.MainPage"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	mc:Ignorable="d"
	d:DesignHeight="768" d:DesignWidth="1366">

	<Grid x:Name="LayoutRoot" Background="#FF0C0C0C">
	</Grid>

</UserControl>

Öncelikle Grid elementi içerisine bir tane ProgressRing, bir tane de TextBlock nesnesi ekliyoruz;

<ProgressRing x:Name="ProgressItem" HorizontalAlignment="Center" VerticalAlignment="Center" Width="240" Height="240" />

<TextBlock x:Name="MessageItem" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Collapsed" Text="Gerekli Modüller Yüklendi!" FontSize="22" />

ProgressRing elementini ekranda yatay eksende (HorizontalAlignment) ve dikey eksende (VerticalAlignment) ortalıyoruz (Center), ayrıca genişlik (Width) ve yükseklik (Height) değerlerini de belirliyoruz (240 px).

TextBlock elementini de ekranda yatay eksende (HorizontalAlignment) ve dikey eksende (VerticalAlignment) ortalıyoruz (Center), font boyutunu (FontSize) ayarlıyoruz (22 px), ekranda gözükmemesi için Visibility özelliğine Collapsed değerini veriyoruz.

HorizontalAlignment özelliğine verilebilecek değerler;

  • Center
  • Left
  • Right
  • Stretch

VerticalAlignment özelliğine verilebilecek değerler;

  • Bottom
  • Center
  • Stretch
  • Top

Visibility özelliğine verilebilecek değerler;

  • Collapsed
  • Visible

MainPage.xaml.cs dosyasında, MainPage sınıfının constructor‘ında ilk önce ProgressRing nesnesini ekranda gösterelim;

ProgressItem.IsActive = true;

5 saniye gecikme sağlayıp, istediğimiz işi yapacak kodu yazmaya başlayalım. Bu iş için DispatcherTimer sınıfını kullanacağız.

TimeSpan tipinde Interval özelliğine 5 saniye gecikme sağlayacak TimeSpan.FromSeconds(5) değerini veriyoruz;

timer.Interval = TimeSpan.FromSeconds(5);

DispatcherTimer nesnesinin Tick olayını yakalayıp, ProgressRing nesnesini ekrandan gizlemeli, TextBlock nesnesini ekranda göstermeliyiz;

timer.Tick += delegate(object sender, object e)
{
	timer.Stop();

	ProgressItem.IsActive = false;
	MessageItem.Visibility = Visibility.Visible;
};

Son olarak, DispatcherTimer nesnesinin Start() method’unu kullanarak, 5 saniyelik süreci başlatıyoruz.

DispatcherTimer nesnesinin Interval özelliğinde belirlediğimiz süre dolduğunda Gerekli Modüller Yüklendi mesajı ekranda belirecek;

Windows 8 Metro Style ilk uygulamamız

07 October 2011 1 yorum

Windows 8 Programlama makalelerinde ilk uygulamamızı geliştirmeye başlıyoruz.

Windows 8 Başlangıç Ekranımızda (Start Screen) Visual Studio 2011 üzerine tıklayarak, yeni bir Visual Studio 2011 başlatıyoruz.

File / New / Project menüsünden Windows Metro Style kategorisindeki Application proje şablonunu seçiyoruz ve MetroStyleIlkUygulama ismini vererek projemizi oluşturuyoruz.

Proje oluşturulduğunda Visual Studio 2011 varsayılan olarak MainPage.xaml dosyasını açıyor. Uygulamamızın başlangıç ekranı varsayılan olarak MainPage.xaml dosyasıdır.

Grid elementi içerisine bir button, bir de label eklemek için aşağıdaki satırları yazıyoruz;

<Button Content="Mesaj Göster" FontSize="28" Width="250" Height="80" HorizontalAlignment="Center" />
<TextBlock x:Name="MessageText" FontSize="48" Foreground="White" />

WPF ve Silverlight‘ta Label nesnesi oluşturmak için TextBlock nesnesi kullanmamız gerekiyor. Bu elementler ile ekranımıza Mesaj Göster metinli bir button ve metin içermediği için ekranda gözükmeyen bir textblock nesnesi koymuş olduk.

Fakat bu kontrolleri ekranda ortalayabilmek için bir StackPanel içerisine koymamız gerekiyor;

<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
	<Button Content="Mesaj Göster" FontSize="28" Width="250" Height="80" HorizontalAlignment="Center" />
	<TextBlock x:Name="MessageText" FontSize="48" Foreground="White" />
</StackPanel>

StackPanel ve Button elemanlarına verdiğimiz Alignment özellikleri sayesinde elemanları ekranda ortalıyoruz.

Son olarak Button element’imize

Click="Button_Click"

özelliğini ekleyelim. Böylece butona tıklanma event‘i ile tetiklenen bir method‘umuz oluyor.

MainPage.xaml.cs dosyasına;

private void Button_Click(object sender, RoutedEventArgs e)
{
	MessageText.Text = "Windows 8 üzerinde çalışan\r\nilk uygulamamız!!";
}

method’unu ekliyoruz.

Son olarak F5 tuşuna basarak projeyi test amaçlı çalıştırıyoruz. Uygulama açılışında ilk önce bekleme ekranı ekrana geliyor.

Fakat çok kısa süre içerisinde ilk ekranımız açılıyor.

Butona tıkladığımızda TextBlock metin ile doluyor.

Kodların tamamı;

<UserControl x:Class="MetroStyleIlkUygulama.MainPage"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	mc:Ignorable="d"
	d:DesignHeight="768" d:DesignWidth="1366">

<Grid x:Name="LayoutRoot" Background="#FF0C0C0C">
	<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
		<Button Content="Mesaj Göster" FontSize="28" Width="250" Height="80" HorizontalAlignment="Center" Click="Button_Click" />
		<TextBlock x:Name="MessageText" FontSize="48" Foreground="White" />
	</StackPanel>
</Grid>

</UserControl>