Şekiller

Şekiller, bazı ekran öğelerinin diğerlerine kıyasla önemini vurgulamaya yardımcı olur.

Bir bakışta rehberlik (TL;DR):

  • Birincil işlemler ve bileşenler için daha yuvarlatılmış köşeler (daha yüksek köşe yarıçapı) kullanın
  • Vurgusu düşük öğeler için kare şeklindeki, daha az yuvarlatılmış köşeler (alt köşe yarıçapı) kullanın

Köşe yarıçapı değerleri

Arabalar için Android, çeşitli ekran öğelerinin diğerlerine göre önemini vurgulamak amacıyla bir dizi köşe yarıçapı değeri sağlar.

Köşe yarıçapı değerleri
R0 R1 R2 R3 R4
0dp 4dp 8dp 16dp Tam

Vurgu için yuvarlamadan yararlanma

Android Automotive'deki yuvarlak ve kare köşeli şekiller, kullanıcının dikkatini daha çok vurgulanmış öğelere çeken görsel bir hiyerarşi oluşturur. Vurgusu yüksek öğelerin köşeleri daha yuvarlatılmış ve köşe yarıçapı daha geniştir. Vurgusu düşük öğelerin köşeleri daha az yuvarlaktır ve köşe yarıçapı daha küçüktür.

Dört köşe yarıçapı seviyesinin tümüne örnekler
En düşükten (0 dp = kare) en yükseğe (dairesel) doğru dört köşe yarıçapı seviyesi örnekleri

0 dp — Referans değer

Ek vurguya ihtiyaç duymayan referans öğeler için 0 dp (kare) köşeler kullanın. Araç çubukları veya listeler gibi temel düzen yapıları 0dp köşelerini kullanmalıdır. Resimler, yuvarlatılmış bir kapsayıcıyla (kart gibi) maskelenmedikleri veya seçili durumda olmadıkları sürece 0dp köşelerine de sahip olmalıdır.

Kare köşe örneği
Sağdaki tabloda yer alan albüm kapaklarının birbirlerine veya gösterilen diğer öğelere göre fazladan bir vurgu yapması gerekmez. Bu nedenle köşelerin 0 dp köşeleri vardır (ayrıntı solda gösterilmiştir)

8dp — Düşük vurgu

8dp, yuvarlatılmış şekiller için varsayılan köşe yarıçapıdır. Kartlar ve kapsayıcılar gibi düşük vurgulu etkileşimli öğeleri belirtmek için bu şekli kullanın.

8dp düşük vurgu örneği
Burada gösterilen bildirim kartı, varsayılan 8 dp köşe yarıçapını (solda gösterilmiştir) kullanır ve bu, karttaki işlem düğmelerine (sağda gösterildiği gibi) göre daha az vurgu yapar ve bunlar daha önemlidir

16 dp — Orta Vurgu

Etkileşimli öğeler ve genişletilebilir bileşenler dahil olmak üzere orta düzeyde öneme sahip bileşenler için 16 dp köşe yarıçapı kullanın.

16 dp orta köşe örneği
Burada, alt sayfaya orta düzeyde ağırlık vermek için 16 dp'lik bir köşe yarıçapı kullanılmıştır ve bu, geçici olarak ekrandaki mevcut içerikten daha önemlidir

Dairesel — Yüksek Vurgu

Dairesel şekillerin, çoğunlukla doğrusal olan şekiller üzerinde daha fazla görsel etkisi vardır. Bunlar FAB'ler, çipler ve widget'lar gibi çok vurgulu bileşenler için ayrılmalıdır.

Yüksek vurgulu tam yuvarlak köşe örneği
Burada sol altta FAB, sağ üstte işlem düğmeleri ve sol altta FAB'a maksimum düzeyde vurgu yapmak için tamamen yuvarlatılmış köşeler ve yuvarlak şekiller kullanılmıştır