Huawei Map Kit & Site Kit ile Harita Uygulaması

Merhaba arkadaşlar bugün birlikte Huawei HMS kitleri kullanarak basit bir harita bazlı uygulama geliştireceğiz. Öncelikle ihtiyacımız olan kitlerden size bahsedeyim ilk olarak harita uygulamaları için olmazsa olmazımız kullanıcının konum bilgileri, bunun için Location Kit'i kullanmamız gerecek. Bunun için arkadaşımızın yazısını okumanızı tavsiye ederim 🔗.


Bu yazıyı okuduktan sonra cihazınızda Longitude ve Latitude lokasyon değerlerini elde etmiş olacaksınız. Bundan sonra bize lazım olan kitimiz ise Maps Kit bu kit ile temel olarak uygulamamıza harita arayüzü kazandıracağız Maps Kit'i kullanabilmemiz için gerekenler:

  1. Huawei Developer hesabı.

  2. AppGallery Connect'te uygulamanızı kaydetmek.

  3. Appgallery Connect üzerinde uygulamanızın gerekli bilgilerini giriş yapmanız.

  4. Bu bilgiler doğrultusunda projenize entegre etmeniz gereken konfigürasyon dosyası.

Dilerseniz entegrasyon işlemlerimize başlayalım öncelikle Huawei Developer hesabını almanız gerekli bunun için izleyeceğiniz yol için link bırakıyorum 🔗.


Ayrıca kitler için ilk entegrasyon işlemleri için Huawei'nin kendi oluşturduğu dökümantasyona da ulaşabilirsiniz 🔗.


AppGallery Connect ve Json Dosyası


Daha sonrasında AppGallery Connect'e giriş için Huawei Developer sayfasından sağ üst kısımda yer alan Console buttonuna tıklamanız gerekiyor.



Devamında uygulamanızı kaydetmeniz için My Apps kısmından uygulamanızı kaydetmeniz gerekiyor.



My Apps'e giriş yaptıktan sonra sağ üstte yer alan New App butonuna tıklamanız gerekiyor karşınıza uygulamanızın bilgilerini isteyen bu sayfa çıkacaktır. Gerekli bilgileri doldurduktan sonra uygulamanızı AppGallery Connect'e kaydedeceksiniz. Devamında kayıtlı uygulanıza giriş yapmanız gerekli.




Sizi şu şekilde bir ekran karşılayacak burada uygulamanızın bilgilerini görebilirsiniz.Daha sonrasında sol üst köşede yer alan Develop seçeneceğine tıklamanız gerekli bu seçeneğe tıkladıktan sonra uygulamanızın bazı spesifik bilgilerini girmeniz gerekli.




App Information kısmından SHA-256 keyinizi ekleyi unutmayalım 😊.




Manage Api kısmından Map Kit & Site Kit'i aktif edelim. Devamında general information kısmına gelerek agconnect-services.json dosyamızı indirelim ve Android uygulamamızın app klasörüne .json dosyamızı koyalım.


Entegrasyon


Daha sonra HMS Core reposunu eklememiz gerekiyor dilerseniz ilk paylaştığım linkten bu sayfaya ulaşabilirsiniz veya dilerseniz ekran görüntülerinden ulaşabilirsiniz.



Gerekli entegrasyonlarımızı yaptıktan sonra dilerseniz uygulamamızda haritayı oluşturmaya başlayalım resmi dökümantasyon üzerinden oluşturmak isterseniz 🔗:


İlk öncelikle layout dosyamızda bir mapView oluşturmamız gerekli



View üzerinden size açıklayayım: Görmüş olduğunuz view, huawei maps'in view'ı. Biz bu view'ı istersek layout kısmından istersek class kısmından özelleştirebiliyoruz.Kısaca açıklamalarda bulunarak ilerleyelim;


mapType: Normal parametresi yolları, yapay yapıları ve nehirler gibi doğal özellikleri gösteren standart haritayı temsil eder. none ise veri içermeyen boş bir haritayı temsil eder.


liteMode: Şimdilik kullanıma açık değil ancak adından da anlaşılacağı üzere minimum boyutta genel kullanıcının kullanacağı işlevleri içeren kısıtlı haritadır.


uiCompass: Kullanıcı konumunda kullanıcının pusula yönünün gösterimini aktifleştirmek için kullanılır.


uiRotateGestures & uiScrollGestures & uiTiltGestures: Bu parametler ise kullanıcının kullandığı gestureların kullanıp kullanılmayacağını belirleyebiliyoruz. Örn. iki parmağımızı yakınlaştırıp uzaklaştırarak yakınlaştırma işlemini yapabilmemiz gibi.


uiZoomControls: Yakınlaştırma kontrol butonlarının haritada gözükmesini sağlar.


cameraZoom: Harita ilk açıldığında kullanıcı konumuna ne kadar yakınlaşacağını belirler.


Öncelikle Map Kit için gerekli izinleri kontrol etmemiz gerekiyor CheckPermissions & CheckLocationSettings fonksiyonlarını gerekli izinler için koyduk. Biri cihaz için izinler diğeri ise HMS servisimiz için izinler olarak ayırabiliriz. Fonksiyonlar arasında kalan settingsClient & fusedLocationProviderClient ise gerekli izinlerimizi kullanırken ihtiyacımız olan değişkenlerimizdir.


EncodedApiKey ise bizim güvenlik nedeniyle Api key değerimizi utf-8 formatında yeniden URLencode etmemiz gerekiyor. Direk api key'inizi implement ederseniz kit entegrasyonuna hata alma olasılığınız yüksek. Şimdilik getFirstPlace() fonksiyonunu yorum satırı içine aldım. Bunu Site Kit kısmında size anlatacağım.


OnMapReady ise haritamız hazır olduğunda yapılacak işlemleri çalıştırır. OnMapReady fonksiyonunda hMap adında bir değişken göreceksiniz dilerseniz bu değişken üzerinden de haritanızın ui değişikliğini sağlayabilirsiniz. Burada moveCamera methodunu görüyorsunuz bu haritanız ilk açıldığında hangi konumda açılması gerektiğini belirtir.


⚠️ Bir dipnot Location Kit ile aldığınız Lat,Lon değerlerini moveCamera'ya entegre ederseniz kullanıcının lokasyonuna göre harita açılacaktır.


MoveCamera metoduna tekrar bakacak olursak sonda bir "15" değeri göreceksiniz bu değer zoom değeridir. AddMarker() fonksiyonunu şimdilik atlayalım Site Kit'te anlatacağım. Şimdilik harita kısmını oluşturduk 🎉. Aynı zamanda haritayı belirli methodlarda kullanabilirsiniz onStart,onResume,onPause,onStop gibi.


Site Kit


Gelelim Site Kit'e. Konumumuza göre bize yakın olan bir çok yer hakkında bilgi almamızı sağlıyor. Bu yazıda market bilgileri üzerinden size Site Kit'i anlatacağım.


Site kit'te üç türlü arama yapabiliyorsunuz;

  1. Kelime olarak etrafınızdaki yerleri filitreleyebiliyorsunuz.

  2. Konumuza göre en yakın yerleri bir çok filitreme yaparak ilk 3 ilk 5 şeklinde alabiliyorsunuz.

  3. 1. ve 2.ci maddeyi bir arada kullanabiliyorsunuz.


⚠️ Aynı zamanda bir çok yer hakkında bir çok bilgiye ulaşabiliyorsunuz fotoğraf, telefon, açılış kapanış saatleri gibi.


⚠️ App build.gradle kısmına eklemeyi unutmayalım =>

implementation 'com.huawei.hms:site:{version}'


Dilerseniz Kodlama kısmına bakalım:



Site Kit UI implementasyonu gerektirmeyen bir kit olduğundan dolayı sadece class'ımızda entegrasyon işlemini gerçekleştireceğiz. Dilerseniz Site Kit'in kod implementasyonuna başlayalım 😊.


GetFirstPlace() fonksiyonumuza bakalım ilk öncelikle arama için bir istek değişkeni oluşturmamız lazım sonrasında lokasyon için bir değişken oluşturmamız lazım lat,lon değerlerini girerek yine burada Location kit'ten faydalanmanızı tavsiye ederim 😊.


Radius ile uzaklık sınırını belirliyoruz. SetPoiType'ta ise yer filitrelememizi yapıyoruz ben market filitresi yaptım siz bir çok farklı filitre kullanabilirsiniz.


Arama olarak filitreleme yapacaksanız Language kısmı burada önemli. Sonuçlarınız gelecek ancak kaç sonuca kadar almak istiyorsunuz ve ilk önce hangi sonucu almak istiyorsanız bunu setPageIndex ile sonuçların boyutunu ise setPageSize'dan değiştirebliyorsunuz.


SearchResultListener oluşturalım onSearchResult kısmından başarılı sonuçları listeye kaydedelim. Buradan yerler hakkında bir çok bilgiye ulaşabilirsiniz.


AddMarker fonksiyonu Map Kit'in sahip olduğu bir özelliktir. Yerlerin konum bilgilerini alıp o yerlere istediğimiz logo veya resim işaretleri koyabilirsiniz.


⚠️Son bir dipnot Huawei kitlerini kullanmanız için Huawei bir cihaza sahip olmanıza gerek yok. AppGalleryConnect üzerinden sanal Huawei cihazlarıyla testler yapabilirsiniz 😊


Çıktımız şu şekilde olacaktır:




Şimdilik size iki kit hakkında basitçe bir uygulama yapımını anlattım. İlerleyen zamanlar da daha detaylı bir şekilde map kit'e sıradaki yazımda değineceğim. Herhangi bir sorunuz var ise mahmutcansevin@yahoo.com veya Huawei Developers Forum üzerinden 🔗 sorabilirsiniz.

Yararlandığım Kaynaklar:


Huawei Developers Map Kit: 🔗

Huawei Developers Site Kit: 🔗

Huawei Developers Medium Sayfası: 🔗

Github örnek proje: 🔗


#huawei #huaweimapkit #huaweisitekit #appgaleryconnect




0 yorum

Son Paylaşımlar

Hepsini Gör

Komünite

Platform

Mobiler.dev Anasayfa
  • Twitter
  • Instagram
  • development_düzenlendi_düzenlendi
  • Youtube
  • slack-icon-black_edited_edited_edited
  • Gri LinkedIn Simge
imageedit_2_9667998092.png
JetBrains Hakkında Detaylı Bilgi Alın

© 2021 by mobiler.dev

Kurumsal Yazar Hesapları

adesso.png
mobilerdevLogo.jpg
Yazarlık Başvurusu Hakkında Bilgi Alın, Başvuru Yapın.
Topluluk Yazarlarını Tanıyın