QuickApp’e Location Kit Entegrasyonu

Merhabalar,

Quick App kullanımı esnasında kullanıcının lokasyon bilgisine ihtiyaç duyduğumuzda kullanabileceğimiz HMS Location Kit’i, Quick App uygulamamıza nasıl entegre edebileceğimizi bu yazımızda göreceğiz.

QuickApp Uygulamamızın manifest.json dosyasına “system.geolocation” özelliğini kullanacağımızı bildirerek başlıyoruz:

Ben ayrıca “toastr” yani kullanıcıya uygulama içerisinde çıkan mesaj olarakta birkaç detay eklediğim için “system.prompt” özelliğini de ekledim, siz de eğer bu özellikten faydalanakcasınız manifest.json dosyanıza bu özelliği dahil edebilirsiniz. Şu an uygulamamızın manifest.json dosyası içerisindeki “features” kısmı şöyle gözüküyor olmalı:

Şimdi uygulamamızın anasayfasını dizayn etmeye başlayabiliriz. Uygulamamızda 3 özellik bulunacak ve bu özellikler buton ile tetiklenecek;

  1. Kullanıcının lokasyonunu tespit edecek
  2. Kullanıcının bulunduğu lokasyona ait detaylı(bulabildiği) bilgileri getirecek.
  3. Kullanıcının o an ki konumunu harita üzerine görüntüleyecek

Uygulamanın butonlarını ve fonksiyonların gövdelerini oluşturarak başlıyorum:

Uygulamamın iskeletini oluşturdum. Arayüze baktığımızda şöyle bir arayüzün bizi karşılıyor olması gerekiyor:

Şimdi gelelim fonksiyonlarımızı doldurmaya, Location kit’i kullanabilmek için, <script> bölümünün başlangıcında geolocation’ı çağırıyorum:

şimdi “getLocation” fonksiyonunda gelen değerleri data kısmında tutarak, harita üzerinde göstermek için de ilgili lat/long değerleri için çağırabilmek için de dönen cevabı alacak şekilde fonksiyonu oluşturuyorum:

Şimdi bu bilgileri kullanarak ilgili lat/long değerlerindeki bilgiyi çağırabilir ve harita üzerinde gösterilmesini şu şekilde sağlayabilirim:

Uygulamamızın görüntüsüne bakalım:

Uygulamanın kaynak koduna ulaşmak için Github reposuna bakabilirsiniz:

Soru ve sorunlarınız için admin@sezerbozkir.com ya da Huawei developer forum üzerinden ulaşabilirsiniz…

Quick App detaylı dökümantasyonuna buradan, Quick App ile Location Kit entegrasyonunun resmi belgelerine buradan göz atabilirsiniz.

Bir sonraki yazımda görüşmek dileğiyle :)

--

--