Huawei Map Kit & Native Ads (Track Corona Örnek Uygulama)
Huawei Map Kit ve Huawei Native Ads kullanarak Track Corona uygulamasını geliştirdim. Uygulama tek ekrandan oluşuyor, bu ekranda fullscreen Map ve Bottom Sheet Dialog mevcut. Kullanıcılar listeden istedikleri ülkeyi seçerek harita üstünde o ülkenin Koronavirüs verileri görebilirken “World Wide” seçeneğini kullanarak tüm ülkelerin Koronavirüs verilerini görebilir. Bu veriler custom InfoWindow aracılığıyla gösteriliyor.
Bu yazının amacı, Huawei Native Ads RecyclerView içinde kullanımı, Huawei Map Kit kullanımı, Huawei MapView üzerinde marker gösterim işlemleri olduğu için MVP, binding, UI gibi kısımlara değinmeyeceğim.
Huawei App Gallery
Huawei App Gallery’de Koronavirüs verisi içeren uygulamalar yayınlayabilmek için resmi izin gerekmekte, bu nedenle Track Corona uygulamasına Huawei App Gallery’den erişim malesef yok, uygulamayı denemek isterseniz yazının en sonunda yer alan referanslar bölümünde APK linkine erişebilirsiniz.
Veriler
Listede göstermiş olduğum ülke ve bayrak verileri için kullandığım API buradan erişebilirsiniz.
Güncel Koronavirüs verilerini almak için kullandığım API buradan erişebilirsiniz.
HMS ve Map Kit Entegrasyonu
HMS Entegrasyonunu hakkında bu makaleyi inceleyebilirsiniz. Bu adımların uzun süreceği ve konudan uzaklaşacağımızı düşündüğüm için ilgili entegrasyonu yaptığınızı varsayıyorum ve devam ediyorum.
build.gradle dosyasına Huawei Map ve Native Ads için ilgili satırları ekledim.
Gerekli izinleri de AndroidManifest dosyasına eklemeyi unutmayalım.
RecyclerView Item Olarak Native Ads Kullanımı
Ülke listesini RecyclerView’e eklerken 40 ülke satırında 1 reklam göstermek istedim. Bu yüzden adaptere göndereceğim ülke listesini API’dan aldıktan sonra mapleme yaparken 40 itemda 1 olacak şekilde isCountry değişkenini false olarak setledim. Adapter sınıfında viewType kontrolünü bu değişkene göre yaparak reklam gösterimini tamamladım.
Bu işlem için farklı senaryolar üretilebilir, bu kullanımda temel amaç RecyclerView item olarak Natvie Ads kullanımı olduğu için bu senaryo ile devam ediyorum.
Yukarıdaki kod bloğunda; if(i % 40 == 0) şartı sağlandığında adapterItems listesine isCountry = false değerine sahip yeni bir AdapterItem ekleniyor. Bu item CountryAdapter’de NativeAds olarak değerlendirilecek.
CountryAdapter sınıfında ise getItemViewType() fonksiyonunda isCountry() değerine göre ilgili satırda ülke verileri mi yoksa reklam mı gösterileceğinin kararı veriliyor.
Layout kod bloklarını buraya eklemiyorum, yazıyı gereksiz yere çok fazla uzatacağını düşünüyorum, değişken isimlerinden anlaşılacağı üzere NativeSmallAdBinding reklam layoutu, RowCountryBinding ise ülke verileri için tanımlanan layout.
Kaynak kodların yer aldığı github reposuna sayfanın en altında yer alan referanslardan erişebilirsiniz.
Huawei Native Ads Kit reklam verilerini NativeAd objesi olarak bize sunmakta, ben bu objeyi CountryAdapter constructerı içinde gönderiyorum böylece adapter içinde ad_title, ad_media, ad_source, ad_call_to_action componentlerine ad verilerini setliyorum.
Şimdi gelelim Huawei Native Ads Kit aracılığıyla NativeAd objesini almaya.
Standart Ads konfigurasyon işlemleri ardından NativeAd objesi artık kullanılabilir durumda. Burada dikkat çekmek istediğim bir nokta var o da ChoisePosition özelliği ile ads özelleştirme mümkün, kullandığım ve diğer olası tagların anlamları şu şekilde:
Bu işlemlerin ardından Native Ads tarafında yapacağımız başka bir işlem kalmadı. Sıra geldi Map Kit kullanımına.
Map Kit İşlemleri
onCreate’de initHuaweiMap() fonksiyonu çağrılıyor ve burada binding.mapView.getMapAsync(this) satırı ile işlem tamamlandığında Activity’ye implement ettiğim OnMapReadyCallback ile Override edilen onMapReady(HuaweiMap huaweiMap) fonksiyonu çağrılıyor. Bu işlemlerin sonucunda artık harita kullanılabilir duruma geliyor ve presenter.mapReady() fonksiyonu çağrılıyor. mapReady() fonksiyonunda ülke verilerini alabilmek için API request gönderiliyor.
huaweiMap.setInfoWindowAdapter(new InfoWindowAdapter(this)) satırı ile haritada gösterilen markerlara tıklandığında açılan popup için bir adapter tanımlası yapılıyor.
getInfoContents() fonksiyonunda custom_marker_info layoutunda yer alan title, deaths, patients, recovered, updated componentlerine değerler setleniyor. Bu işlem sonucunda markerlara tıklandığında açılan InfoWindow özelleştirilmiş oldu. İlgili markerın detay bilgilerini alabilmek için country = (Country) marker.getTag() satırı kullanılıyor. Bu işlem ile ilgili olarak yazının ilerleyen bölümlerinde biraz daha detay vereceğim.
Kullanıcı listeden seçtiği ülkenin ya da bütün ülkelerin verilerini görmek istediğinde API isteği hazırlanıp gönderiliyor, API’dan dönen cevap ile mapCoronaData() fonksiyonu çağrılıyor. Mapleme işlemi sonrasında View’de bulunan clearHuaweiMap(), bottomSheetSetCollapsed(), setMarker() fonksiyonları çağrılıyor.
clearHuaweMap() fonksiyonunda, varsa harita üstünde yer alan markerlar kaldırılıyor.
setMarker() fonksiyonu parametre olarak aldığı ülke listesi verilerini haritada marker olarak setliyor. MarkerOptions objesini oluşturduktan sonra, position() ile marker konumu, title() ile marker metni, icon() ile marker iconu setleniyor. alpha() ile ise markerlara biraz saydamlık ekleniyor. Yazının başlarında anlattığım InfoWindowAdapter sınıfında kullanılan veriler marker.setTag(country) satırıyla setleniyor.
Tüm ülkerin verileri göstermek için kullandığım setMarker() fonksiyonunu ayrıca listeden tek bir ülke seçildiğinde marker göstermek için kullanıyorum, son kısımda yer alan if bloğunu kullanma nedeni bu.
bottomSheetSetCollapsed() fonksiyonu ise ekranı kaplayan listeyi Collopsad olarak setlemek için kullanılıyor.
Listeden ülkeye tıklandığında, yukarıda yer alan fonksiyonlara ek olarak moveCamera() fonksiyonu çağrılıyor huaweiMap.animateCamera() satırı ile ilgili konum haritada ortalanmış oluyor.
Uygulamanın kaynak kodlarına aşağıda bulunan github linkinden erişebilirsiniz. Ek olarak uygulamayı test amaçlı denemek isterseniz APK’nın yer aldığı linki de aşağıya ekledim.
https://onebox.huawei.com/p/10b83d37e2fcac817ccfe59560f66220
For English version:
