Flutter研修【ミクシィ22新卒技術研修】

by MIXI ENGINEERS

Slide 1

Slide 1 text

'MVUUFS৽ଔݚम -9&OHJOFFS,VOP"ZBOB

Slide 2

Slide 2 text

ߨࢣνϡʔλʔ ٱ໺จࡊ !BZBOBLVOP ৽ଔ -9ࣄۀ෦ϑϩϯτνʔϜ υϥ͑΋ΜϏοάϥϒ ా୅༞ี !ZVTVLFUBTIJSP ೥ೖࣾ -9ࣄۀ෦ϑϩϯτνʔϜ Ξ΢τυΞͱ4UFBNͰήʔϜ΍Δͷ͕޷͖

Slide 3

Slide 3 text

͓඼ॻ͖ ʙ'MVUUFSͱ͸ ʙ'MVUUFSDSFBUFͰΞϓϦΛ࡞ͬͯΈΑ͏ ʙٳܜ ʙDSFBUF͞ΕͨΞϓϦΛݟ͍ͯ͜͏ *OUSPEVDUJPO 4UBUF ʙϥϯν 5FYU'JFME ը໘ભҠ ʙ(SBQI2-äͱ͸ʁ ʙ(SBQI2-Λ৮ͬͯΈΑ͏ (SBQI2-2VFSZ (SBQI2-.VUBUJPO ʙνʔϜͰνϟϨϯδʂ8PSEMFΛ࡞ͬͯΈΑ͏ʂ ʙΫϩʔδϯά

Slide 4

Slide 4 text

ࣄલ४උ J04ಈ͔͍ͨ͠ਓɹ "OESPJEಈ͔͍ͨ͠ਓɹ w 9DPEFͷΠϯετʔϧ͓Αͼղౚ w Πϯετʔϧ͸"QQ4UPSFͰ͸ͳ͘EFWFMPQFSαΠτ͔Βམͱͯ͘͠Δ͜ͱΛ͓קΊ w IUUQTEFWFMPQFSBQQMFDPNEPXOMPBENPSF w ࣄલʹ"QQMF*%͕ඞཁ w ձࣾͷϝʔϧΞυϨεͰΞΧ΢ϯτΛ࡞੒ w "OESPJE4UVEJPͷΠϯετʔϧ͓Αͼղౚ w Ұ୴ىಈ͠ͳ͍ͱ fl VUUFSEPDUPSͨ͠ͱ͖ʹ6OBCMFUPMPDBUF"OESPJE4%,ͷΤϥʔʹͳΔ

Slide 5

Slide 5 text

ݚमͷΰʔϧ

Slide 6

Slide 6 text

ݚमͷΰʔϧ 'MVUUFSΛָ͠΋͏ʂʂ

Slide 7

Slide 7 text

'MVUUFSͱ͸

Slide 8

Slide 8 text

'MVUUFSͱ͸ w ϚϧνϓϥοτϑΥʔϜ։ൃ͕ՄೳͳϑϨʔϜϫʔΫ w ϞόΠϧɾXFCɾσεΫτοϓͷΞϓϦ͕ͭͷίʔυͰ࡞ΕΔʂ w 50:05"͕ຒΊࠐΈػثʹ౥ࡌ͢Διϑτ΢ΣΞͷϑϨʔϜϫʔΫͱͯ͠࠾༻ w IUUQT fl VUUFSEFWTIPXDBTFUPZPUB

Slide 9

Slide 9 text

'MVUUFSͱ͸ w (PPHMF͕ຊؾΛग़ͯ͠࡞ͬͯΔ w (PPHMFͷΞϓϦʢ(PPHMF"ET΍(PPHMF"TTJTUBOUͳͲʣͰ΋ར༻͞ΕͯΔ w ϚςϦΞϧσβΠϯͷίϯϙʔωϯτΛ"OESPJEΑΓઌʹ࣮૷ͯͨ͠Γ͢Δ w IUUQTNBUFSJBMJPDPNQPOFOUT w ίϯϙʔωϯτΛඪ४Ͱ༻ҙͯ͘͠ΕͯΔ͔Βॳ৺ऀͰ΋ྑ͍ײ͡ʹ࡞ΕΔʂ

Slide 10

Slide 10 text

w %BSUͱ͍͏ݴޠͰ࣮૷͢Δ w (PPHMF͕+BWB4DSJQUͷ໰୊఺Λվળͨ͠୅ସݴޠͱͯ͠೥ʹ։ൃ͞Εͨ΋ͷ w %BSUͰ/VMM4BGFUZʹͳͬͨʢผϖʔδͰઆ໌ʣ w Τϯδϯ΋ϨϯμϦϯά΋શ෦ࣗલͳͷͰ଎͍ʂ w એݴత6*Ͱॻ͘͜ͱ͕ՄೳʢผϖʔδͰઆ໌ʣ w 4XJGUͳͲͷωΠςΟϒίʔυΑΓ3FBDUͷํ͕ࣅͯΔ 'MVUUFSͱ͸

Slide 11

Slide 11 text

/VMM4BGFUZͬͯʁ B΋C΋OVMMΛ୅ೖͰ͖Δ ͲͷܕͰ΋OVMMΛ࢖ͬͯྑ͍ C͸OVMM΍ͳ͍͔ʙʂ ࣮ߦ࣌ʹOVMMͩͬͨ৔߹ ΤϥʔΛు͘ɾΞϓϦ͕མͪΔ int a = 100; int b = null; a = null; print(a + b); EBSUY΍/VMM4BGFUZ͡Όͳ͍ݴޠͷ৔߹

Slide 12

Slide 12 text

࣮ߦ࣌ʹOVMMͷΤϥʔͰ མͪΔ͜ͱ͸ͳ͘ͳΔ ʢEBSUYͷ৔߹͸ίϯύΠϧ࣌ʹΤϥʔʹͳΔʣ /VMM4BGFUZͬͯʁ BʹOVMM͸୅ೖͰ͖ͳ͍ جຊOVMMΛड͚෇͚ͳ͍ͷͰ ࢖͍͍ͨ࣌͸ Λ͚ͭΔ int a = 100; int? b = null; a = null; // Τϥʔ print(a + b); // Τϥʔ if (b != null) { print(a + b); } print(a + (b ?? 0)); C͕OVMMͷ࣌͸ආ͚ ͯ͘ΕΔͷͰ҆৺ EBSU΍/VMM4BGFUZͳݴޠͷ৔߹

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Slide 15

Slide 15 text

Slide 16

Slide 16 text

label = UILabel() label.text = “Babu~” label.textColor = .black label.textAlignment = .center view.addSubview(label) Text( “Babu~", style: TextStyle(color: Colors.black), textAlign: TextAlign.center, ), ໋ྩతʢ4XJGUʣ એݴత6*ͬͯʁ એݴతʢ%BSUʣ ϥϕϧΛ࡞Εʂ ϥϕϧͷςΩετ͸όϒʙͰ͋Εʂ ৭͸ࠇͰ͋ΕʂਅΜதدͤͰ͋Εʂ ͦͷϥϕϧΛ7JFXʹ௥Ճͤ͑ʂ

Slide 17

Slide 17 text

label = UILabel() label.text = “Babu~” label.textColor = .black label.textAlignment = .center view.addSubview(label) Text( “Babu~", style: TextStyle(color: Colors.black), textAlign: TextAlign.center, ), ໋ྩతʢ4XJGUʣ એݴత6*ͬͯʁ એݴతʢ%BSUʣ զ͸όϒʙͱ͍͏ࠇ৭ͷ ਅΜதدͤςΩετͰ͋Δʂ

Slide 18

Slide 18 text

'MVUUFSDSFBUFͰ ΞϓϦΛ࡞ͬͯΈΑ͏

Slide 19

Slide 19 text

ΞϓϦΛ࡞ͬͯΈΑ͏ $ flutter create <<ϓϩδΣΫτͷ໊લ>> $ cd <<ϓϩδΣΫτͷ໊લ>> $ open iOS/Runner.xcworkspace // ios ͷਓͷΈ $ flutter run "OESPJEͷਓ͸࣮ػબ୒΋͘͠͸ "OESPJEελδΦ্ཱͪ͛ͯΤϛϡબ୒ ϓϩδΣΫτ໊͸ΞϯμόʔͰܨ͕ͳ͍ͱ ʰzϓϩδΣΫτ໊zJTOPUBWBMJE%BSUQBDLBHFOBNFʱ ͬͯΤϥʔుౖ͍ͯΒΕΔ

Slide 20

Slide 20 text

J04೿ͷਓ ࣄલ४උͰ࡞ͬͨ ΞΧ΢ϯτʹͳ͍ͬͯΔ͔ʁ

Slide 21

Slide 21 text

J04೿ͷਓ ࣮ػ઀ଓͯͨ͠ΒJ04%FWJDFͷͱ͜Ζʹ ͜Μͳ෩ʹग़ͯ͘Δ͸ͣ γϛϡϨʔλಈ͔͢ਓ͸ ޷͖ͳ΍ͭΛબΜͰͶʂ ࣍ճ͔Β͸ԼهίϚϯυͰ্ཱ͕ͪΔΑ $ open -a simulator

Slide 22

Slide 22 text

J04೿ͷਓʢ࣮ػʣ ઃఆҰൠ71/ͱσόΠε؅ཧ ͷڐՄ͕߱ΓͯΔ͔֬ೝʂ

Slide 23

Slide 23 text

"OESPJE೿ͷਓ "OESPJE4UVEJPΛ্ཱͪ͛ͯ "7%.BOBHFSΛબ୒ ΋͘͠͸࣮ػ઀ଓͯ͠ $ flutter run ޷͖ͳΤϛϡϨʔλΛ ▶︎ Λԡͯ͠ىಈ

Slide 24

Slide 24 text

ಈ͍͔ͨͳʁ ϘλϯΛԡ͢ͱ ਅΜதͷ਺ࣈ͕Χ΢ϯτΞοϓ͞Ε͍ͯ͘ΞϓϦ

Slide 25

Slide 25 text

෼ؒٳܜ

Slide 26

Slide 26 text

DSFBUF͞ΕͨΞϓϦΛ ݟ͍ͯ͜͏ʂ

Slide 27

Slide 27 text

΢ΟδΣοτ ϖʔδશମ

Slide 28

Slide 28 text

΢ΟδΣοτ ϖʔδશମ "QQ#BS

Slide 29

Slide 29 text

΢ΟδΣοτ ϖʔδશମ "QQ#BS ςΩετ

Slide 30

Slide 30 text

΢ΟδΣοτ ϖʔδશମ "QQ#BS ςΩετ Ϙλϯ

Slide 31

Slide 31 text

΢ΟδΣοτ ϖʔδશମ "QQ#BS ςΩετ Ϙλϯ શ෦΢ΟδΣοτʂ ը໘͸΢ΟδΣοτͰ੒Γཱ͍ͬͯΔʂ

Slide 32

Slide 32 text

࣮ࡍͷίʔυΛݟ͍ͯ͜͏ʂ w ϥΠϒίʔσΟϯά͍ͯ͘͠ͷͰҰॹʹΞϓϦΛಈ͔͍ͯ͜͠͏ʂ w ͨ·ʹղઆͰεϥΠυʹ໭͖ͬͯ·͢ w ηΫγϣϯ͝ͱʹղઆͨ͠ޙ෼΄ͲҰਓͰղ࣌ؒ͘ΛऔΔͷͰؤுͬͯΈ͍ͯͩ͘͞ʂ w ҰԠϦϙδτϦʹίʔυΛஔ͍ͯ͋Γ·͢ w IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMMT w 13͝ͱʹઆ໌͍͖ͯ͠·͢ w ίϛοτϝοηʔδ΍ίʔυ಺ίϝϯτ͕આ໌ʹͳ͍ͬͯ·͢

Slide 33

Slide 33 text

74$PEFͷਓʙʂ ֦ுػೳೖΕ͓ͯ͘ͱΊͪΌͪ͘ΌศརͰ͢ ʰ fl VUUFSʱͰݕࡧͯ͠Ұ൪্ʹग़Δ΍ͭ

Slide 34

Slide 34 text

*OUSPEVDUJPO IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM w ϓϩδΣΫτʢσΟϨΫτϦʣߏ੒ʹ͍ͭͯ w NBJO ͷྲྀΕ΍DMBTTͷઆ໌ w 5FYUͷத਎Λม͑ͯΈͨΓ͢Δ w )PU3FMPBE3FTUBSUͱ͸ʁʢผϖʔδͰઆ໌ʣ w .Z)PNF1BHFͷϑΝΠϧ෼͚ͯΈΔ w ଞͷϑΝΠϧΛࢀর͢Δͱ͖͸JNQPSU͢Δ w .Z)PNF1BHFݟͯ͘ w 4DB ff PMEͱ͔DPMVNOͳͲඪ४΢ΟδΣοτ͕ͨ͘͞ΜʂʢผϖʔδͰઆ໌ʣ w ֦ுػೳ͸͜͏࢖͏ʂʢผϖʔδͰઆ໌ʣ

Slide 35

Slide 35 text

)PU3FMPBE3FTUBSUͱ͸ʁ )PUSFMPBE )PUSFTUBSU ͍͍ͪͪDUSMD͔Βͷ fl VUUFSSVO͠ͳͯ͘େৎ෉ʂʂʂʂ λʔϛφϧͰ3Λԡ͢ ΄΅Ϧηοτ͞ΕΔ λʔϛφϧͰSΛԡ͢ 5FYU΍৭ͳͲ΢ΟδΣοτΛ มߋͨ͠Β൓ө͞ΕΔ 4UBUF͸ͦͷ·· ʢ4UBUFʹؔͯ͠͸ޙͰઆ໌ʣ fl VUUFSSVO ωΠςΟϒίʔυ͔Β ࣮ߦ͠௚͢

Slide 36

Slide 36 text

ඪ४΢ΟδΣοτ IUUQTEPDT fl VUUFSEFWEFWFMPQNFOUVJXJEHFUT Α͘࢖͏΢ΟδΣοτ͕ ༻ҙ͞ΕͯΔʂ

Slide 37

Slide 37 text

֦ுػೳ͸͜͏࢖͏ʂ Կ͔Ͱғ͍͍ͨ ΢ΟδΣοτΛӈΫϦοΫ ϦϑΝΫλΛબ୒ ғ͍͍ͨ΢ΟδΣοτΛબ୒ σσϯʂғΘΕͨʂ

Slide 38

Slide 38 text

5SZϚε໨Λදࣔͯ͠ΈΑ͏ w Ϛε໨Λදࣔͯ͠ΈΑ͏ w ྫ͸ºͰ͕͢ԿݸͰ΋ɾԿ৭Ͱ΋0,ʂ ෼ʂ

Slide 39

Slide 39 text

5SZϚε໨Λදࣔͯ͠ΈΑ͏ղઆ w 3PX΍$PMVNOͰͭͷ࢛֯ΛॏͶΕ͹0,ʂ GridView.count( crossAxisCount: 3, children: [ for (var i = 0; i < 9; i++) const Padding( padding: EdgeInsets.all(8.0), child: ColoredBox( color: Colors.amber, ), ), ], ), (SJE7JFXΛ࢖ͬͯ΋ ඳ͚·͢ʂ

Slide 40

Slide 40 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w (SJE7JFX΋޿͕Ζ͏ͱͯ͘͠Δੑ࣭Λ࣋ͭͷͰΤϥʔʹͳΓ·͢ 5IFGPMMPXJOH3FOEFS0CKFDUXBTCFJOHQSPDFTTFEXIFOUIFFYDFQUJPOXBT fi SFE 3FOEFS7JFXQPSUCEEF/&&%4-":065 /&&%41"*/5/&&%4$0.104*5*/(#*5461%"5& OFFETDPNQPTJUJOH DSFBUPS7JFXQPSUˡ*HOPSF1PJOUFS<(MPCBM,FZCC>ˡ4FNBOUJDTˡ-JTUFOFSˡ @(FTUVSF4FNBOUJDTˡ 3BX(FTUVSF%FUFDUPS<-BCFMFE(MPCBM,FZ3BX(FTUVSF%FUFDUPS4UBUF>ˡ-JTUFOFSˡ @4DSPMMBCMF4DPQF ˡ@4DSPMM4FNBOUJDT<(MPCBM,FZFGC>ˡ/PUJ fi DBUJPO-JTUFOFS4DSPMM.FUSJDT/PUJ fi DBUJPOˡ 4DSPMMBCMFˡ1SJNBSZ4DSPMM$POUSPMMFSˡl QBSFOU%BUBOPOF DBOVTFTJ[F DPOTUSBJOUT#PY$POTUSBJOUT X I*O fi OJUZ MBZFS0 ff TFU-BZFSGF%&5"$)&% ɽɽɽ

Slide 41

Slide 41 text

$PMVNO΍3PX͸਌ͷαΠζ·Ͱ޿͕Δੑ࣭Λ࣋ͭ $PMVNO 3PX mainAxisSize:MainAxisSize.min, Λࢦఆͯ͋͛͠Δͱ ࢠཁૉ͕ऩ·Δେ͖͞ʹཹ·Δʂ

Slide 42

Slide 42 text

Slide 43

Slide 43 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w (SJE7JFX΋޿͕Ζ͏ͱͯ͘͠Δੑ࣭Λ࣋ͭͷͰΤϥʔʹͳΓ·͢ $PMVNO

Slide 44

Slide 44 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w (SJE7JFX΋޿͕Ζ͏ͱͯ͘͠Δੑ࣭Λ࣋ͭͷͰΤϥʔʹͳΓ·͢ $PMVNO

Slide 45

Slide 45 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w (SJE7JFX΋޿͕Ζ͏ͱͯ͘͠Δੑ࣭Λ࣋ͭͷͰΤϥʔʹͳΓ·͢ $PMVNO (SJE7JFX

Slide 46

Slide 46 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w (SJE7JFX΋޿͕Ζ͏ͱͯ͘͠Δੑ࣭Λ࣋ͭͷͰΤϥʔʹͳΓ·͢ $PMVNO (SJE7JFX

Slide 47

Slide 47 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w (SJE7JFX΋޿͕Ζ͏ͱͯ͘͠Δੑ࣭Λ࣋ͭͷͰΤϥʔʹͳΓ·͢ $PMVNO (SJE7JFX Ͳ͜·Ͱ޿͕ΔΜʁʁʁ

Slide 48

Slide 48 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w ղܾࡦʢ͜͜Ͱղઆʣ ᶃ (SJE7JFXͷߴ͞Λݻఆ͢Δ ᶄ &YQBOEFEͱ͍͏8JEHFUΛ࢖͏ ᶅ (SJE7JFXʹɹɹɹɹɹɹɹɹɹɹɹΛࢦఆ͢Δ $PMVNO shrinkWrap: true, ߴ͞QYͰʂ (SJE7JFX

Slide 49

Slide 49 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w ղܾࡦʢ͜͜Ͱղઆʣ ᶃ (SJE7JFXͷߴ͞Λݻఆ͢Δ ᶄ &YQBOEFEͱ͍͏8JEHFUͰғ͏ ᶅ (SJE7JFXʹɹɹɹɹɹɹɹɹɹɹɹΛࢦఆ͢Δ $PMVNO (SJE7JFX shrinkWrap: true, $PMVNOͷ༨Γͷ伱ؒ શ෦ຒΊͨΔʂ

Slide 50

Slide 50 text

$PMVNOͷதʹ(SJE7JFXΛೖΕΔͱ͖͸஫ҙʂ w ղܾࡦʢ͜͜Ͱղઆʣ ᶃ (SJE7JFXͷߴ͞Λݻఆ͢Δ ᶄ &YQBOEFEͱ͍͏8JEHFUͰғ͏ ᶅ (SJE7JFXʹɹɹɹɹɹɹɹɹɹɹɹΛࢦఆ͢Δ $PMVNO (SJE7JFX shrinkWrap: true, ࣗ෼ͷେ͖͞ʹཹ·Δ

Slide 51

Slide 51 text

4UBUFͱ4UBUFMFTT8JEHFU4UBUFGVM8JEHFU IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM w Χ΢ϯτΞοϓͯ͠දࣔ͸Ͳ͏΍͍ͬͯΔͷͩΖ͏͔ʁ w ͦ΋ͦ΋4UBUFͬͯͳ͋ʹʁʢผϖʔδͰઆ໌ʣ w 4UBUFGVM8JEHFUͷ঺հ w 4UBUFΛ௥Ճͯ͠ΈΑ͏ w ϚΠφε͍ͯ͘͠Ϙλϯ w -JTU7JFXΛ௥Ճͯ͠ΈΑ͏ w 4UBUF͕มΘΔͨͼʹຖճϨϯμϦϯά૸ͬͯΔʜ w 4UBUF͸খ࣋ͭ͘͞Α͏ʹ͠Α͏ʂ w 4UBUFMFTT8JEHFUͷ঺հ

Slide 52

Slide 52 text

4UBUFͬͯͳ͋ʹʁ w 4UBUFঢ়ଶ w 4UBUF͕มΘΔͱը໘ߋ৽͞ΕΔʢCVJME಺͕࠶࣮ߦ͞ΕΔʣ ͳΜΒ͔ͷΞΫγϣϯ ݁ՌΛඳը ݁ՌΛඳը

Slide 53

Slide 53 text

4UBUFͬͯͳ͋ʹʁ w 4UBUFঢ়ଶ w 4UBUF͕มΘΔͱը໘ߋ৽͞ΕΔʢCVJME಺͕࠶࣮ߦ͞ΕΔʣ ͳΜΒ͔ͷΞΫγϣϯ ݁ՌΛඳը ݁ՌΛඳը 6*G 4UBUF એݴత6*Λந৅Խ͢Δͱ ঢ়ଶΛҾ਺ͱͯ͠6*Λฦ͢ ෭࡞༻Λ࣋ͨͳ͍ؔ਺Ͱ͋Δ

Slide 54

Slide 54 text

w 4UBUFΛ࢖͏΢ΟδΣοτΛ4UBUFGVM8JEHFUͱ͍͏ w ٯʹ࢖Θͳ͍΢ΟδΣοτ͸4UBUFMFTT8JEHFUͱ͍͏ 4UBUFͬͯͳ͋ʹʁ 4UBUFGVM8JEHFU ݁ՌΛඳը ݁ՌΛඳը

Slide 55

Slide 55 text

5SZഒʹ͠Α͏ w 4UBUFΛ৽ͨʹ༻ҙ͠Α͏ w ͦͷ4UBUFΛഒ͍ͯ͘͠ϘλϯΛ௥Ճ͠Α͏ w Կ৭ͰͲΜͳେ͖͞Ͱ΋େৎ෉ʂ ෼ʂ

Slide 56

Slide 56 text

5SZഒʹ͠Α͏ղઆ w ৽͍͠4UBUFΛఆٛ w ഒ͢ΔϝιουΛఆٛ w ഒ͢ΔϝιουΛݺͿϘλϯΛ௥Ճ void _twice() { setState(() { _counter2 = _counter2 * 2; }); } TextButton( onPressed: () { _twice(); },

Slide 57

Slide 57 text

ϥϯν

Slide 58

Slide 58 text

5FYU'JMFEΛ࢖ͬͯΈΑ͏ IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM w ৽͍͠ϖʔδΛ࡞੒ͯͦ͜͠Ͱ5FYU'JMFEΛ࢖ͬͯΈΑ͏ w จࣈଧͭͨͼʹԼʹςΩετදࣔͤ͞Δʹ͸ʁ w 4UBUFʹ͠ͳ͖Ό͍͚ͳ͍Ͷʂ

Slide 59

Slide 59 text

5SZจࣈදࣔϘλϯΛ࡞Ζ͏ w ͖ͬ͞͸จࣈΛଧͭͨͼදࣔͩͬͨ w ϘλϯΛԡͨ͠Βจࣈ͕දࣔ͞ΕΔΑ͏ʹͯ͠ΈΑ͏ʂ ෼ʂ

Slide 60

Slide 60 text

5SZจࣈදࣔϘλϯΛ࡞Ζ͏ w දࣔʹ͸࢖Θͳ͍UNQςΩετʹҰ୴อ࣋͠Α͏ w Ϙλϯԡͨ࣌͠ʹUNQςΩετΛදࣔςΩετʹTFU4UBUF IconButton( onPressed: () { setState(() { showText = tmpText; }); },

Slide 61

Slide 61 text

ը໘ભҠͯ͠ΈΑ͏ IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM w 'JSTU1BHFͱ4FDPOE1BHFΛ࡞੒ w 4DB ff PMEͳ͍ͱ౔୆͕ͳ͍͔ΒมͳදࣔʹͳͬͪΌ͏Αʙ w QVTIͷઆ໌ʢผϖʔδͰઆ໌ʣ w ͋Β͔͡Ί3PVUFొ࿥͓ͯ͘͠ͱศརͩΑʙ w QPQͷઆ໌ʢผϖʔδͰઆ໌ʣ

Slide 62

Slide 62 text

ը໘ભҠ " .BUFSJBM"QQ͕͍࣋ͬͯΔ/BWJHBUPSΛ࢖ͬͯը໘ભҠ͢Δ " # .BUFSJBM1BHF3PVUF Navigator.push( context, MaterialPageRoute( builder: (BuildContext context) => B(), ), ); Navigator.pop(conte

Slide 63

Slide 63 text

Slide 64

Slide 64 text

ը໘ભҠ .BUFSJBM"QQ͕͍࣋ͬͯΔ/BWJHBUPSΛ࢖ͬͯը໘ભҠ͢Δ " # FSJBM1BHF3PVUF ute( ildContext context) => B(), Navigator.pop(context); "

Slide 65

Slide 65 text

Slide 66

Slide 66 text

Slide 67

Slide 67 text

.BUFSJBM"QQʹ͋Β͔͡Ί3PVUFΛొ࿥͓ͯ͜͠͏ʂ return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.pink, ), initialRoute: '/', routes: { '/': (BuildContext context) => const FirstPage(), '/second': (BuildContext context) => const SecondPage(), }, ); ͜ΕͰݺ΂ΔΑ͏ʹͳΔʂ Navigator.pushNamed(context, "/second");

Slide 68

Slide 68 text

(SBQI2-ͬͯͳΜͩʂ

Slide 69

Slide 69 text

(SBQI2-ͱ͸ w ΫϥΠΞϯτ͕ཁٻͨ͠σʔλΛఏڙ͢Δ΋ͷ w .FUBʢچ'BDFCPPLʣ͕࡞ͬͨ ͋͛Δ΍Ͱ Ϣʔβͷσʔλ ͪΐ͏͍ͩ ΫϥΠΞϯτ (SBQI2-

Slide 70

Slide 70 text

(SBQI2-ͱ3&45ͷൺֱ 3&45 (SBQI2- VTFST DPNQBOJFT TUPSFT VTFST DPNQBOJFT TUPSFT औಘ͍ͨ͠΋ͷ͝ͱʹ ΤϯυϙΠϯτ͕Θ͔ΕͯΔ ΤϯυϙΠϯτ͸ͭ

Slide 71

Slide 71 text

(SBQI2-ͱ3&45ͷൺֱ 3&45 (SBQI2- User: { “Name” : “kuno”, “Company” : “mixi”, “Sex” : “f”, “Web” : “kunoayana.com”, } query getUser(userId: userId) { User { name company } } (&5BQJVTFST\VTFS*E^ ໊લͱձ໊͚ࣾͩ ཉ͍͠ͷʹ͜ͷ"1*ͩͱଞͷ৘ใ·Ͱ Ҿͬு͖ͬͯͪΌ͏ʜ ࠓඞཁͳσʔλ͚ͩ औಘͰ͖Δʂ

Slide 72

Slide 72 text

2VFSZͱ.VUBUJPO 2VFSZ .VUBUJPO Ϣʔβͷσʔλཉ͍͠ ͋͛Δ΍Ͱ Ϣʔβͷσʔλ ௥Ճɾߋ৽ɾ࡟আ͍ͨ͠ ঝ஌ มߋޙͷσʔλ΋͋͛ΔΘ

Slide 73

Slide 73 text

(SBQIJ2- IUUQTTFSFOFHBSEFOIFSPLVBQQDPN

Slide 74

Slide 74 text

w (SBQI2-Λ'MVUUFSͰ࢖͏ͨΊͷϥΠϒϥϦΛೖΕΑ͏ w λʔϛφϧͰ w IUUQTQVCEFWQBDLBHFTHSBQIRM w ·ͣ2VFSZݺͿͨΊͷϝιουΛੜ΍ͦ͏ w ϝιουͷதͰ2VFSZΛݺΜͰΈΑ͏ʂ w 3FBENFͷίϐϖͰେৎ෉ʂ w ϢʔβҰཡΫΤϦͰड͚औͬͨσʔλΛදࣔͯ͠ΈΑ͏ʂ w ωοτϫʔΫ͸EFWUPPMͰݟΕΔʂʢผϖʔδͰઆ໌ʣ (SBQI2-2VFSZΛ࢖ͬͯΈΑ͏ʂ fl VUUFSQVCBEEHSBQIRM

Slide 75

Slide 75 text

EFWUPPMͱ͸ʁ λʔϛφϧͰWΛԡ͢ͱϒϥ΢βͰ։͘ ˞ͣͬͱ͙Δ͙Δͯ͠දࣔ͞Εͳ͍ͱ͖͸Ұ୴QBVTF͔ͯ͠ΒSFTVNFͰ࠶։ͯ͠ΈΑ͏ʂ /FUXPSLλϒ ݟΔͱͲΜͳ௨৴͕ ߦΘΕͯΔ͔෼͔Δ

Slide 76

Slide 76 text

w ࣍͸.VUBUJPOݺͿͨΊͷϝιουΛੜ΍ͦ͏ w ϝιουͷதͰ.VUBUJPOΛݺΜͰΈΑ͏ʂ w 3FBENFͷίϐϖͰେৎ෉ʂ w Ϣʔβొ࿥ϛϡʔςʔγϣϯͯ͠ΈΑ͏ʂ w ࣗ෼ͷ6TFS*E֮͑ͱ͍ͯ΄͍͠ʜʂ (SBQI2-.VUBUJPOΛ࢖ͬͯΈΑ͏ʂ

Slide 77

Slide 77 text

νʔϜͰνϟϨϯδʂ 8PSEMFΛͭͬͯ͘ΈΑ͏

Slide 78

Slide 78 text

8PSEMFͱ͸ʁ IUUQTXXXOZUJNFTDPNHBNFTXPSEMFJOEFYIUNM w จࣈͷӳ୯ޠ͕Կ͔Λ౰ͯΔήʔϜ w ਖ਼ղͷӳ୯ޠʹճ౴ͨ͠จࣈ͕ೖ͍ͬͯΔ͔৭Ͱ൑அ w จࣈʹೖͬͯͳ͍ɿάϨʔ w จࣈͷͲ͔͜ʹ͸ೖͬͯΔɿΦϨϯδ w จࣈͷ৔ॴ΋จࣈ΋߹ͬͯΔɿάϦʔϯ

Slide 79

Slide 79 text

$IBMMFOHF w 8PSEMF1BHFΛ৽ͨʹ੾Γग़ͯ͠࡞͍ͬͯ͜͏ w ϘλϯΛԡͯ͠66*%ΛϥϯμϜੜ੒͠Α͏ w IUUQTQVCEFWQBDLBHFTVVJEΛ࢖ͬͯΈΑ͏ w 66*%ʹରԠ͢Δӳ୯ޠΛΫΤϦͰҾͬு͖ͬͯͯදࣔ͠Α͏ʂ w ༨ྗ͕͋ͬͨΒϩʔσΟϯάදࣔ΋ͯ͠ΈΑ͏

Slide 80

Slide 80 text

$IBMMFOHFղઆ IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM

Slide 81

Slide 81 text

$IBMMFOHF w ͷԼʹςΩετϑΟʔϧυΛ௥Ճ w ςΩετϑΟʔϧυͰจࣈΛೖྗͯ͠ճ౴ͯ͠ΈΑ͏ʂ w ճ౴݁ՌΛԼʹදࣔͯ͠ΈΑ͏ w ༨ྗ͕͋ͬͨΒ݁Ռϕλॻ͖ͳͷΛ͍͍ײ͡ʹදࣔͯ͠ΈΑ͏ʂ

Slide 82

Slide 82 text

$IBMMFOHFղઆ IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM

Slide 83

Slide 83 text

$IBMMFOHF w ͖ͬ͞ͷ݁ՌΛ৭෇͚ͯ͠ΈΑ͏ʂ

Slide 84

Slide 84 text

$IBMMFOHFղઆ IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM

Slide 85

Slide 85 text

w ճτϥΠͰ͖ΔΑ͏ʹ͠Α͏ʂ w ͷղ౴͸ফͯ͠0, $IBMMFOHF

Slide 86

Slide 86 text

IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM $IBMMFOHFղઆ

Slide 87

Slide 87 text

w ճτϥΠͨ͠ޙμΠΞϩάͰղ౴Λग़ͯ͋͛͠Α͏ʂ $IBMMFOHF

Slide 88

Slide 88 text

IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM $IBMMFOHFղઆ

Slide 89

Slide 89 text

w ΩʔϘʔυΛ࿈ಈͤ͞Α͏ʂ w ΩʔϘʔυͷίʔυཉ͔ͬͨ͠Βݴ͍ͬͯͩ͘͞ʂ $IBMMFOHF

Slide 90

Slide 90 text

IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM $IBMMFOHFղઆ

Slide 91

Slide 91 text

w ճऴΘͬͨΒଞͷ୯ޠΛղ͚ΔΑ͏ʹ͠Α͏ w Ϙλϯ௥ՃͰ΋ͳΜͰ΋0,ʂ w ճ໨ͷճ౴͕ऴΘͬͨΒQPTU$PNNVOJUZϛϡʔςʔγϣϯΛ౤͛ͯΈΑ͏ w ผϖʔδͰΈΜͳͷίϛϡχςΟ͕ݟΕΔΑ͏ʹ͠Α͏ w ຊՈ8PSEMFͷΑ͏ͳΞχϝʔγϣϯΛ͚ͭͯΈΑ͏ w ඪ४Ͱ"OJNBUFE8JEHFU͕༻ҙ͞Ε͍ͯ·͢ʂ w DPSSFDU8PSEͷΫΤϦͷΈͰ࡞Γ௚ͯ͠ΈΑ͏ .PSF$IBMMFOHF

Slide 92

Slide 92 text

Ϋϩʔδϯά

Slide 93

Slide 93 text

Ϋϩʔδϯά 'MVUUFSָ͠Ί͔ͨͳʁ

Slide 94

Slide 94 text

ҎԼิ଍ࢿྉ

Slide 95

Slide 95 text

fi OBMͱDPOTUͷҧ͍ fi OBM͸࣮ߦ࣌ఆ਺ DPOTU͸ίϯύΠϧ࣌ఆ਺ ίϯύΠϧ࣌ʹఆ਺ʹͪ͠Ό͑ΔͳΒͦͬͪͷํ͕ྑ͍ͷͰDPOTUΛ࢖͓͏ʂ

Slide 96

Slide 96 text

#VJME$POUFYUͬͯͳ͋ʹʁ ͦ΋ͦ΋8JEHFU͸ӈਤͷΑ͏ʹπϦʔঢ়ʹͳ͍ͬͯΔ #VJME$POUFYU͸݂ےͷ͜ͱͰ૆ઌͷ৘ใʹΞΫηε͢Δ͜ͱ͕Ͱ͖Δ ˞௚ܥͷ૆ઌ͔͠ḷΕͳ͍ʂ ˞ͭͷ8JEHFUͷΠϯελϯεʹରͯ͠ ɹͭͷ#VJME$POUFYU͕ϖΞͷؔ܎ʹͳ͍ͬͯΔʂ 5IFNF PSBOHF 8JEHFU" 5IFNF QJOL 8JEHFU$ .BUFSJBM"QQ 5IFNF CMVF 4DB ff PME ࣮ߦ݁Ռʢ࣮૷͸ͪ͜Βʣ 8JEHFU# 3PX $PMVNO ͸ࣗ෼ͷ݂ےΛͨͲͬͯ ૆ઌʹ͋Δ5IFNFΛݟ͚͖͍ͭͯͯΔ Theme.of(context) 8JEHFU#ͷ݂ےΛḷͬͨΒ ͜͜ͷ5IFNF͕ݟ͔ͭͬͨʂ