5分でわかるCompose Modifiers deep dive

サイボウズ社内勉強会 Android Dev Summit報告LT会の資料です

元動画
Compose Modifiers deep dive
https://youtu.be/BjGX2RftXsU

Transcript

1. 5 Compose Modi fi ers deep dive Android Dev Summit LT (@mr_mkeeda) IUUQTZPVUVCF#K(93GU9T6
2. Modi fi er Modi fi er API Modi fi er ( Compose 1 . 2 ) ⭐ Recompose Modi fi er (Compose 1 . 3 ) ⭐ (Memory Allocation ) compose UI 2
3. Modi fi er 3 @Composable fun Screen() { val modifier = Modifier .padding(10.dp) .background(Color.Blue) .clickable { } Row { Text("Hello", modifier) Text("World", modifier) } } API 

4. Modi fi er 4 Text Text( text = "Hello", modifier = Modifier .padding(10.dp) .background(Color.Blue) .clickable { } ) padding background clickable
5. Modi fi er 5 Layout Text( text = "Hello", modifier = Modifier .padding(10.dp) .background(Color.Blue) .clickable { } ) padding background clickable Hello Modi fi er.Element LayoutNode (ComposeNode) Modi fi er.Element
6. Stateful Modi fi er 6 Layout padding background Hello Clickable State clickable Recompose Modi fi er 
 Modi fi er fun Composer.materialize(modifier: Modifier): Modifier fun Modifier.composed( /*…*/ factory: @Composable Modifier.() -> Modifier ): Modifier
7. Modi fi er.composed Element 7 padding background Layout Hello pointerInput semantics Clickable ( 1 6 Elements) IUUQTZPVUVCF#K(93GU9T6 U
8. Modi fi er 8 padding background Layout Hello pointerInput semantics Entity Entity Entity Entity Entity Modi fi er.Element Modi fi er.Element 
 Entity
9. Recompose 9 padding Layout padding background Hello Clickable State
10. Recompose 10 Recompose 
 Modi fi er Clickable padding background Layout Hello pointerInput semantics Clickable
11. Recompose 11 Entity Entity padding background Layout Hello pointerInput semantics Entity Entity Entity Entity
12. Modi fi er.Node Modi fi er
13. Node 13 Layout Text( text = "Hello", modifier = Modifier .padding(10.dp) .background(Color.Blue) .clickable { } ) padding background clickable Hello
14. Modi fi er.Node 14 Modi fi er.Node LayoutNode composed/materialize 
 Composition Modi fi er Stateful State Node 
 padding background clickable Layout Hello PaddingNode BackgroundNode ClickableNode State
15. Recompose 15 padding Layout padding background clickable Hello
16. Modi fi er.Node 16 Node Recompose Node Node padding background clickable Layout Hello PaddingNode BackgroundNode ClickableNode State
17. Compose Modi fi ers deep dive Modi fi er Compose 1 . 3 . 0 Modi fi er 頻 Modi fi er.Node Compose 
 17