“Material You” ile Modern Uygulamalar Geliştirmek

Ömer Akkoyun
4 min readApr 17, 2024

Yeni bir konu ile herkese selamlar 😊Bu yazıda, Material3 ile birlikte gelen “Material You” ile modern uygulamalar geliştirmenin nasıl bir deneyim sunduğuna bir göz atacağız.

Günümüzde mobil uygulama geliştiricileri, sadece kullanıcıların ihtiyaçlarını karşılamakla kalmayıp aynı zamanda onlara keyifli bir deneyim sunmak için çeşitli tasarım ve kullanılabilirlik öğelerini göz önünde bulundurmak zorundalar. Google, kullanıcı deneyimini geliştirmek için yeni bir adım atmış durumda ve bu adımın adı “Material You”.

Bu yeni yaklaşım, kullanıcıların telefonlarını kendi zevklerine göre kişiselleştirmelerine ve bu kişiselleştirmelerin uygulama deneyimine yansımasına olanak tanır. (Android 12 ve sonrası, API levels 31)

Material You ile ilgili konuşacaksak öncelikle Material 3 nedir ve bununla birlikte gelen özelliklere de değinmemiz gerekiyor;

Material 3, Google’ın açık kaynaklı tasarım sistemi olan Material Design’ın en son sürümüdür. Geliştiricilere daha güzel ve kullanılabilir uygulamalar oluşturmak için çeşitli araçlar ve bileşenler sunar. Material 3, Material 2'ye kıyasla birçok yeni özellik ve geliştirme içerir. Bunlardan öne çıkanlar şunlardır:

🔴 Temalar:

  • Dinamik Renklendirme: Material You, kullanıcının duvar kağıdından otomatik olarak renk paletleri oluşturan ve bu paletleri uygulamalar, sistem arayüzü ve kilit ekranı gibi tüm cihaza uygulayan bir özelliktir.
  • Tonlar: Material 3, önceden tanımlanmış renk paletleri yerine, açık ve koyu tonlar arasında geçiş sağlayan daha esnek bir renk sistemi sunar.
  • Adaptif Renkler: Sistem, kullanıcı arayüzünün görünümünü ve hissini ortam ışığına göre otomatik olarak ayarlayabilir.

🟠 Bileşenler:

  • Modernize Edilmiş Bileşenler: Butonlar, menüler, kartlar ve diyaloglar gibi temel bileşenler güncellenmiş ve daha modern bir görünüm kazanmıştır.
  • Yeni Bileşenler: Material 3, Toggle Chip, Image Toggle ve Snack Bar gibi yeni bileşenler sunar.
  • Geliştirilmiş Şekiller: Material 3, yuvarlatılmış köşeler ve akıcı geçişler gibi yeni şekiller ve animasyonlar kullanarak daha yumuşak ve daha uyumlu bir tasarım dili sunar.

🟡 Diğer Özellikler:

  • Daha İyi Erişilebilirlik: Material 3, görme engelli ve diğer engelli kullanıcılar için daha erişilebilir bir deneyim sunmak için iyileştirilmiştir.
  • Geliştirilmiş Performans: Material 3, daha hızlı ve daha duyarlı uygulamalar oluşturmak için optimize edilmiştir.
  • Daha Kolay Geliştirme: Material 3, geliştiricilerin Material Design ilkelerini uygulamalarına daha kolay entegre etmelerine yardımcı olacak yeni araçlar ve dokümantasyonlar sunar.

Görsel olarak farklılıklarına bakalım;

Material 2 vs Material 3
Buttons m1-m2-m3
Chips
Fab Butons
Dialogs
Navigation Bar
Fonts

Göründüğü gibi Material 3 ile çok daha modern ve şık tasarımlar elde edebiliyoruz. Unutmadan “Materiel Theme Builder” ile özel temalar oluşturabilirsiniz.

https://m3.material.io/theme-builder

Material 3 ile gelen özelliklere ve Material 2 ile olan farklarına da baktığımıza göre artık Material You ile ilgili detaylara inebiliriz.

🟥 Material You’nun Özellikleri

Material You’nun bazı önemli özellikleri şunlardır:

🔵Dinamik Renklendirme: Material You, duvar kağıdınızdan otomatik olarak renk temaları oluşturur ve bu temaları uygulamalarda, sistem arayüzünde ve hatta kilit ekranınızda kullanır.

🟣Kişiselleştirilmiş Widget’lar: Material You, duvar kağıdınızla uyumlu renklerde ve stillerle kişiselleştirilebilen yeni widget’lar sunar.

🟤Gölge Efektleri: Material You, uygulamalara ve sistem arayüzüne daha derinlik ve boyut kazandıran yeni gölge efektleri sunar.

Dinamik Renklendirme

Nasıl Kullanılır?

Dynamic color için ilk önce material 3'ü projemizde build.gradle implement etmeliyiz.

implementation 'androidx.compose.material3:material3:latest-version'
@Composable
fun AppTheme(
isDarkTheme: Boolean = isSystemInDarkTheme(),
isDynamicColor: Boolean = true,
content: @Composable () -> Unit
) {

/**
* Dynamic Colors are supported on API level 31 and above
* */
val dynamicColor = isDynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S
val colorScheme = when {
dynamicColor && isDarkTheme -> {
dynamicDarkColorScheme(LocalContext.current)
}
dynamicColor && !isDarkTheme -> {
dynamicLightColorScheme(LocalContext.current)
}
isDarkTheme -> DarkThemeColors
else -> LightThemeColors
}

// Make use of Material3 imports
MaterialTheme(
colorScheme = colorScheme,
typography = AppTypography,
content = content
)
}
ScreenShot 1
Screenshot 2

Sonuç:

Material You, Android’i daha kişiselleştirilebilir, etkileşimli ve tutarlı hale getiren heyecan verici bir güncellemedir. Bu güncelleme, Android kullanıcılarına cihazlarını kendi zevklerine göre özelleştirmek ve daha keyifli bir kullanıcı deneyimi yaşamak için yeni araçlar sunar. Bir sonraki yazıda görüşmek üzere. İyi kodlamalar 🙂 💻…

Kaynaklar:

--

--