20210219 Flutterに入門してみた

Slide 1

Slide 1 text

'MVUUFSʹ ೖ໳ͯ͠Έͨ .PCJMF"DU0/-*/& JUPL!ͦΒ͔ͥ

Slide 2

Slide 2 text

JUPL!ͦΒ͔ͥ w ͍ͱ͏͚͍ʢJUPLʣ w ɹɹɹɹɹɹͷதͷਓ w ϞόΠϧΞϓϦΤϯδχΞ݉$&0 w ෭ۀͰϑϦʔϥϯεత w IUUQTJUPLKQ IUUQTTPSBLB[FDPKQ !JUPLKQ

Slide 3

Slide 3 text

ॴࡏ஍ɿژ౎ࢢதژ۠ ࣾһਓࣗ෼

Slide 4

Slide 4 text

࣮੷ डୗ ࣗࣾ

Slide 5

Slide 5 text

J04"OESPJENBD048JOEPXTαʔό ҰਓͰ΍ͬͯ·͢ʢσβΠϯҎ֎ʣ

Slide 6

Slide 6 text

ݴޠɾϓϥοτϑΥʔϜྺ w ೥ʙɹ0CKFDUJWF$ w ೥ʙɹJ04 w ೥ʙɹ"OESPJE+BWB w ೥ʙɹ4XJGU w ೥ʙɹ,PUMJO w ೥ʙɹ'MVUUFSˡΠϚίίʢೖ໳ͯ͠िؒ΄Ͳ

Slide 7

Slide 7 text

'MVUUFSʹ ೖ໳ͯ͠Έͨ

Slide 8

Slide 8 text

'MVUUFSͱ͸ w (PPHMF੡ϞόΠϧΞϓϦϑϨʔϜϫʔΫʢʙ w J04"OESPJE8FCͷϚϧνϓϥοτϑΥʔϜ w ݴޠ͸%BSU w IUUQTqVUUFSEFW

Slide 9

Slide 9 text

ൺֱ 'MVUUFS 3FBDU/BUJWF 9BNBSJO ݴޠ %BSU +BWF4DSJQU $ "1* ಠࣗ ಠࣗ ಠࣗ XSBQQFS 6* ಠࣗ ωΠςΟϒ ωΠςΟϒ ։ൃ؀ڥ "OESPJE4UVEJP 74$PEF ͳΜͰ΋ 7JTVBM4UVEJP

Slide 10

Slide 10 text

ߏ଄

Slide 11

Slide 11 text

ϚϧνϓϥοτϑΥʔϜ 🤔

Slide 12

Slide 12 text

🤔 w ϚϧνϓϥοτϑΥʔϜͬͯେৎ෉ͳͷʁ w ֶशɾಋೖίετ͸ʁ w ϝϯςφϯε͸ʁ w τʔλϧͰ͸݁ہίετ͕༨ܭʹ͔͔Δͱ͔ʁ

Slide 13

Slide 13 text

ͦΖͦΖࢼͯ͠ΈΔʁ 🤔

Slide 14

Slide 14 text

ͳͥ'MVUUFSʁ w ެ։͞Εͯ਺೥ܦͬͨ͠ɺ҆ఆͯ͠Δ͔΋ w ͳΜ͔·ΘΓͰ͸ྲྀߦ͍ͬͯΔؾ͕͢Δ w ษڧձωλͱͯ͠ࢼͯ͠ΈΔͷ͸Αͦ͞͏ w ॳ৺ऀωλͱͯ͠ษڧձͰൃදͯ͠ɺ͍Ζ͍Ζͱ ڭ͑ͯ΋Β͑ͨΒ͍͍ͳͱ͍͏ελΠϧͰ

Slide 15

Slide 15 text

ͱΓ͋͑ͣ ΞϓϦ࡞ͬͯΈ·ͨ͠

Slide 16

Slide 16 text

؀ڥ w NBD04 w 'MVUUFS w %BSU w "OESPJE4UVEJP w 9DPEF

Slide 17

Slide 17 text

%JBOB

Slide 18

Slide 18 text

%JBOB w Ґஔ৘ใʹج݄ͮ͘ྸදࣔΞϓϦ w ೔ӳ྆ରԠ w ΋ͱ΋ͱJ044XJGU"OESPJE,PUMJOͰ࣮૷ w 'MVUUFSͰϑϧεΫϥον w WϦϦʔεࡁΈ w IUUQTNPPOC[

Slide 19

Slide 19 text

ೖ໳લޙͰ ؾʹͳͬͨ఺ͳͲΛ ྻڍ͍͖ͯ͠·͢

Slide 20

Slide 20 text

'MVUUFSͷجຊ

Slide 21

Slide 21 text

'MVUUFSͷجຊ w એݴܕͷ6* w 8JEHFUͷ֊૚ߏ଄ w ϨΠΞ΢τ΋8JEHFUͱͯ͠૊Έ্͍͛ͯ͘ Widget _buildMoon(...) { return Container( child: AspectRatio( aspectRatio: 1, child: CustomPaint( painter: MoonPainter(...), ), ), ); }

Slide 22

Slide 22 text

8JEHFUT

Slide 23

Slide 23 text

։ൃɾσόοά؀ڥ

Slide 24

Slide 24 text

։ൃɾσόοά؀ڥ w ಋೖ͸؆୯ w 4%,ͷల։ઃஔ w "OESPJE4UVEJPͷϓϥάΠϯಋೖˠ׬ྃ👍 w )PUSFMPBE͋Γ w "OESPJE4UVEJP͔Β௚઀σόοάͰ͖Δ w J04΋"OESPJE΋ͲͪΒ΋

Slide 25

Slide 25 text

$POUJOVPVT *OUFHSBUJPO

Slide 26

Slide 26 text

$POUJOVPVT*OUFHSBUJPO w ஶ໊Ͳ͜Ζ͸͍͍ͩͨରԠ w 'BTUMBOF w #JUSJTF w (JU)VCBDUJPOT

Slide 27

Slide 27 text

ϓϥοτϑΥʔϜ ґଘ෦෼

Slide 28

Slide 28 text

ϓϥοτϑΥʔϜґଘ෦෼ w ֤QBDLBHFͰରԠʢIUUQTQVCEFWʣ w ެࣜɾඇެࣜ͞·͟· w ओཁͳ΋ͷ͸͍͍ͩͨ͋Δ w Ґஔ৘ใɺΧϝϥɺࣸਅϥΠϒϥϦͳͲ

Slide 29

Slide 29 text

ྫʣҐஔ৘ใऔಘ import 'package:location/location.dart'; Future _getLocationData() async { Location location = Location(); bool serviceEnabled = await location.serviceEnabled(); if (!serviceEnabled) { serviceEnabled = await location.requestService(); if (!serviceEnabled) { return null; } } PermissionStatus permissionGranted = await location.hasPermission(); if (permissionGranted == PermissionStatus.denied) { permissionGranted = await location.requestPermission(); if (permissionGranted != PermissionStatus.granted) { return null; } } return await location.getLocation(); }

Slide 30

Slide 30 text

σβΠϯ

Slide 31

Slide 31 text

σβΠϯ w جຊతʹ͸.BUFSJBMσβΠϯ w ϓϥοτϑΥʔϜؒͰڞ௨ w J04෩ͷ$VQFSUJOPXJEHFU܈΋͋Δ w ྆σβΠϯΛ࣮ߦ࣌ʹ੾Γସ͑Δ QBDLBHF΋͋Δ

Slide 32

Slide 32 text

J04෩ 4XJUDI $VQFSUJOP4XJUDI 1MBUGPSN4XJUDI qVUUFS@QMBUGPSN@XJEHFUT

Slide 33

Slide 33 text

λϒϨοτ ʢBEBQUJWFʣ

Slide 34

Slide 34 text

λϒϨοτʢBEBQUJWFʣ w ը໘αΠζΛΈͯࣗલͰௐ੔͢Δඞཁ͋Γ LayoutBuilder( builder: (BuildContext context, BoxConstraints constraints) { if (constraints.maxWidth < constraints.maxHeight) { return _portraitLayout(moonBox, dataTableBox); } else { return _landscapeLayout(moonBox, dataTableBox); } } )

Slide 35

Slide 35 text

μʔΫϞʔυ

Slide 36

Slide 36 text

μʔΫϞʔυ w 5IFNF5IFNF%BUBͰରԠ Widget build(BuildContext context) { return MaterialApp( theme: ThemeData.light(), darkTheme: ThemeData.dark(), ...); }

Slide 37

Slide 37 text

ϩʔΧϥΠζ

Slide 38

Slide 38 text

ϩʔΧϥΠζ w J04"OESPJE྆ରԠՄೳ { "moon": "݄", "newMoon": "৽݄", ... Text(AppLocalizations.of(context).moon) { "moon": "Moon", "@moon": {}, "newMoon": "New", "@newMoon": {}, ...

Slide 39

Slide 39 text

޿ࠂ

Slide 40

Slide 40 text

޿ࠂ w "E.PCͳͲҰ෦ͷ4%,ʹ͍ͭͯ͸QBDLBHF͋Γ

Slide 41

Slide 41 text

·ͱΊ

Slide 42

Slide 42 text

·ͱΊ w ؾʹͳΓϙΠϯτ w ωΠςΟϒ6*ײ͸ബ͍ʢಛʹJ04ʣˡٯʹ04ͷ มߋͰಈ͔ͳ͘ͳΔ͜ͱ͸গͳͦ͏ʁ w 04ಠࣗʢ͋Δ͍͸֎෦4%,ʣͷ৽͍͠"1*Λ͢ ͙ʹ࢖͑ΔΘ͚Ͱ͸ͳ͍

Slide 43

Slide 43 text

·ͱΊ w ͱ͸͍͑ w దࡐదॴͰ͸͋Δ͕։ൃͷબ୒ࢶͱͯ͠͸े෼ʹՄೳ ੑ͋Γ w J04"OESPJEͷ։ൃܦݧ͕͋Δͱͳ͓Αͦ͞͏ w ެࣜυΩϡϝϯτʢIUUQTqVUUFSEFWEPDTʣ͕ॆ ࣮͍ͯ͠Δ͔Β࠷ऴతʹ͸ͦ͜ΛݟΔ΂͠ w qVUUFSͷHPPHMFBCJMJUZ͕ߴ͍ͷ͸ॿ͔Δ ʢ΋͏গ͠୳ٻͯ͠ΈΔ͔΋ʣ