Compose your TRILL

Slides for the talk at Brighton Kotlin on 24/06/2021
"Compose your TRIL"

Transcript

1. luca_nicolett COMPOSE YOUR TRILL COMPOSE @ TRILLER
2. /32 luca_nicolett • What is Jetpack Compose • Setup • Target (in our app) • Code comparison • Conclusions COMPOSE YOUR TRILL 2
3. /32 luca_nicolett • Modern UI toolkit • Based on Kotlin (more on this) • Paradigm switch (more on this) • Decoupled from the OS JETPACK COMPOSE 3
4. /32 luca_nicolett • 100% kotlin • Not only a UI toolkit • Compose UI + Compose compiler • @Composable == suspend? KOTLIN 4
5. /32 luca_nicolett • Functional • Pure & side effect - free • Trailing lambda syntax highly used KOTLIN 5
6. /32 luca_nicolett • Declarative API • Declarative vs Imperative • Widget tree with internal state (setText, setVisibility, addChild, setImageBitmap) • Illegal states (2 updates con fl ict in an unexpected way) THINKING DECLARATIVE Imperative: 
 - put block 1 
 - put block 2 above 
 - put block 3 above Declarative: 
 - A tower with: 
 - block 1, block 2, block 3 6
7. /32 luca_nicolett • Describe your UI right now • For any value of now • Code independent of previous state THINKING DECLARATIVE 7
8. /32 luca_nicolett THINKING DECLARATIVE SCREEN LIST ITEM ITEM ITEM Events Data SCREEN LIST ITEM ITEM ITEM Events Data 8
9. /32 luca_nicolett SETUP 9
10. /32 luca_nicolett SETUP 10
11. /32 luca_nicolett SETUP 11
12. /32 luca_nicolett TARGET 12
13. /32 luca_nicolett CODE - old 13
14. /32 luca_nicolett CODE - old 14
15. /32 luca_nicolett CODE - old 15
16. /32 luca_nicolett CODE - old 16
17. /32 luca_nicolett CODE - old 17
18. /32 luca_nicolett CODE - old 18
19. /32 luca_nicolett COMPOSE 19
20. /32 luca_nicolett CODE - compose 20
21. /32 luca_nicolett CODE - compose 21
22. /32 luca_nicolett CODE - compose 22
23. /32 luca_nicolett CODE - compose 23
24. /32 luca_nicolett CODE - compose 24
25. /32 luca_nicolett CODE - compose 25
26. /32 luca_nicolett CODE - compose 26
27. /32 luca_nicolett CODE - compose 27
28. /32 luca_nicolett CODE - compose 28
29. /32 luca_nicolett CODE - compose 29
30. /32 luca_nicolett • Worthiness • Speed of development • Learning curve • Have it “approved” CONCLUSIONS 30
31. /32 luca_nicolett • https://developer.android.com/jetpack/compose/mental-model • https://www.youtube.com/watch?v=6BRlI5zfCCk • https://github.com/airbnb/Showkase • https://developer.android.com/jetpack/compose/testing-cheatsheet REFERENCES 31
32. luca_nicolett Q&A