Jetpack Compose Kullanımı
--
Merhabalar, bugün sizlerle Android geliştiricilerin gözdelerinden Jetpack Compose’u öğreneceğiz. 🥳 Çaylar, 🍵 kahveler ☕️ hazırsa zaman kaybetmeden Haydi başlayalım. 🎬
Jetpack Compose, Google Developer’lar tarafından geliştirilen Native UI’lar oluşturmaya yarayan 🆕 🔥 Android Modern Tool’udur.
Jetpack Compose, iOS 🍎 uygulama geliştirmede kullanılan SwiftUI’a 🥰benzetilmektedir. Bu benzetme daha kolay tasarım, az kod, çok iş felsefesinden yola çıkılmaktadır.
SwiftUI ile ilgili bilgiler için aşağıdaki blog yazısını inceleyebilirsiniz. ⤵️
Jetpack Compose, Android uygulamalarda UI(User Interface) geliştirmelerini basitleştirip, daha hızlı 💨 şekilde app geliştirmesine olanak sağlar.
Jetpack Compose’un mottosu 📢 , daha az kod, güçlü araçlar, sezgisel Kotlin API’lar, hızlı bir şekilde uygulama geliştirmedir.
- 😎 Daha az kod kullan: Tüm hata sınıflarından kurtulup, basit kod düzeniyle kolay bakım sağlayın.
- 👀 Sezgiseldir: Yapmanız gereken sadece UI tanımlamak, gerisini Compose halletmektedir. Uygulamanın durumunda değişiklikler oldukça otomatik bir şekilde UI ekranlarınız güncelleniyor.
- 💨 Uygulama geliştirmesini hızlandırın: Yazmış olduğunuz mevcut koda uyumludur. İstediğiniz zaman kolayca bakımını yapabilirsiniz. Flutter’da olduğu gibi yazdığınız kodu anında görüntüleyebilirsiniz. Bu şekilde tasarımlarınızı daha hızlı yapabilirsiniz.
- 🎉 Gücüne güç kat: Android’in platform API’lerine erişim sağlar. Material Design, Dark Theme, animation ve daha birçok özellikle uygulamanızı modern şekilde oluşturup kullanıcıları kendinize hayran bırakın. ❤️
Jetpack Compose ile Android app geliştirmek daha zevkli ve kolay olacağına inanıyorum. 🙏🏼
Detaylı bilgi için resmi sitesine göz atabilirsiniz: ↩️
Jetpack Compose ilk stable sürümü 1.0.0'ı (July,28 2021) tarihinde yayınladı. 📜
Stable sürüm ise January 17, 2023 tarihiyle beraber 1.4.0 şeklinde kullanılmaktadır. ✅
Kurulumlar 🛠
Jetpack Compose ile ilgili teorik bilgileri öğrendikten sonra şimdi kodlama kısmına geçebiliriz. Aşağıdaki adrese gidiyoruz. ⤵️
Güncel Android Studio Electric Eel | 2022.1.1 sürümünü indirebilirsiniz.
Kurulum tamamladıktan sonra New Project butonuna basarak projeyi oluşturma adımlarına geçiyoruz. Activity seçme ekranında Empty Compose Activity seçeneğini seçerek Compose özelliklerini kullanabileceğiz.
Son adımda proje ile ilgili ayarlamalar yapılıyor. Jetpack Compose, Kotlin diliyle geliştirildiği için sadece 🥹 Kotlin’i desteklemektedir. Minimum 😈seçebileceğiniz SDK ise 🍭 API 21(Android 5.0)’dir.
Hi, Jetpack Compose Örneği 🧑🏻💻 👩💻
Android uygulama geliştirirken kullanılan layoutları onCreate() fonksiyonu içinde setContentView(R.layout.activity_main)diyerek tanımlıyorduk. Compose ile xml inflate etmek yerine direkt Composoble fonksiyon çağrılıyor. setContent{} blokları arasında layout işlemleri yapılır.
@Composoble Fonksiyon : @Composoble ile annotate edilen bir fonksiyon türüdür. @Composoble fonksiyon sadece 1️⃣ diğer composable fonksiyonların scope’unda çağrılmaktadır. Bunun geliştiricilere avantajı ise Composable türündeki bir fonksiyonun diğer @Composable fonksiyonlarını çağırabilmesini sağlar.
Jetpack Compose, bir composable fonksiyonu uygulamadaki UI elementlerine dönüştürebilmesi için custom Kotlin compiler plugini kullanmaktadır. Button fonksiyonu Compose UI kütüphanesinde tanımlıdır.
import androidx.compose.material.ButtonButton kullanmak istediğimizde compose içindeki Button sınıfını import edip kullanıyoruz.
Button tanımlaması yaparken butona tıklanınca ne olacak onu belirten bir scope bulunur. Buton üzerindeki Text’te ne yazacak, text’in konumlaması ne olacak onların ayarlamaları yapıldı.
Compose Fonksiyonuna @Preview annotate ettiğimizde default preview kısmında görüntüleyebilirsiniz. 🧐
Bu özellik SwiftUI’daki gibi yazılan kodun anlık olarak görüntülenmesini sağlamaktadır. 👌🏻 💣
Flutter’da bu özelliğe Hot Reload olarak adlandırılmaktadır. Flutter’la ilgili detaylı bilgi için blog yazısını inceleyebilirsiniz. 🕵🏼♀️
Jetpack Compose, Object Oriented Design Principles(Nesneye Yönelik Tasarın Prensipleri)nden biri olan Single Responsibility Principle (Tek Sorumluluk Prensibi) kullanmaktadır. 🤓
Object Oriented Design Principles, nesne yönelimli programlamanın özü olan ve iyi bir tasarıma sahip olmamıza yardımcı olan bir dizi prensibi temsil etmektedir. 💪🏼
Diğer prensiplerle ilgili ayrıntılara aşağıdaki yazıdan ulaşabilirsiniz 👇🏻
@Composable olan fonksiyonların sadece bir sorumluluğu bulunmaktadır.
Örnek olarak bir fonksiyon’da background’a bir color 🌈 ataması yapmak istediğimizde Surface @Composoble fonksiyonunu kullanmamız gerekir. material/Surface.kt şeklinde bulabilirsiniz.
Kullanabileceğiniz özellikler burada görüntülenmektedir. Color özelliğini kullanarak örnek vereceğiz.
Maalesef bir yazının daha sonuna geldik. 🥲
Jetpack Compose ile ilgili yazının sonuna geldik. Herkese keyifli kodlamalar dilerim. 💻
