/* Ċ Ġ* ĠCopyright Ġ 2 0 2 1 ĠThe ĠAndroid ĠOpen ĠSource ĠProject Ċ Ġ* Ċ Ġ* ĠLicensed Ġunder Ġthe ĠApache ĠLicense , ĠVersion Ġ 2 . 0 Ġ( the Ġ" License "); Ċ Ġ* Ġyou Ġmay Ġnot Ġuse Ġthis Ġfile Ġexcept Ġin Ġcompliance Ġwith Ġthe ĠLicense . Ċ Ġ* ĠYou Ġmay Ġobtain Ġa Ġcopy Ġof Ġthe ĠLicense Ġat Ċ Ġ* Ċ Ġ* ĠĠĠĠĠ Ġhttp :// www . apache . org / licenses / LICENSE - 2 . 0 Ċ Ġ* Ċ Ġ* ĠUnless Ġrequired Ġby Ġapplicable Ġlaw Ġor Ġagreed Ġto Ġin Ġwriting , Ġsoftware Ċ Ġ* Ġdistributed Ġunder Ġthe ĠLicense Ġis Ġdistributed Ġon Ġan Ġ" AS ĠIS " ĠBASIS , Ċ Ġ* ĠWITHOUT ĠWARRANTIES ĠOR ĠCONDITIONS ĠOF ĠANY ĠKIND , Ġeither Ġexpress Ġor Ġimplied . Ċ Ġ* ĠSee Ġthe ĠLicense Ġfor Ġthe Ġspecific Ġlanguage Ġgoverning Ġpermissions Ġand Ċ Ġ* Ġlimitations Ġunder Ġthe ĠLicense . Ċ Ġ*/ Ċ Ċ package Ġandroidx . compose . animation . samples Ċ Ċ import Ġandroidx . annotation . Sample d Ċ import Ġandroidx . compose . animation . Animated Content Ċ import Ġandroidx . compose . animation . Animated Content Scope Ċ import Ġandroidx . compose . animation . Animated Content Scope . Slide Direction Ċ import Ġandroidx . compose . animation . Content Transform Ċ import Ġandroidx . compose . animation . Experimental Animation Api Ċ import Ġandroidx . compose . animation . Size Transform Ċ import Ġandroidx . compose . animation . core . animate Dp Ċ import Ġandroidx . compose . animation . core . keyframes Ċ import Ġandroidx . compose . animation . core . t ween Ċ import Ġandroidx . compose . animation . core . update Transition Ċ import Ġandroidx . compose . animation . fadeIn Ċ import Ġandroidx . compose . animation . fadeOut Ċ import Ġandroidx . compose . animation . slide In Vert ically Ċ import Ġandroidx . compose . animation . slide Out Vert ically Ċ import Ġandroidx . compose . animation . with Ċ import Ġandroidx . compose . foundation . background Ċ import Ġandroidx . compose . foundation . layout . Arrange ment Ċ import Ġandroidx . compose . foundation . layout . Box Ċ import Ġandroidx . compose . foundation . layout . Column Ċ import Ġandroidx . compose . foundation . layout . Row Ċ import Ġandroidx . compose . foundation . layout . Spacer Ċ import Ġandroidx . compose . foundation . layout . padding Ċ import Ġandroidx . compose . foundation . layout . size Ċ import Ġandroidx . compose . foundation . shape . Cut Corner Shape Ċ import Ġandroidx . compose . material . Button Ċ import Ġandroidx . compose . material . Surface Ċ import Ġandroidx . compose . material . Text Ċ import Ġandroidx . compose . runtime . Composable Ċ import Ġandroidx . compose . runtime . getValue Ċ import Ġandroidx . compose . runtime . mutable State Of Ċ import Ġandroidx . compose . runtime . remember Ċ import Ġandroidx . compose . runtime . setValue Ċ import Ġandroidx . compose . ui . Alignment Ċ import Ġandroidx . compose . ui . Modifier Ċ import Ġandroidx . compose . ui . draw . clip Ċ import Ġandroidx . compose . ui . draw . shadow Ċ import Ġandroidx . compose . ui . graphics . Color Ċ import Ġandroidx . compose . ui . unit . Int Size Ċ import Ġandroidx . compose . ui . unit . dp Ċ import Ġandroidx . compose . ui . unit . sp Ċ Ċ @ Opt In ( Experimental Animation Api :: class ) Ċ @ Composable Ċ @ Sample d Ċ fun ĠAn imate Increment De crement Sample () Ġ{ ĊĠĠĠ ĠColumn ( Modifier . padding ( 2 0 . dp ), Ġhorizontal Alignment Ġ= ĠAlignment . Center H orizontally ) Ġ{ ĊĠĠĠĠĠĠĠ Ġvar Ġcount Ġby Ġremember Ġ{ Ġmutable State Of ( 0 ) Ġ} ĊĠĠĠĠĠĠĠ Ġ// ĠThe Ġ` Animated Content ` Ġbelow Ġuses Ġan Ġinteger Ġcount Ġas Ġits Ġtarget Ġstate . ĠSo Ġwhen Ġthe ĊĠĠĠĠĠĠĠ Ġ// Ġcount Ġchanges , Ġit Ġwill Ġanimate Ġout Ġthe Ġcontent Ġassociated Ġwith Ġthe Ġprevious Ġcount , Ġand ĊĠĠĠĠĠĠĠ Ġ// Ġanimate Ġin Ġthe Ġcontent Ġassociated Ġwith Ġthe Ġtarget Ġstate . ĊĠĠĠĠĠĠĠ ĠAnimated Content ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġtarget State Ġ= Ġcount , ĊĠĠĠĠĠĠĠĠĠĠĠ Ġtransition Spec Ġ= Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠWe Ġcan Ġdefine Ġhow Ġthe Ġnew Ġtarget Ġcontent Ġcomes Ġin Ġand Ġhow Ġinitial Ġcontent ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġleaves Ġin Ġthe ĠContent Transform . ĠHere Ġwe Ġwant Ġto Ġcreate Ġthe Ġimp ression Ġthat Ġthe ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġdifferent Ġnumbers Ġhave Ġa Ġspatial Ġrelationship Ġ- Ġlarger Ġnumbers Ġare ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġposition ed Ġ( vert ically ) Ġbelow Ġsmaller Ġnumbers . ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġif Ġ( target State Ġ> ĠinitialState ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠIf Ġthe Ġincoming Ġnumber Ġis Ġlarger , Ġnew Ġnumber Ġslides Ġup Ġand Ġf ades Ġin Ġwhile ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġthe Ġprevious Ġ( smaller ) Ġnumber Ġslides Ġup Ġto Ġmake Ġroom Ġand Ġf ades Ġout . ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġslide In Vert ically ({ Ġit Ġ}) Ġ+ ĠfadeIn () Ġwith ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġslide Out Vert ically ({ Ġ- it Ġ}) Ġ+ Ġfade Out () ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ġelse Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠIf Ġthe Ġincoming Ġnumber Ġis Ġsmaller , Ġnew Ġnumber Ġslides Ġdown Ġand Ġf ades Ġin Ġwhile ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġthe Ġprevious Ġnumber Ġslides Ġdown Ġand Ġf ades Ġout . ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġslide In Vert ically ({ Ġ- it Ġ}) Ġ+ ĠfadeIn () Ġwith ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġslide Out Vert ically ({ Ġit Ġ}) Ġ+ Ġfade Out () ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠDisable Ġclipping Ġsince Ġthe Ġfa ded Ġslide - out Ġis Ġdesired Ġout Ġof Ġbounds , Ġbut ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġthe Ġsize Ġtransform Ġis Ġstill Ġneeded Ġfrom Ġnumber Ġgetting Ġlonger ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ}. using ( Size Transform ( clip Ġ= Ġfalse )) Ġ// ĠUsing Ġdefault Ġspring Ġfor Ġthe Ġsize Ġchange . ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ) Ġ{ Ġtarget Count Ġ-> ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠThis Ġestab lishes Ġa Ġmapping Ġbetween Ġthe Ġtarget Ġstate Ġand Ġthe Ġcontent Ġin Ġthe Ġform Ġof Ġa ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠComp osable Ġfunction . ĠIMPORT ANT : ĠThe Ġparameter Ġof Ġthis Ġcontent Ġlambda Ġshould ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġ* always * Ġbe Ġused . ĠDuring Ġthe Ġcontent Ġtransform , Ġthe Ġold Ġcontent Ġwill Ġbe Ġlooked Ġup ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġusing Ġthis Ġlambda Ġwith Ġthe Ġold Ġstate , Ġuntil Ġit 's Ġfully Ġanimated Ġout . ĊĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠSince ĠAnimated Content Ġdifferent i ates Ġthe Ġcontents Ġusing Ġtheir Ġtarget Ġstates Ġas Ġthe ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġkey , Ġthe Ġsame Ġcomp osable Ġfunction Ġreturned Ġby Ġthe Ġcontent Ġlambda Ġlike Ġbelow Ġwill Ġbe ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġinvoked Ġunder Ġdifferent Ġkeys Ġand Ġtherefore Ġtreated Ġas Ġdifferent Ġentities . ĊĠĠĠĠĠĠĠĠĠĠĠ ĠText ("$ target Count ", ĠfontSize Ġ= Ġ 2 0 . sp ) ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ ĠSp acer ( Modifier . size ( 2 0 . dp )) ĊĠĠĠĠĠĠĠ ĠRow ( horizontal Arrange ment Ġ= ĠArrange ment . Space Around ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ ĠButton ( onClick Ġ= Ġ{ Ġcount -- Ġ}) Ġ{ ĠText (" Minus ") Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ ĠSp acer ( Modifier . size ( 6 0 . dp )) ĊĠĠĠĠĠĠĠĠĠĠĠ ĠButton ( onClick Ġ= Ġ{ Ġcount ++ Ġ}) Ġ{ ĠText (" Plus Ġ") Ġ} ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} Ċ } Ċ Ċ @ Opt In ( Experimental Animation Api :: class ) Ċ @ Composable Ċ @ Sample d Ċ fun ĠSimple Animated Content Sample () Ġ{ ĊĠĠĠ Ġ// Ġenum Ġclass ĠContent State Ġ{ ĠFoo , ĠBar , ĠB az Ġ} ĊĠĠĠ Ġ@ Composable ĊĠĠĠ Ġfun ĠFoo () Ġ{ ĠBox ( Modifier . size ( 2 0 0 . dp ). background ( Color ( 0 xffff db 0 0 ))) Ġ} ĊĊĠĠĠ Ġ@ Composable ĊĠĠĠ Ġfun ĠBar () Ġ{ ĠBox ( Modifier . size ( 4 0 . dp ). background ( Color ( 0 xffff 8 1 0 0 ))) Ġ} ĊĊĠĠĠ Ġ@ Composable ĊĠĠĠ Ġfun ĠB az () Ġ{ ĠBox ( Modifier . size ( 8 0 . dp , Ġ 2 0 . dp ). background ( Color ( 0 xffff 4 4 0 0 ))) Ġ} ĊĊĠĠĠ Ġvar Ġcontent State : ĠContent State Ġby Ġremember Ġ{ Ġmutable State Of ( Content State . Foo ) Ġ} ĊĠĠĠ ĠAnimated Content ( content State ) Ġ{ ĊĠĠĠĠĠĠĠ Ġwhen Ġ( it ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠSpecifies Ġthe Ġmapping Ġbetween Ġa Ġgiven ĠContent State Ġand Ġa Ġcomp osable Ġfunction . ĊĠĠĠĠĠĠĠĠĠĠĠ ĠContent State . Foo Ġ-> ĠFoo () ĊĠĠĠĠĠĠĠĠĠĠĠ ĠContent State . Bar Ġ-> ĠBar () ĊĠĠĠĠĠĠĠĠĠĠĠ ĠContent State . B az Ġ-> ĠB az () ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} Ċ } Ċ Ċ private Ġenum Ġclass ĠContent State Ġ{ ĠFoo , ĠBar , ĠB az Ġ} Ċ Ċ @ Opt In ( Experimental Animation Api :: class ) Ċ @ Suppress (" UNUSED _ VARIABLE ") Ċ @ Sample d Ċ fun ĠAnimated Content Transition Spec Sample () Ġ{ ĊĠĠĠ Ġ// Ġenum Ġclass ĠCart State Ġ{ ĠEx pan ded , ĠCol lapsed Ġ} ĊĠĠĠ Ġval Ġtransition Spec : ĠAnimated Content Scope < Cart State >. () Ġ-> ĠContent Transform Ġ= ĊĠĠĠĠĠĠĠ Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠF ade Ġin Ġwith Ġa Ġdelay Ġso Ġthat Ġit Ġstarts Ġafter Ġfade Ġout ĊĠĠĠĠĠĠĠĠĠĠĠ ĠfadeIn ( animation Spec Ġ= Ġt ween ( 1 5 0 , Ġdelay Millis Ġ= Ġ 1 5 0 )) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. with ( fadeOut ( animation Spec Ġ= Ġt ween ( 1 5 0 ))) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. using ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠSize Transform Ġ{ Ġinitial Size , Ġtarget Size Ġ-> ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠUsing Ġdifferent ĠSize Transform Ġfor Ġdifferent Ġstate Ġchange ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġif Ġ( Cart State . Collapsed Ġis Transition ing To ĠCart State . Expanded ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġkey frames Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġduration Millis Ġ= Ġ 5 0 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠAn imate Ġto Ġfull Ġtarget Ġwidth Ġand Ġby Ġ 2 0 0 px Ġin Ġheight Ġat Ġ 1 5 0 ms ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠInt Size ( target Size . width , Ġinitial Size . height Ġ+ Ġ 2 0 0 ) Ġat Ġ 1 5 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ġelse Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġkey frames Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġduration Millis Ġ= Ġ 5 0 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠAn imate Ġ 1 / 2 Ġthe Ġheight Ġwithout Ġchanging Ġthe Ġwidth Ġat Ġ 1 5 0 ms . ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠThe Ġwidth Ġand Ġrest Ġof Ġthe Ġheight Ġwill Ġbe Ġanimated Ġin Ġthe ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġtime frame Ġbetween Ġ 1 5 0 ms Ġand Ġduration Ġ( i . e . Ġ 5 0 0 ms ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠInt Size ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġinitial Size . width , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ( initial Size . height Ġ+ Ġtarget Size . height ) Ġ/ Ġ 2 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ) Ġat Ġ 1 5 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ) ĊĠĠĠĠĠĠĠ Ġ} Ċ } Ċ Ċ @ Sample d Ċ @ Composable Ċ @ Opt In ( Experimental Animation Api :: class ) Ċ fun ĠTransition Extension Animated Content Sample () Ġ{ ĊĠĠĠ Ġ@ Composable ĊĠĠĠ Ġfun ĠCol lapsed Cart () Ġ{ Ġ/* ĠSome Ġcontent Ġhere Ġ*/ Ġ} ĊĠĠĠ Ġ@ Composable ĊĠĠĠ Ġfun ĠEx pan ded Cart () Ġ{ Ġ/* ĠSome Ġcontent Ġhere Ġ*/ Ġ} ĊĊĠĠĠ Ġ// Ġenum Ġclass ĠCart State Ġ{ ĠEx pan ded , ĠCol lapsed Ġ} ĊĠĠĠ Ġvar Ġcart State Ġby Ġremember Ġ{ Ġmutable State Of ( Cart State . Collapsed ) Ġ} ĊĠĠĠ Ġ// ĠCreates Ġa Ġtransition Ġhere Ġto Ġanimate Ġthe Ġcorner Ġshape Ġand Ġcontent . ĊĠĠĠ Ġval Ġcart Open Transition Ġ= Ġupdate Transition ( cart State , Ġ" Cart Open Transition ") ĊĠĠĠ Ġval Ġcorner Size Ġby Ġcart Open Transition . animate Dp ( ĊĠĠĠĠĠĠĠ Ġlabel Ġ= Ġ" cart Corner Size ", ĊĠĠĠĠĠĠĠ Ġtransition Spec Ġ= Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġwhen Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠCart State . Expanded Ġis Transition ing To ĠCart State . Collapsed Ġ-> ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġt ween ( duration Millis Ġ= Ġ 4 3 3 , Ġdelay Millis Ġ= Ġ 6 7 ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġelse Ġ-> ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġt ween ( duration Millis Ġ= Ġ 1 5 0 ) ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ) Ġ{ Ġif Ġ( it Ġ== ĠCart State . Expanded ) Ġ 0 . dp Ġelse Ġ 2 4 . dp Ġ} ĊĊĠĠĠ ĠSurface ( ĊĠĠĠĠĠĠĠ ĠModifier . shadow ( 8 . dp , ĠCut Corner Shape ( top Start Ġ= Ġcorner Size )) ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ. clip ( Cut Corner Shape ( top Start Ġ= Ġcorner Size )), ĊĠĠĠĠĠĠĠ Ġcolor Ġ= ĠColor ( 0 xffff f 0 ea ), ĊĠĠĠ Ġ) Ġ{ ĊĠĠĠĠĠĠĠ Ġ// ĠCreates Ġan ĠAnimated Content Ġusing Ġthe Ġtransition . ĠThis ĠAnimated Content Ġwill ĊĠĠĠĠĠĠĠ Ġ// Ġderive Ġits Ġtarget Ġstate Ġfrom Ġcart Open Transition . target State . ĠAll Ġthe Ġanimations ĊĠĠĠĠĠĠĠ Ġ// Ġcreated Ġinside Ġof ĠAnimated Content Ġfor Ġsize Ġchange , Ġenter / exit Ġwill Ġbe Ġadded Ġto Ġthe ĊĠĠĠĠĠĠĠ Ġ// ĠTransition . ĊĠĠĠĠĠĠĠ Ġcart Open Transition . Animated Content ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġtransition Spec Ġ= Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠfadeIn ( animation Spec Ġ= Ġt ween ( 1 5 0 , Ġdelay Millis Ġ= Ġ 1 5 0 )) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. with ( fadeOut ( animation Spec Ġ= Ġt ween ( 1 5 0 ))) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. using ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠSize Transform Ġ{ Ġinitial Size , Ġtarget Size Ġ-> ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠUsing Ġdifferent ĠSize Transform Ġfor Ġdifferent Ġstate Ġchange ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġif Ġ( Cart State . Collapsed Ġis Transition ing To ĠCart State . Expanded ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġkey frames Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġduration Millis Ġ= Ġ 5 0 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠAn imate Ġto Ġfull Ġtarget Ġwidth Ġand Ġby Ġ 2 0 0 px Ġin Ġheight Ġat Ġ 1 5 0 ms ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠInt Size ( target Size . width , Ġinitial Size . height Ġ+ Ġ 2 0 0 ) Ġat Ġ 1 5 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ġelse Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġkey frames Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġduration Millis Ġ= Ġ 5 0 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠAn imate Ġ 1 / 2 Ġthe Ġheight Ġwithout Ġchanging Ġthe Ġwidth Ġat Ġ 1 5 0 ms . ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠThe Ġwidth Ġand Ġrest Ġof Ġthe Ġheight Ġwill Ġbe Ġanimated Ġin Ġthe ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġtime frame Ġbetween Ġ 1 5 0 ms Ġand Ġduration Ġ( i . e . Ġ 5 0 0 ms ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠInt Size ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġinitial Size . width , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ( initial Size . height Ġ+ Ġtarget Size . height ) Ġ/ Ġ 2 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ) Ġat Ġ 1 5 0 ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ). apply Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġtarget Content Z Index Ġ= Ġwhen Ġ( target State ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠThis Ġdefines Ġa Ġrelationship Ġalong Ġz - axis Ġduring Ġthe Ġmoment ary ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġoverlap Ġas Ġboth Ġincoming Ġand Ġoutgoing Ġcontent Ġis Ġon Ġscreen . ĠThis ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġfixed Ġz Order Ġwill Ġensure Ġthat Ġcollapsed Ġcontent Ġwill Ġalways Ġbe Ġon ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġtop Ġof Ġthe Ġexpanded Ġcontent Ġ- Ġit Ġwill Ġcome Ġin Ġon Ġtop , Ġand ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġdis appear Ġover Ġthe Ġexpanded Ġcontent Ġas Ġwell . ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠCart State . Expanded Ġ-> Ġ 1 f ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠCart State . Collapsed Ġ-> Ġ 2 f ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠThis Ġdefines Ġthe Ġmapping Ġfrom Ġstate Ġto Ġcomp osable . ĠIt 's Ġcritical Ġto Ġuse Ġthe Ġstate ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġparameter Ġ( i . e . Ġ` it `) Ġthat Ġis Ġpassed Ġinto Ġthis Ġblock Ġof Ġcode Ġto Ġensure Ġcorrect ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġcontent Ġlookup . ĊĠĠĠĠĠĠĠĠĠĠĠ Ġwhen Ġ( it ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠCart State . Expanded Ġ-> ĠEx pan ded Cart () ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠCart State . Collapsed Ġ-> ĠCol lapsed Cart () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} Ċ } Ċ Ċ @ Suppress (" UNUSED _ VARIABLE ") Ċ @ Sample d Ċ @ Opt In ( Experimental Animation Api :: class ) Ċ @ Composable Ċ fun ĠSlide Into Container Sample () Ġ{ ĊĠĠĠ Ġ// Ġenum Ġclass ĠNested Menu State Ġ{ ĠLevel 1 , ĠLevel 2 , ĠLevel 3 Ġ} ĊĠĠĠ Ġ// ĠThis Ġis Ġan Ġexample Ġof Ġcreating Ġa Ġtransition Spec Ġfor Ġnavig ating Ġin Ġa Ġnested Ġmenu . ĠThe Ġgoal ĊĠĠĠ Ġ// Ġis Ġto Ġ 1 ) Ġestablish Ġa Ġz - order Ġfor Ġdifferent Ġlevels Ġof Ġthe Ġmenu , Ġand Ġ 2 ) Ġimp ly Ġa Ġspatial ĊĠĠĠ Ġ// Ġorder Ġbetween Ġthe Ġmenus Ġvia Ġthe Ġdifferent Ġslide Ġdirection Ġwhen Ġnavig ating Ġto Ġchild Ġmenu Ġvs ĊĠĠĠ Ġ// Ġparent Ġmenu . ĠSee Ġthe Ġde mos Ġdirectory Ġof Ġthe Ġsource Ġcode Ġfor Ġa Ġfull Ġdemo . ĊĠĠĠ Ġval Ġtransition Spec : ĠAnimated Content Scope < Nested Menu State >. () Ġ-> ĠContent Transform Ġ= Ġ{ ĊĠĠĠĠĠĠĠ Ġif Ġ( initialState Ġ< Ġtarget State ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠGo ing Ġfrom Ġparent Ġmenu Ġto Ġchild Ġmenu , Ġslide Ġtowards Ġleft ĊĠĠĠĠĠĠĠĠĠĠĠ Ġslide Into Container ( tow ards Ġ= ĠSlide Direction . Left ) Ġwith ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠSlide Ġthe Ġparent Ġout Ġby Ġ 1 / 2 Ġthe Ġamount Ġrequired Ġto Ġbe Ġcompletely ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġout Ġof Ġthe Ġbounds . ĠThis Ġcreates Ġa Ġsense Ġof Ġchild Ġmenu Ġcatch ing Ġup . ĠSince ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġthe Ġchild Ġmenu Ġhas Ġa Ġhigher Ġz - order , Ġit Ġwill Ġcover Ġthe Ġparent Ġme u Ġas Ġit ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġcomes Ġin . ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġslide OutOf Container ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġtowards Ġ= ĠSlide Direction . Left , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġtarget Offset Ġ= Ġ{ Ġoffset For Full Slide Ġ-> Ġoffset For Full Slide Ġ/ Ġ 2 Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ) ĊĠĠĠĠĠĠĠ Ġ} Ġelse Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠGo ing Ġfrom Ġchild Ġmenu Ġto Ġparent Ġmenu , Ġslide Ġtowards Ġright . ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠSlide Ġparent Ġby Ġhalf Ġamount Ġcompared Ġto Ġchild Ġmenu Ġto Ġcreate Ġan Ġinteresting ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// Ġpar allax Ġvisual Ġeffect . ĊĠĠĠĠĠĠĠĠĠĠĠ Ġslide Into Container ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġtowards Ġ= ĠSlide Direction . Right , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġinitial Offset Ġ= Ġ{ Ġoffset For Full Slide Ġ-> Ġoffset For Full Slide Ġ/ Ġ 2 Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ) Ġwith ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġslide OutOf Container ( tow ards Ġ= ĠSlide Direction . Right ) ĊĠĠĠĠĠĠĠ Ġ}. apply Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// ĠHere Ġwe Ġcan Ġspecify Ġthe Ġz Index Ġfor Ġthe Ġtarget Ġ( i . e . Ġincoming ) Ġcontent . ĊĠĠĠĠĠĠĠĠĠĠĠ Ġtarget Content Z Index Ġ= Ġwhen Ġ( target State ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠNested Menu State . Level 1 Ġ-> Ġ 1 f ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠNested Menu State . Level 2 Ġ-> Ġ 2 f ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠNested Menu State . Level 3 Ġ-> Ġ 3 f ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} Ċ } Ċ Ċ private Ġenum Ġclass ĠCart State Ġ{ ĊĠĠĠ ĠEx pan ded , ĊĠĠĠ ĠCol lapsed Ċ } Ċ Ċ private Ġenum Ġclass ĠNested Menu State Ġ{ ĠLevel 1 , ĠLevel 2 , ĠLevel 3 Ġ} Ċ