package Ġde . check 2 4 . compose . demo . features . view model Ċ Ċ import Ġandroid . os . Bundle Ċ import Ġandroidx . activity . Component Activity Ċ import Ġandroidx . activity . compose . setContent Ċ import Ġandroidx . activity . view Models Ċ import Ġandroidx . compose . foundation . background Ċ import Ġandroidx . compose . foundation . click able Ċ import Ġandroidx . compose . foundation . layout . Arrange ment Ċ import Ġandroidx . compose . foundation . layout . Box Ċ import Ġandroidx . compose . foundation . layout . Column Ċ import Ġandroidx . compose . foundation . layout . fill MaxSize Ċ import Ġandroidx . compose . foundation . layout . size Ċ import Ġandroidx . compose . material . Sca ffold Ċ import Ġandroidx . compose . material . Switch Ċ import Ġandroidx . compose . material . Text Ċ import Ġandroidx . compose . material . Top AppBar Ċ import Ġandroidx . compose . runtime . Composable Ċ import Ġandroidx . compose . runtime . Mutable State Ċ import Ġandroidx . compose . runtime . mutable State Of Ċ import Ġandroidx . compose . ui . Alignment Ċ import Ġandroidx . compose . ui . Modifier Ċ import Ġandroidx . compose . ui . text . style . Text Align Ċ import Ġandroidx . compose . ui . tool ing . preview . Devices Ċ import Ġandroidx . compose . ui . tool ing . preview . Preview Ċ import Ġandroidx . compose . ui . unit . dp Ċ import Ġandroidx . lifecycle . ViewModel Ċ import Ġde . check 2 4 . compose . demo . theme . Blue 2 0 0 Ċ import Ġde . check 2 4 . compose . demo . theme . Demo Theme Ċ import Ġde . check 2 4 . compose . demo . theme . Green 2 0 0 Ċ Ċ class ĠComp osable ViewModel Activity Ġ: ĠComponent Activity () Ġ{ ĊĊĠĠĠ Ġprivate Ġval Ġmy ViewModel Ġby Ġview Models < My ViewModel >() ĊĊĠĠĠ Ġoverride Ġfun ĠonCreate ( savedInstanceState : ĠBundle ?) Ġ{ ĊĠĠĠĠĠĠĠ Ġsuper . onCreate ( savedInstanceState ) ĊĠĠĠĠĠĠĠ Ġset Content Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ ĠDemo Theme Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠScaffold ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġtop Bar Ġ= Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠTop AppBar ( title Ġ= Ġ{ ĠText ( text Ġ= Ġ" ViewModel ") Ġ}) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠMy Screen ( my ViewModel Ġ= Ġmy ViewModel ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} Ċ } Ċ /* ĠGoogle 's Ġcomp osable Ġway Ġ*/ Ċ Ċ // Ġthe ĠViewModel Ġmanages Ġthe Ġstates Ġand Ġthe Ġevents Ċ // Ġit Ġalso Ġhas Ġaccess Ġto Ġthe Ġbusiness Ġlogic Ġand Ġlives Ġlonger Ġthan Ġthe Ġcomp osable Ċ class ĠMy ViewModel Ġ: ĠViewModel (), ĠMy ViewModel Interface Ġ{ ĊĠĠĠ Ġ// Ġstates ĊĠĠĠ Ġoverride Ġvar Ġnumber Ġ= Ġmutable State Of ( 0 ) ĊĠĠĠ Ġoverride Ġvar Ġis Selected Ġ= Ġmutable State Of ( false ) ĊĊĠĠĠ Ġ// Ġevents ĊĠĠĠ Ġoverride Ġfun Ġadd Number () Ġ{ ĊĠĠĠĠĠĠĠ Ġnumber . value Ġ= Ġnumber . value Ġ+ Ġ 1 ĊĠĠĠ Ġ} ĊĊĠĠĠ Ġoverride Ġfun Ġtoggle ( clicked : ĠBoolean ) Ġ{ ĊĠĠĠĠĠĠĠ Ġis Selected . value Ġ= Ġclicked ĊĠĠĠ Ġ} Ċ } Ċ Ċ @ Composable Ċ fun ĠMy Screen ( my ViewModel : ĠMy ViewModel ) Ġ{ ĊĠĠĠ ĠColumn ( ĊĠĠĠĠĠĠĠ Ġmodifier Ġ= ĠModifier . fill MaxSize (), ĊĠĠĠĠĠĠĠ Ġhorizontal Alignment Ġ= ĠAlignment . Center H orizontally , ĊĠĠĠĠĠĠĠ Ġvertical Arrange ment Ġ= ĠArrange ment . Center ĊĠĠĠ Ġ) Ġ{ ĊĠĠĠĠĠĠĠ ĠBox ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġmodifier Ġ= ĠModifier ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. background ( Blue 2 0 0 ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. size ( 5 0 . dp ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. click able Ġ{ Ġmy ViewModel . add Number () Ġ}, ĊĠĠĠĠĠĠĠĠĠĠĠ Ġcontent Alignment Ġ= ĠAlignment . Center ĊĠĠĠĠĠĠĠ Ġ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ ĠText ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠtextAlign Ġ= ĠText Align . Center , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġtext Ġ= Ġmy ViewModel . number . value . toString () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ) ĊĠĠĠĠĠĠĠ Ġ} ĊĊĠĠĠĠĠĠĠ ĠSwitch ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġchecked Ġ= Ġmy ViewModel . isSelected . value , ĊĠĠĠĠĠĠĠĠĠĠĠ Ġon Checked Change Ġ= Ġ{ Ġmy ViewModel . toggle ( it ) Ġ} ĊĠĠĠĠĠĠĠ Ġ) ĊĊĠĠĠĠĠĠĠ ĠBox ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġmodifier Ġ= ĠModifier ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. size ( 1 0 0 . dp ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. background ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġif Ġ( my ViewModel . isSelected . value ) ĠGreen 2 0 0 Ġelse ĠBlue 2 0 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ) ĊĠĠĠĠĠĠĠ Ġ) ĊĠĠĠ Ġ} Ċ } Ċ Ċ /* Ġthe Ġway Ġhow Ġthe Ġpreview Ġworks Ġ*/ Ċ interface ĠMy ViewModel Interface Ġ{ ĊĠĠĠ Ġval Ġnumber : ĠMutable State < Int > ĊĠĠĠ Ġval Ġis Selected : ĠMutable State < Boolean > ĊĊĠĠĠ Ġfun Ġadd Number () ĊĠĠĠ Ġfun Ġtoggle ( clicked : ĠBoolean ) Ċ } Ċ Ċ @ Composable Ċ fun ĠMy Screen ( my ViewModel : ĠMy ViewModel Interface ) Ġ{ ĊĠĠĠ ĠColumn ( ĊĠĠĠĠĠĠĠ Ġmodifier Ġ= ĠModifier . fill MaxSize (), ĊĠĠĠĠĠĠĠ Ġhorizontal Alignment Ġ= ĠAlignment . Center H orizontally , ĊĠĠĠĠĠĠĠ Ġvertical Arrange ment Ġ= ĠArrange ment . Center ĊĠĠĠ Ġ) Ġ{ ĊĠĠĠĠĠĠĠ ĠBox ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġmodifier Ġ= ĠModifier ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. background ( Blue 2 0 0 ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. size ( 5 0 . dp ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. click able Ġ{ Ġmy ViewModel . add Number () Ġ}, ĊĠĠĠĠĠĠĠĠĠĠĠ Ġcontent Alignment Ġ= ĠAlignment . Center ĊĠĠĠĠĠĠĠ Ġ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ ĠText ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠtextAlign Ġ= ĠText Align . Center , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġtext Ġ= Ġmy ViewModel . number . value . toString () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ) ĊĠĠĠĠĠĠĠ Ġ} ĊĊĠĠĠĠĠĠĠ ĠSwitch ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġchecked Ġ= Ġmy ViewModel . isSelected . value , ĊĠĠĠĠĠĠĠĠĠĠĠ Ġon Checked Change Ġ= Ġ{ Ġmy ViewModel . toggle ( it ) Ġ} ĊĠĠĠĠĠĠĠ Ġ) ĊĊĠĠĠĠĠĠĠ ĠBox ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġmodifier Ġ= ĠModifier ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. size ( 1 0 0 . dp ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. background ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġif Ġ( my ViewModel . isSelected . value ) ĠGreen 2 0 0 Ġelse ĠBlue 2 0 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ) ĊĠĠĠĠĠĠĠ Ġ) ĊĠĠĠ Ġ} Ċ } Ċ Ċ @ Preview ( show Background Ġ= Ġtrue , Ġshow System Ui Ġ= Ġtrue , Ġdevice Ġ= ĠDevices . PIXEL _ 4 ) Ċ @ Composable Ċ private Ġfun ĠMy Screen Preview () Ġ{ ĊĠĠĠ ĠDemo Theme Ġ{ ĊĠĠĠĠĠĠĠ Ġval Ġmy ViewModel Ġ= ĠMy ViewModel () ĊĠĠĠĠĠĠĠ ĠMy Screen ( my ViewModel Ġ= Ġmy ViewModel ) ĊĠĠĠ Ġ} Ċ }