Windows Phone Haritada Konum Gösterme

Konum tabanlı uygulamalar çok yaygın olarak kullanılıyor ve çok yaratıcı fikirler çıkabiliyor. Bu yüzden bu yazımda Windows Phone Map kontolünü kullanarak, konumumuzu harita üzerinde gösteren basit bir uygulamayı adım adım nasıl yaparız anlatmaya çalışacağım. Bu yazımın sonunda Map kontrolü ve Windows Phone API içinde bulunan Geolocator sınıfı hakkında bilgiler edineceksiniz.

Yeni bir Windows Phone projesi açarak başlayalım, açtığımız projeye bir adet map kontrolü ekleyip tüm ekrana yayılacak şekilde Design kısmından ayarlayalım.

1

C# kodumuzda kullanacağımız için, XAML kısmında eklediğimiz map kontrolünün Name attribute’ne  isim vermeliyiz.

2MainPage’in Loaded event’ı ile ilgileneceğiz. InitializeComponent(); altına Loaded += yazdıktan sonra bir kere TAB’a bastığınızda MainPage_Loaded eklenecek, bir kere daha TAB’a bastığınızda handler otomatik olarak oluşacak ve kodlarımızı yazmaya başlayacağız.

3

4

Haritayı güncellemeyi ayrı bir metot  üzerinden yapacağım için bir metot oluşturdum, Haritada konum göstereceğimiz için cihazın GPS sistemini kullanan Geolocator sınıfına ihtiyacımız var. Geolocator sınıfını kullanmamız için Windows.Devices.Geolocation namespace’ini eklememiz gerekiyor. Üstüne geldiğinizde tek tıklamayla namespace’i ekleyebilirsiniz.

5

Geoposition sınıfını kullanarakta, geolocator’dan gelecek koordinatları alacağız. En sonunda Map’imizin SetView’ini de latitute, longtitude ve yakınlaştırma derecesini vererek konumumuzu haritada göstermeye hazır hale getireceğiz. Unutmamız gereken şey, konumu alırken await kullandığımız için metotu async yapmalıyız.

6

Ve MainPage_Loaded handler’ın içinde yazdığımız  HaritayiGuncelle(); metotunu çağırmalıyız.

7

Başka bir değişiklik yapmadan projeyi çalıştırdığımızda hata verecek çünkü Map kontrolü Mapping ve Location Capability’lere gereksinim duyar. Bunları açmak için;

Prefences – WMAppManifest.xml – Capabilities konumunu izleyip ID_CAP_LOCATION ve ID_CAP_MAP seçili hale geldiğinden emin olun.

8

Emülatorde çalıştırdığınızda sürekli aynı yer gelecek karşınıza, endişelenmeyin kodunuz sorunsuz çalışıyor demektir eğer Redmond ise emülatorde gözüken konum. Emülator bir sanal makina olduğu için konum servisini kullandığımızda Windows Phone emülator bize Microsoft HQ konumunu gösteriyor. Eğer fiziksel bir cihazda uygulamayı çalıştırırsanız sorunsuz çalıştığını göreceksiniz.

9

Herşey güzel fakat herhangi bir yer gösterici yok. Bunun için birkaç satır kod yazmamız gerekiyor.

 


            var overlay = new MapOverlay { GeoCoordinate = new GeoCoordinate(position.Coordinate.Latitude, 
                          position.Coordinate.Longitude)  };

            var img = new Image { Width = 56, Height = 56 };
            img.Source = new BitmapImage { UriSource = new Uri("/Assets/mapmarker.png", UriKind.Relative) };

            overlay.Content = img;

            var mapLayer = new MapLayer { overlay };
            MapKontrol.Layers.Add(mapLayer);

10

Şimdi daha güzel oldu fakat alttaki warning’ten kurtulmamız gerek. Bunun için devcenter’dan uygulamanız için authentication ID ve token almanız gerekiyor. Submit App’e girdiğinizde Map services kısmından gerekli id ve token’ı alabilirsiniz.

11

Kullanımı ise şu şekilde;

12Şimdi uygulamamı çalıştırdığımda herşey sorunsuz gözüküyor:

13

Reklamlar

Windows Phone LongListSelector Kullanımı

LongListSelector kontrolü bize büyük verilerimizi ekranda göstermeyi sağlar. LongListSelector’e örnek olarak Twitter gösterilebilir. Bununla ilgili kod örneğini msdn’de görebilirsiniz: http://code.msdn.microsoft.com/wpapps/TwitterSearch-Windows-b7fc4e5e

Ben bu yazımda basit bir şekilde verileri nasıl longlistselector ile kullanırız ondan bahsedeceğim. LongListSelector kullanarak bir takım kişilerin isim ve maillerini göstereceğim.  Öncelikle boş bir proje açalım ve içine LongListSelector kontrolünü ekleyelim.

1

Projeye sağ tıklayıp Add-Class yollarını izleyerek bir class oluşturalım.

2

3

Bu class’ımızda verimizin property’lerini belirteceğiz, daha sonra bunu MainPage’de kullanacağız. Bu yüzden class’ı oluşturduğumuzda ilk yapacağımız iş bunu public yapmak. Eğer siz hiçbirşey yapmazsanız compiler bunu otomatik olarak private algılar.

4

Benim senaryomda şuan sadece isim ve mail olduğu için bu property’leri ekledim. prop yazıp tab’a iki kere tıkladıktan sonra kolayca property oluşturabilirsiniz, bu da Visual Studio’nun sunmuş olduğu bir güzellik 🙂

5

Data classımızla işimiz bu kadar. Şimdi MainPage.xaml.cs ‘de verilerimizi ekleyeceğiz. Bunun için global bir List oluşturup ona Add metoduyla tek tek kullanıcıların isim ve maillerini gireceğiz.

6

Ekledikten sonra, son olarakta DataContext’imize verilerimizi eklediğimiz listeyi atamayı unutmuyoruz.

En başta eklemiş olduğumuz LongListSelector’un ItemSoruce’unu Binding yaptıktan sonra ItemTemplate oluşturmamız gerekiyor. StackPanel’i bir konteynır olarak düşünebilirsiniz. StackPanel’e eklenilen veriler alt alta veya yan yana sıralanır. Eğer hiçbir şey yapmazsanız StackPanel default olarak alt alta ekler. Yan yana eklemek için  aşağıdaki xaml kodunu kullanabilirsiniz.

<StackPanel Orientation="Horizontal" >

7İlk textblock ‘ a isim, hemen altına ikinci textblock’a da mail’i yazmasını istediğim için yukarıdaki gibi kullandım.Emülatorde çalıştırdığımda karşıma çıkan sonuç;sonuc