React Native- Push Icon

Notification Transparent Small Icon

Android pushlar cihaza ulaştığında status bar üzerinde şeffaf bir logo gözükmektedir. Burada logo alanı kadar tek renk bir şekil(genellikle kare veya yuvarlak) gözükür.

Bu alandaki icon uygulamanın iconunun tek katmanlı hale getirilmiş örneğidir. Birden fazla katman olduğu durumlarda iconlar kare gözükmektedir.

Buradaki icon’lar işletim sistemi tarafından yönetildiği için RMC sdk’ları herhangi bir müdahalede bulunamıyor. Ancak oraya yeni uygun bir icon yükleyebilmeniz için fonksiyon sunuyoruz.

euroMobileManager.setNotificationTransparentSmallIcon(R.drawable.ic_launcher, this);

Android işletim sistemi ise bu logonun sağlam çalışması için bazı şartlar sunmaktadır;
- Logonun background'ının kesinlikle taransparan olması gerekmektedir. Logonun arkasında bir katman olmayacak olup, logo tek katmanlı olmalıdır.
- Markalara genelde logo içerisinde tek harf kullanmasını tavsiye ediyor. (Örn: gmailden size bie mail geldiğinde sadece G harfi status barda gösterilir)
- Bir diğer önemli konu ise eklenecek background transparan (vektörelde denilebilir) olma şartı nedeni ile son kullanıcının cihazı dark mode veya light mode da kulanıyor olması, görünürlüğü etkilemektedir. Eğer logo beyaz ise light mode'da görünmez, eğer logo siyah ise light mode'da görünmez.

Notification Large Icon

Push bildirimlerin sağ tarafındaki büyük logo için gereken kurallar yine alttaki gibidir.

Eklenmesi gereken kod;

euroMobileManager.setNotificationLargeIcon(R.drawable.ic_launcher,this);

Buraya eklenmesi gereken logo yine android operating şartlarında çift katmanlı olmalıdır. Yani backgroud olmalıdır.
Eğer olmaz ise logo beyaz ise light mode da görünmez, eğer logo siyah ise light mode da görünmez.

Dokümanda bu şekilde açıklıyor:

the app icon is a small two-dimensional representation of your app's identity. It appears in monochrome in the status bar.

Detaylı bilgi dokümanına alttaki bağlantıdan ulaşabilirsiniz.

https://material.io/design/platform-guidance/android-notifications.html#lock-screen