Bu sene Google IO için fiziksel bir event covid-19 sebebiyle olamıyor, stüdyo kaydı için de ofise gitmemek adına dijital kayıt da olmayacağı açıklandı ama bir diğer yandan yine aynı tarihlerde bu yıl yapılan çalışmaların da duyurulacağını tahmin ediyoruz. Bu anlamda benim en çok merak ettiğim konulardan biri de Compose.
UI developmentla ilgili her sene çeşitli update’ler oluyor ama geçen sene Compose’la biraz şaşırtıcı bir giriş yapmış oldular. Android Summit sonrası artık Android Studio’ya gradle dependecy’si olarak ekleyip deneyebilir duruma gelmiştik. Ben ilk inceleme yazımı yaklaşık 1.5 ay önce yazdığımdaysa güncel versiyon dev03’tü. Bu sene wtm sezonunda birkaç chapter’da bu konuda sunum yapma fırsatım da oldu, sunumlarla paralel de aslında gelişmeleri takip edip kendim için yaptığım sample projeyi güncel tutmaya çalıştım. Bir diğer değişiklikleri güncel olarak takip edebileceğiniz repo ise Google’ın compose’la geliştirdiği sample app Jetnews‘in reposu. Api referanslarında tam olarak nasıl yapacağımı bulamadığım ya da anlamadığım durumlarda çok faydalı olduğunu söylemeliyim. Çünkü developer.android de çok uzunca bir süre anlatımını dev03’e yapmıştı.
dev09 henüz official olarak duyurulmadı. Dolayısıyla yazının başında da dediğim gibi io’nun da tarihlerinin yakın olması sebebiyle codelab’ler, blog yazılarıyla buraya eklenen yeni feature’ların anlatılacağını umuyorum 🙂
dev03’ten dev09’a giden yolda sadece basic text, imaj, buton gösterimi olan sample projemde en fazla etkilenen kısım ise imaj oldu. Ama şunu da söylemeliyim ki dev03’ten dev09’a ya da 8’e direk geçmiş aradaki versiyonları deneyimlememiş olsaydım bunu söylemezdim sanırım.
dev03:
| @Composable | |
| fun SpeakerInformation(speaker: SpeakerInfo) { | |
| Column( | |
| modifier = Spacing(16.dp) | |
| ) { | |
| Container(modifier = Height(180.dp) wraps Expanded) { | |
| Clip(RoundedCornerShape(5.dp)) { | |
| DrawImage(image = speaker.image) | |
| } | |
| } | |
| Text(speaker.name) | |
| Text(speaker.title) | |
| Text(speaker.sessionTitle) | |
| } | |
| } |
dev09:
| @Composable | |
| fun SpeakerImage(image: ImageAsset?) { | |
| image?.let { | |
| val imageModifier = Modifier | |
| .preferredHeightIn(maxHeight = 180.dp) | |
| .fillMaxWidth() | |
| .clip(shape = RoundedCornerShape(4.dp)) | |
| Image(image, modifier = imageModifier, contentScale = ContentScale.Crop) | |
| } | |
| } |
Bir önceki yazımda anlatırken imajın belli özelliklerde çizilebilmesi için, container objesinin içerisinde yer almasını gerektiğini, container’a modifier tanımlayarak imajımızı istediğimiz gibi çizdirebileceğimizi anlatmıştım. 09’a evrilen yolda ise imaj kendisi modifier alabiliyor, container’a ihtiyaç duymaksızın çizebiliyoruz.
Yine örnekte de dikkat edileceği üzere ilk versiyonda bir şeyi modifier olarak kullanabilmek için tam adını bilmek ve bu şekilde eklemek gerekiyordu, LayoutPadding, Flexible vs gibi. Bu şimdi ise Modifier.<…> şeklinde erişebileceğimiz ya da çok daha developer friendly bir kullanıma evrilmiş. Developer friendly demişken 3’ten 9’a minor isim değişikleri, paket değişiklikleri, bazı constructor’da değişiklikler oldu ama giden nokta hep kullanımı daha da basitleştirme yönündeydi.
Bir diğer beklenen konu iste listelerin geliştirilmesinin stabilleşmesiydi. Android Summit’de recylerview yerine scrollinglist isminde ya da buna benzer bir yapı üzerinde çalışıldığı duyurulmuştu. Ancak henüz deneyebileceğimiz bir versiyonu da api içerisinde mevcut değildi. Jetnews app’inde verticalscroller kullanılarak recyclerview benzeri yapılar implement edilmişti. Bu bağlamda ben de her yeni gelen update’de recylerview yerine gelecek component belli oldu mu yoksa verticalscoller’ın çalışma prensibi/performansıyla ilgili bir update geldi mi açıklayacakları diye merakla bekliyordum.
adapterlist dev05’te duyurulmasına rağmen henüz jetnews’de de bununla ilgili bir update yapılmadı ancak açıklamasından recyclerview’e denk olduğunu da anlıyoruz.
@Composable fun <T> AdapterList(
data: List<T>,
modifier: Modifier = Modifier,
itemCallback: (T) -> Unit
): Unit
“A vertically scrolling list that only composes and lays out the currently visible items.”
Benim blog yazısı için geliştirdiğim sample uygulamada denemek isteseydik ise aşağıdaki şekilde implement edecektik.
| @Composable | |
| fun SpeakerList(speakers: List<SpeakerInfo>){ | |
| AdapterList(data = speakers) { | |
| SpeakerInformation(speaker = it) | |
| } | |
| } |
Yeni gelecek haberleri de merakla bekliyoruz. 🙂
Referanslar:
- https://developer.android.com/reference/kotlin/androidx/ui/foundation/package-summary
- https://developer.android.com/jetpack/compose/tutorial
Sample proje: https://github.com/ElifBon/ComposeIWD
Elif Boncuk's Blog 