Image Kit ile Resim Düzenleme Uygulaması Nasıl Geliştirilir? — Bölüm 1
✨ Huawei Image Kit nedir?
Günümüzde, resim düzenleme seçenekleri sosyal medya uygulamaları gibi resim ile alakalı uygulamalarda olmazsa olmaz haline geldi. Buna karşılık Huawei yeni bir çözüm sundu, Image Kit. Huawei Image Kit 24 eşsiz filtreleme seçeneği sunan Image Vision ve 5 basit animasyon ile 9 gelişmiş animasyon sunan Image Render servisleri ile geliyor. Bunların yanında yavaş yavaş popüler olan çıkarmalar ve resmi döndürme, kırpma gibi temel işleri de sağlıyor. Aynı zamanda bütün bu servislerin kullanımı tamamiyle ücretsiz.
⚠️ Kısıtlamalar
Image Kit, HMS Core sürümü 4.0.2 ve üstü olan ve Android sürümü 8 ve üzeri olan Huawei cihazlarda çalışıyor. Aynı zamanda 1.0.3 sürümü ile Huawei olmayan cihazlarda da geriye dönük SDK gereksinimleri eklenirse çalıştırılabilmekte.
Image Vision servisi
- Filter: Görüntünün boyutu en fazla 15 MB olabilir, çözünürlük ise 8000x8000'den büyük olmamalı ve en boy oranı 1:3 ile 3:1 arasında olmalı.
- Smart Layout: En boy oranı 9:16 olmalı ve görüntünün boyutu en fazla 10 MB olabilir.
- Image tagging: Önerilen çözünürlük 224x224 ve en boy oranı 1:1'dir.
- Büyük boyutlu resimler yüksek işlemci ve bellek kullanıma sebep olabilir. Aynı zamanda çalışma süresini ve güç tüketimini arttırabilir.
Image Render servisi
- Önerilen görüntü boyutu en fazla 10 MB. Büyük boyutlu resimler yüksek işlemci ve bellek kullanıma sebep olabilir. Aynı zamanda çalışma süresini ve güç tüketimini arttırabilir.
Kısıtlamalar üstünde ayrıntılı açıklamalar ve başka bilgiler için buraya göz atabilirsiniz.
🚧 Geliştirme Süreci
Görüntü düzenleme uygulamamızın geliştirmesine başlayabilmemiz için önce HMS Core entegrasyonunu yapmalıyız. HMS kitleri ve servislerini kullanmak için bu zorunlu. Entegrasyonu tamamlamak için bu rehberleri kullanabilirsiniz.
HMS Core entegrasyonu sonrasında gerekli izinleri Android Manifest dosyamıza eklemeliyiz.
Ve son olarak gerekli bağımlıkları Gradle dosyamıza eklememiz gerekiyor. Sürüm değişiklikleri için buraya göz atabilirsiniz.
Bunu da tamamladıktan sonra kodlamaya geçebiliriz.
🔴 Adım 1: Base Activity
Önce hem Image Render hem Image Vision özelliklerini kullanmak için temel bir aktivite yaratacağız. Bu temel aktivitemiz bir JSONObject yaratmak için bir fonksiyona sahipt olacak ve biz buna authJson diyeyeceğiz. Bu değişken kimlik doğrulaması için bazı parametreleri içerecek.
Parametrelerimizin İngilizce açıklamaları bu şekilde. Bu parametreleri, token haricinde “agconnect-service.json” dosyasında bulabilirsiniz. Normal şartlar token tercihe bağlıyken bulut servislerini kullanan Smart Layout ve Theme Tagging özellikleri için kullanıması zorunludur.
Buradan nasıl token elde edileceğine bakabilirsiniz.
🟠 Adım 2: Image Render
Önce uygulamamızın Image Render tarafının geliştirmesini yapacağız. Bunun için kaynaklarımızı adresini oluşturmalıyız ve sonrasında kullanıcıdan izin isteyip, authJson ve diğer gereklilikleri başlatmalıyız.
Image Render özelliklerini kullanabilmemiz için önce onu başlatmamız lazım. Bunu bir Image Render örneği oluşturarak sağlayabiliriz. Eğer Image Render nesnemiz başarıyla elde edilmişse onSuccess metodu çağrılacak ve biz de burada “initRenderView” fonksiyonunu çağırarak “view” kısmını oluşturuyoruz. Eğer ters giden bir şey olursa bu durumda onFailure metodunda bunu kayıt atabiliriz.
Başarılı bir işlemden sonra artık “render view” oluşturmamız lazım. “initRenderView” fonksiyonunda imageRenderAPI değişkenimizin null olup olmadığını kontrol edeceğiz ve null değilse başarılı bir şekilde sonucumuzu alacağız. Başarılı bir başlatmanın ardından sonuç 0 olacaktır. Aynı şekilde bu sonuç için bir Huawei bir metod daha sunuyor.
Başlatma fonksiyonlarımız hazır olduğuna göre artık izin fonksiyonlarımızı yazmaya başlayabiliriz. Dosyalar ile ilgili izinlerimizi isteyip animasyon için kullanacağımız kaynakları kopyalabilimemiz lazım. Bunları render işlemimiz için kullanacağız.
Animasyon seçimi için bir spinner kullanacağım onu da onCreate içerisinde çağırdığımız, “initView” fonksiyonu içinde başlatacağım.
Kullanıcı bir animasyon seçtiğinde diğer tüm görünümleri kaldırmalıyız Frame Layout içerinsinden ve oluşturduğumuz Image Render objesinden render view ksımını kaldırmalıyız.
Animasyonlarda kullanacağımız kaynak dosyalarımızı kopyalamak için bir fonksiyona ihtiyacımız var. Kullanıcıdan dosya kullanımı için izin aldıktan sonra bu fonksiyonu çağracağız.
Neredeyse gerekli olan geliştirmelerimizi tamamladığımıza göre artık seçilen animasyonu oynatmak için gereken son fonksiyonumuzu yazmalıyız. Bunu sadece bir satırlık kod ile sağlayabiliriz.
Ve sonunda 14 farklı animasyonu oynatabilen basit bir resim uygulamamızı geliştirdik 🤗 Uygulamamızın son halinden bir örnek,
Image Render yeni sürümü sayesinde artık animasyonları durdurup başlatabiliyoruz.
Yine yeni bir özellik olarak animasyonları .gif veya .mp4 uzantalı olacak şekilde kaydetme seçeneğimiz de var. Bununla ilgili geliştirmeyi sekizinci adımda görebiliriniz.
Tüm bu animasyonlar düzenlebiliyor ve Huawei bize bu konuda ayrıntılı bir dokümantasyon sunuyor. İsterseniz buradan inceleyebilirsiniz.
Ayrıca, Image Render tarafından dönen cevap kodlarını buradan inceleyebilirsiniz. Herhangi bir hatayla karşılaştığınızda veya bir şeyler ters gittiğinde size yardımcı olabilir. Nedenler ile çözüm önerilerini de bize sunuyor.
💡 Sonuç
Huawei Image Kit bize görüntüyle ilgili işlemler için türlü araçlar sunuyor. Bunlardan biri de bugün kullandığımız gibi animasyonlar için Image Render. Bu animasyonları kilit ekranı veya arka planımız gibi farklı yerlerde kullanabiliriz. Image Render başta karmaşık bir izlenim verse de aslında bize görüntüleri kolay animasyonlarla birleştirmeyi sunuyor.
Bu bölümde Image Render hakkında konuştuk ve animasyonları kullanabileceğimiz bir basit bir uygulama geliştirdik. Gelecek bölümde Image Vision hakkında konuşup, uygulamamıza filtreleme özelliklerini entegre edeceğiz. Aşağıda GitHub ve referensları bulabilirsiniz.
