Tweet
Tweet

Slide 1

Slide 1 text

+FUQBDL$PNQPTF৽ػೳ ͋Μ͍͟Ώ͖ !ZBO[N (PPHMF%FWFMPQFS&YQFSUTGPS"OESPJE גࣜձࣾ΢ϑΟΧ

Slide 2

Slide 2 text

+FUQBDL$PNQPTFͱ͸ w ωΠςΟϒ6*ΛϏϧυ͢ΔͨΊͷ"OESPJEͷ࠷৽πʔϧΩοτ w 6*Λએݴతʹهड़Ͱ͖Δ w IUUQTEFWFMPQFSBOESPJEDPNKFUQBDLDPNQPTF Row { Image( painter = painterResource(R.drawable.profile_picture), contentDescription = "Contact profile picture", ) Column { Text(text = message.author) Text(text = message.body) } }

Slide 3

Slide 3 text

+FUQBDL$PNQPTFͷTUBCMFόʔδϣϯ $PNQPTF6*ͳͲ $PNQPTF$PNQJMFS

Slide 4

Slide 4 text

"OJNBUPSEVSBUJPOTDBMF AnimatedVisibility( visible = editable, enter = fadeIn(tween(1000)) ) { Spacer( modifier = Modifier .size(100.dp) .background(Color.Blue) ) }

Slide 5

Slide 5 text

7FDUPS1BJOUFSBVUPNJSSPSJOH w SFNFNCFS7FDUPS1BJOUFS ͰBVUP.JSSPSʹUSVFΛࢦఆ͢Δͱɺ 35-ʢ3JHIUUP-FGUʣϨΠΞ΢τͷͱ͖ʹWFDUPSJNBHFͷද͕ࣔ NJSSPSJOH͞ΕΔ

Slide 6

Slide 6 text

7FDUPS1BJOUFSBVUPNJSSPSJOH w SFNFNCFS7FDUPS1BJOUFS ʹ*NBHF7FDUPSΛࢦఆ͢Δ ৔߹͸ɺ*NBHF7FDUPSͷBVUPNJSSPSઃఆ͕࢖ΘΕΔ w NBUFSJBMJDPOT͸BVUPNJSSPSઃఆ͸GBMTFʹͳ͍ͬͯ ΔͷͰ35-ϨΠΞ΢τͰ΋൓స͠ͳ͍ Image( painter = rememberVectorPainter(image = Icons.Default.Refresh), contentDescription = null, modifier = Modifier.size(128.dp) )

Slide 7

Slide 7 text

w SFNFNCFS7FDUPS1BJOUFS ͰWFDUPSͷDPOUFOUΛࢦఆ͢Δ৔߹ɺ BVUP.JSSPSΛઃఆͰ͖Δ Image( painter = rememberVectorPainter( defaultWidth = 128.dp, defaultHeight = 128.dp, autoMirror = true, ) { viewportWidth, viewportHeight -> Path( pathData = PathData { lineTo(viewportWidth, 0f) lineTo(0f, viewportHeight) close() }, fill = SolidColor(Color.Black) ) }, contentDescription = null, modifier = Modifier.size(128.dp).padding(16.dp) )

Slide 8

Slide 8 text

w SFNFNCFS"OJNBUFE7FDUPS1BJOUFS Ͱ͸BVUPNJSSPS͕USVFʹͳΔ var atEnd by remember { mutableStateOf(false) } Image( painter = rememberAnimatedVectorPainter( AnimatedImageVector.animatedVectorResource( R.drawable.animated_vector ), atEnd = atEnd ), contentDescription = null, modifier = Modifier .size(128.dp) .clickable { atEnd = !atEnd } )

Slide 9

Slide 9 text

/FXFBTJOH w &BTFɺ&BTF0VUɺ&BTF*Oɺ&BTF*O0VUɺ w &BTF*O4JOFɺ&BTF0VU4JOFɺ&BTF*O0VU4JOF w &BTF*O$VCJDɺ&BTF0VU$VCJDɺ&BTF*O0VU$VCJD w &BTF*O2VJOUɺ&BTF0VU2VJOUɺ&BTF*O0VU2VJOU w &BTF*O$JSDɺ&BTF0VU$JSDɺ&BTF*O0VU$JSD w &BTF*O2VBEɺ&BTF0VU2VBEɺ&BTF*O0VU2VBE w &BTF*O2VBSUɺ&BTF0VU2VBSUɺ&BTF*O0VU2VBSU w &BTF*O&YQPɺ&BTF0VU&YQPɺ&BTF*O0VU&YQP w &BTF*O#BDLɺ&BTF0VU#BDLɺ&BTF*O0VU#BDL w &BTF*O&MBTUJDɺ&BTF0VU&MBTUJDɺ&BTF*O0VU&MBTUJD w &BTF0VU#PVODFɺ&BTF*O#PVODFɺ&BTF*O0VU#PVODF &BTJOH'VODUJPOTLU

Slide 10

Slide 10 text

-B[Z-JTUͷVTFS4DSPMM&OBCMFEύϥϝʔλ w VTFS4DSPMM&OBCMFEʹGBMTFΛࢦఆ͢ΔͱδΣενϟʔͰεΫϩʔϧ͞Εͳ ͘ͳΔ w ಺෦Ͱ͸.PEJpFSTDSPMMBCMFͷFOBCMFEΛར༻ LazyColumn( userScrollEnabled = checked, modifier = Modifier.fillMaxSize() ) { … }

Slide 11

Slide 11 text

.BHOJGJFS8JEHFU w 4FMFDUJPO$POUBJOFS಺Ͱબ୒ϋϯυϧΛυϥοά͍ͯ͠Δͱ͖ʹ֦େද͕ࣔ ͰΔΑ͏ʹͳͬͨ

Slide 12

Slide 12 text

.PEJGJFSTZTUFN(FTUVSF&YDMVTJPO w .PEJpFSTZTUFN(FTUVSF&YDMVTJPO ͰγεςϜδΣενϟʔ͔Βআ͘ྖҬ ͱͯ͠ࢦఆͰ͖Δ Spacer( modifier = Modifier.size(128.dp).background(Color.Blue) .systemGestureExclusion() ) Spacer( modifier = Modifier.size(128.dp).background(Color.Red) .systemGestureExclusion { Rect( offset = Offset.Zero, size = Size( width = it.size.width.toFloat(), height = it.size.height / 2f ) ) } )

Slide 13

Slide 13 text

-B[ZMJTUܥͷJUFNͷDPOUFOU5ZQF w -B[Z$PMVNOɺ-B[Z3PXɺ-B[Z7FSUJDBM(SJEͷJUFNʹDPOUFOUUZQFΛࢦ ఆͰ͖ΔΑ͏ʹͳͬͨ w DPOUFOUUZQF͝ͱʹ࠷େݸ·ͰDPNQPOFOU͕࠶ར༻ͷͨΊʹ࢒Δ LazyColumn { items( count = 100, contentType = { if (it % 2 == 0) "Button" else "Text" } ) { if (it % 2 == 0) { Button(…) { … } } else { Text(…) } } }

Slide 14

Slide 14 text

%PXOMPBEBCMF'POUʢBTZODGPOUMPBEJOHʣ w (PPHMFGPOUΛ࢖͏৔߹͸lBOESPJEYDPNQPTFVJVJUFYUHPPHMFGPOUT DPNQPTF@WFSTJPO͕ඞཁ Text( text = "Hello Android", fontSize = 30.sp, fontFamily = FontFamily( androidx.compose.ui.text.googlefonts.Font( googleFont = GoogleFont("Asset"), fontProvider = GoogleFont.Provider( providerAuthority = "com.google.android.gms.fonts", providerPackage = "com.google.android.gms", certificates = R.array.com_google_android_gms_fonts_certs, ) ) ) )

Slide 15

Slide 15 text

-B[Z-BZPVU w -B[Z$PMVNO΍-B[Z3PXͷϕʔεػೳ͕ -B[Z-BZPVUDPNQPTBCMFͱͯ͠·ͱΊΒΕͨ w ಠࣗͷ഑ஔͷ-B[ZMJTUΛ࡞Δ͜ͱ͕Մೳʹ

Slide 16

Slide 16 text

5FYU4UZMFɺ4QBO4UZMFͷ#SVTIରԠ Text( "Brush is awesome\nBrush is awesome\nBrush is awesome", style = TextStyle( brush = Brush.linearGradient( colors = listOf( Color(0xff9c4f96), Color(0xffff6355), Color(0xfffba949), Color(0xfffae442), Color(0xff8bd448), Color(0xff2aa8f2) ), tileMode = TileMode.Mirror ), fontSize = 30.sp ) )

Slide 17

Slide 17 text

$IJQɺ'JMUFS$IJQDPNQPTBCMF Chip(onClick = { … }) { Text("Android") } var selected by remember { mutableStateOf(false) } FilterChip( selected = selected, selectedIcon = { if (selected) { Icon( imageVector = Icons.Default.Check, contentDescription = null ) } }, onClick = { selected = !selected }, ) { Text("Android") }

Slide 18

Slide 18 text

5FYU'JFME%FDPSBUJPO#PYɺ0VUMJOFE5FYU'JFME%FDPSBUJPO#PY w ಠࣗͷݟͨ໨ͷೖྗϑΥʔϜΛ࡞Δʹ͸ #BTJD5FYU'JFMEΛ࢖͏ BasicTextField( value = value, onValueChange = { value = it }, decorationBox = { Box( modifier = Modifier .background( Color.Blue.copy(alpha = 0.1f), MaterialTheme.shapes.medium ) .padding(16.dp) ) { it() } } )

Slide 19

Slide 19 text

BasicTextField( … decorationBox = { TextFieldDefaults.TextFieldDecorationBox( value = value, innerTextField = it, enabled = true, singleLine = true, visualTransformation = visualTransformation, interactionSource = interactionSource, placeholder = { Text("hint") } ) }, modifier = Modifier .background( Color.Blue.copy(alpha = 0.1f), MaterialTheme.shapes.medium ) .defaultMinSize( minWidth = TextFieldDefaults.MinWidth, minHeight = TextFieldDefaults.MinHeight ) )

Slide 20

Slide 20 text

NPWBCMF$POUFOU0G w DPNQPTBCMFMBNCEBΛSFNFNCFS͢Δ͜ͱͰɺ DPNQPTFUSFFͷதͰ৔ॴ͕มΘͬͯ΋࠶ίϯϙ δγϣϯ͞Εͳ͍͘͠Έ w Ͱ௥Ճ͞ΕΔ-PPLBIFBE-BZPVUͱ૊Έ߹ ΘͤΔͱ4IBSFEUSBOTJUJPO͕ՄೳʹͳΔ CFUB

Slide 21

Slide 21 text

QMVSBM4USJOH3FTPVSDF %1$d count %1$d counts Text(text = pluralStringResource(R.plurals.item_count, count = 1)) Text(text = pluralStringResource(R.plurals.item_count, count = 10))

Slide 22

Slide 22 text

8JOEPX*OTFUT w ͍··Ͱ͸"DDPNQBOJTUͷJOTFUTϥΠϒϥϦΛ࢖͏ͷ͕σϑΝΫτͩͬͨ ͕ɺಉ౳ͷػೳ͕ຊମʹऔΓࠐ·Εͨ w "DDPNQBOJTUͷJOTFUTϥΠϒϥϦ͸EFQSFDBUFE w .JHSBUJPOHVJEFIUUQTHPPHMFHJUIVCJPBDDPNQBOJTUJOTFUT

Slide 23

Slide 23 text

8JOEPX*OTFUTΛQBEEJOHͱͯ͠औಘ͢Δ 8JOEPX*OTFUTΛXJEUIIFJHIUͱͯ͠औಘ͢Δ val paddingValue: PaddingValues = WindowInsets.statusBars.asPaddingValues() val modifier1 = Modifier.statusBarsPadding() val modifier2 = Modifier.windowInsetsPadding(WindowInsets.statusBars) val modifier3 = Modifier.windowInsetsBottomHeight(WindowInsets.safeDrawing) val modifier4 = Modifier.windowInsetsEndWidth(WindowInsets.navigationBars)

Slide 24

Slide 24 text

8JOEPX*OTFUTΛՃ޻͢Δ val insets1: WindowInsets = WindowInsets.safeDrawing.add(WindowInsets(bottom = 24.dp)) val insets2: WindowInsets = WindowInsets.systemBars.only( WindowInsetsSides.Horizontal + WindowInsetsSides.Bottom ) val insets3: WindowInsets = WindowInsets.systemBars.exclude(WindowInsets.statusBars) val insets4: WindowInsets = WindowInsets.navigationBars.union(WindowInsets.ime)

Slide 25

Slide 25 text

όάमਖ਼ w $+,ΩʔϘʔυͰόοΫεϖʔε ௕ԡ͠ͰจࣈΛ࿈ଓফڈͰ͖ΔΑ ͏ʹͳͬͨ w UFYUpFMEؒΛϑΥʔΧε͕Ҡಈ͢ Δͱ͖ʹTPGULFZCPBSEJOQVU UZQF͕Ұॠ੾ΓସΘΔڍಈ͕ͳ͘ ͳͬͨ

Slide 26

Slide 26 text

'PDVTॲཧվળ w .PEJpFSGPDVT(SPVQ w -B[Z$PMVNOɺ-B[Z3PXͰGPDVTҠ ಈʹΑΔεΫϩʔϧʹରԠ w ϑΥʔΧε͞Ε͍ͯΔ5FYU'JFME͕ද ࣔ͞ΕΔΑ͏ʹࣗಈͰεΫϩʔϧ

Slide 27

Slide 27 text

·ͱΊ w $PNQPTFͰ͍Ζ͍Ζվળ͠·ͨ͠ w -B[Z-JTUؔ܎ w 8JOEPX*OTFUT w ೖྗϑΥʔϜɺϑΥʔΧεपΓ w ·ͩ+FUQBDL$PNQPTFΛಋೖ͍ͯ͠ͳ͍ͳΒɺͥͻಋೖ͍ͯͩ͘͠͞ w طଘͷϨΠΞ΢τʢ7JFXɺϨΠΞ΢τ9.-ʣͱҰॹʹ࢖͑·͢