Jetpack Compose ile Android’de Yeni Bir Yaklaşım-Paradigm Shift #1
Selamlar 👋
Jetpack Compose’un hayatımıza girmesiyle beraber Android uygulama geliştirmede farklı bir yola girdiğimizi söyleyebiliriz. Jetpack Compose’un stabil olmasıyla birlikte ben de dahil olmak üzere pek çok geliştirici Compose’u öğrenmeye ve geliştirdiği uygulamalarda kullanmaya başladı. Kişisel olarak bu durumdan çok mutluyum. Compose ile uygulama geliştirmenin getirdiği yenilikler ve kolaylıklar sayesinde artık kod yazarken daha çok eğlendiğimi söyleyebilirim 🙃
Hazırladığım bu yazıda aşağıda bulunan kavramları tanıtmaya/anlatmaya çalışacağım.
- Jetpack Compose Nedir?
- The Declarative Programming Paradigm
- Composable Functions
- The Declarative Paradigm Shift
Ek olarak bu yazının Jetpack Compose’a bir giriş yazısı olduğunu ve Jetpack Compose başlığı altında hazırlayacağım diğer yazıların da bir başlangıcı olduğunu bilmenizi istiyorum.
Jetpack Compose Nedir?
Jetpack Compose kısaca Android için bildirimsel bir UI aracıdır diyebilirim. Bildirimsel olması sebebiyle değişikliklerin UI’a yansıması otomatik olarak gerçekleşiyor. Daha basit kodlar yazarak daha büyük işler yapmamızı sağlıyor. Bu sebeple de uygulama geliştirmeyi basitleştiriyor ve hızlandırıyor.
The Declarative Programming Paradigm
Geleneksel olarak Android’deki View’lar, UI Widgets olarak adlandırılan bileşenler ile temsil ediliyor. Bir kullanıcının uygulama ile etkileşime girmesiyle beraber değişen durumların ekrana yansıtılması için UI hiyerarşisinin güncellenmesi gerekiyor.
Bir verinin maruz kaldığı işlemlerden sonra aldığı yeni değeri ekrana yansıtmak için ilgili view’ı güncellemeyi unutmamak gerekiyor.
Bir text’i textView.setText(String) kodunu yazarak ya da bir image’i imageView.setImageBitmap(Bitmap) kodunu yazarak manuel bir şekilde değiştirebiliyoruz.
View’ları manuel olarak değiştirmek ise hata olasılığını arttıran bir durum oluyor.
Bu geleneksel yöntemlerin aksine Jetpack Compose declarative bir yapıda olması sebebiyle UI güncellemelerinde büyük bir kolaylık sağlıyor. Bu yapı, tüm ekranı sıfırdan tekrar oluşturarak ve sadece gerekli durumlarda değişiklikler uygulayarak çalışıyor.
Bu yaklaşımla beraber, manuel olarak yapılan UI güncellemelerinin karmaşıklığından kurtulmuş oluyoruz. 😎
Bu yaklaşımın sağladığı avantajların dışında tüm ekranın tekrardan oluşturulmasının maliyetli bir iş olduğunu düşünebilirsiniz. Bu durumun zaman, işleme gücü ve batarya kullanımına etki edeceği düşünülebilir. Fakat Compose bu dezavantajlardan sıyrılabiliyor. Bunu ise sadece güncellenmesi gereken UI parçasını recompose ederek, yani Türkçesiyle yeniden oluşturarak başarıyor.
Bu kavram ise Recomposition olarak adlandırılıyor. Fakat Recomposition bu yazının konusu değil. Bir başka yazıda bu kavrama değineceğim. 🙂
Composable Functions
Compose kullanarak User Interface’i composable fonskiyonlar ile oluşturabiliyoruz.
Composable fonksiyonlar kısaca @Composable annotation’ı alan fonksiyonlar oluyor. Bu fonksiyonlar bir veri alabiliyor ve aldığı veriyi UI öğesi olarak işleyebiliyor.
Yukarıdaki paylaştığım Composable fonksiyon bir String parametresi alıyor ve aldığı veriyi UI’a yansıtıyor.
Composable Fonksiyonlar Hakkında Bilmeniz Gerekenler:
- Tüm Composable fonksiyonların @Composable annotation’u ile ifade edilmesi gerekiyor. Bu annotation Compose compiler’a ilgili fonksiyonun verileri UI’a dönüştüreceğini bildiriyor.
- Composable fonskiyonlar parametre alabiliyor.
- Composable fonksiyonlar içlerinde başka Composable fonksiyonları çağırabiliyor. Yukarıda paylaştığım kodda Greeting Composable fonksiyonu ekrana metin yansıtmamızı sağlan bir başka Text() Composable fonksiyonunu çağırıyor.
- Composable fonksiyonlar geriye bir değer dönmüyor. Yani return ifadesini bu fonksiyonlarda kullanamıyoruz.
The Declarative Paradigm Shift
User Interface’deki değişimleri aynı composable fonksiyonları farklı veriler ile çağırarak yenileyebiliyoruz. Gözlemlenebilir olan bu veriler her güncellendiğinde composable fonksiyonlar UI’ı güncelleyebiliyor.
Bu durumu anlamak için State kavramını bilmek gerekiyor.
State, uygulamada zamanla değişebilen herhangi bir değer olarak belirtiliyor. Misal Room database’de saklanan bir değer ya da bir class’da bulunan bir değişken state olarak örneklendirilebilir.
Compose’un declarative yaklaşımında ise composable fonksiyonlar kısmen stateless olarak belirtiliyor. Stateless kavramını “state’i olmayan” olarak düşünebilirsiniz.
Peki composable fonksiyonlar stateless ise UI’ı nasıl güncelleyebiliyor?
Composable fonksiyonların tamamen stateless olmadığını “kısmen” kelimesiyle yukarıda açıkladım. Yani bir composable fonksiyonu stateless halden stateful hale çevirebiliyoruz. Bu da UI’ı güncelleyebileceğimiz anlamına geliyor.
Bu yazı için state kavramına daha fazla girmeyeceğim. State de recomposition gibi ayrıca ele alınması gereken bir konu. Ayrıca recomposition ile de epey bağlantılı. Bu noktada daha fazla bilgi için sizi buraya yönlendirebilirim. Fakat bu yazının amacı temelde Jetpack Compose’u anlamak olduğu için şimdilik bu bilgilerle devam edebiliriz. State’e bir başka yazıda değineceğim.
Uygulama, en üst composable fonksiyondan bir veri alıyor. Bu composable fonksiyon ise diğer composable fonksiyonları çağırarak ve bu fonksiyonlara ilgili verileri ileterek UI’ı oluşturmaya başlıyor.
Kullanıcı UI ile etkileşime girdiğinde (misal bir butonun click aksiyonu üzerinden) bu eylem uygulama tarafından fark ediliyor ve UI güncellenmeye başlanıyor. Bu duruma ise yazıda bahsi geçen state’in değişimi olanak sağlıyor. State’in değişimiyle beraber ilgili composable fonksiyonlar yeni verilerle birlikte yeniden çağrılıyor ve bu durum UI elemanlarının yeniden çizilmesine sebebiyet veriyor. Yazıda daha önce bahsi geçen kavram recomposition da tam olarak burada devreye giriyor.
Kullanıcı UI öğesiyle etkileşime girmesiyle beraber uygulama bu eyleme yanıt veriyor ve composable fonksiyonlar yeni parametreleriyle beraber otomatik olarak tekrardan çağrılıyor.
Bitirmeden Önce
Jetpack Compose’a bir giriş niteliğinde olan bu yazı ile birlikte Compose hakkında bilmemiz gereken temel bilgileri edindiğimizi düşünüyorum.
Bu yazı Recomposition, State gibi kavramları anlamak adına bir giriş niteliği taşıyor. Bu yazının devamını içerecek diğer yazılarda görüşmek üzere 👋.
