Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Jetpack Compose - DevFest 2019
Search
Raka Adi Nugroho
September 24, 2022
Technology
160
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Jetpack Compose - DevFest 2019
latepost, jetpack compose GDG DevFest 2019 Yogyakarta
Raka Adi Nugroho
September 24, 2022
More Decks by Raka Adi Nugroho
See All by Raka Adi Nugroho
Pemrograman Web - Pertemuan 1
rakaadinugroho
0
52
Leveraging GraphQL with Kotlin Multiplatform
rakaadinugroho
0
69
Security Awareness: Web Development Process
rakaadinugroho
0
57
Open Telemetry in Web Development
rakaadinugroho
0
76
Software Architecture 101
rakaadinugroho
0
94
Coroutine x Retrofit - Android Developer Day
rakaadinugroho
0
940
Other Decks in Technology
See All in Technology
実体験から学ぶ分析エージェントの開発と運⽤
recruitengineers
PRO
8
2k
オンラインゲームのシステム全体像 - コロプラ 2026年度 新卒研修
colopl
0
1.1k
[AWS 秋のクラウドオペレーション祭り 2026]AWS DevOps Agentで変わるリリースと運用対応 ~リリース管理機能と Directed actions のご紹介~
furuton
4
1.2k
事業活動を AI Ready にする攻めと守りのデータエンジニアリング / data-engineering-for-ai-ready-business
pei0804
7
2.5k
パッチ更新でterraform initが落ちた日
grimoh
1
120
ai_cording_with_k8s_knowledge.pdf
mochizuki875
1
330
FOSS4Gを活用した自治体業務DXの試み
470715
0
150
不可逆な意思決定を避けながら10億超の顧客データを AI Ready にするデータ基盤設計
baseballyama
1
300
自主式軟體工廠
philipz
0
250
SDDの運用にめげずに向き合った話
sansantech
PRO
1
140
生成AIで高い生産性を求められて、 悩み、乗り越えた話
mot_techtalk
2
160
メルペイ 会計システム概要と歴史
mewuto
0
200
Featured
See All Featured
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
1.1k
How to Talk to Developers About Accessibility
jct
2
570
Automating Front-end Workflow
addyosmani
1369
210k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.6k
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
inesmontani
PRO
3
2.4k
Rails Girls Zürich Keynote
gr2m
96
14k
A better future with KSS
kneath
240
18k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
53k
A Soul's Torment
seathinner
8
3.7k
The Cost Of JavaScript in 2023
addyosmani
55
10k
Code Reviewing Like a Champion
maltzj
529
40k
Build your cross-platform service in a week with App Engine
jlugia
234
19k
Transcript
None
JetPack Compose
About Raka Adi Nugroho - Software Engineer Android @Tokopedia -
External Academy Reviewer @Dicoding - Android Developer @PrivyID /rakaadinugroho
JetPack Compose
None
Overview Jetpack Compose Jetpack Compose is a modern toolkit for
building native Android UI. Jetpack Compose simplifies and accelerates UI development on Android with less code, powerful tools, and intuitive Kotlin APIs.
None
History of UI Toolkit
Android Journey
Common Thing Spread across several files - MainActivity.kt / JournalFragment.kt
- fragment_journal.xml - style.xml
Core Concept - Concise and Idiomatic Kotlin - Declarative -
Compatible - Beautiful Apps - Accelerate Development
Concise and Idiomatic Kotlin
Declarative
Declarative Imperative
Compatible
Beautiful Apps
Accelerate Development
Tokopedia UI - Unify
What do we need? - Re-Usable UI Component - Single
source of truth
Hi! Jetpack Compose Future?
Jetpack Compose - Major Components - Compose UI Library -
Compose Compiler
Jetpack Compose - Major Components
Android Studio Support
Layout Preview?
# 1 Data Flow?
Data Flow The declarative nature of Compose and it's UI
components influence how data flows through a Compose application. DATA EVENT
Data Flow - Data Flows Down DATA
Data Flow - Events flow up EVENT
UI as a Tree VS COLUMN JOURNAL ITEM 1 JOURNAL
ITEM N CARD TITLE ABSTRACTION BUTTON
UI as a Tree VS COLUMN JOURNAL ITEM 1 JOURNAL
ITEM N CARD TITLE ABSTRACTION BUTTON
# 2 State Handler
UI as a Function UI=f(s)
State Handler
Existing UI UI Rendering Compose
Demo
- Flexibility - Re-Usability - Reactive Model - Less code
POV : Pros & Cons - Min. API 21 - Layout Params (Padding)
Jetpack Compose build for U & I ?
Quick Recap 1. New Way to Build UI on Android
2. As an Android Developer, you must try
end; https://github.com/rakaadinugroho/ComposePlayground