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

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

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

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

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

ݚमͷΰʔϧ

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

'MVUUFSͱ͸

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

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

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

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

࣮ߦ࣌ʹ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ͳݴޠͷ৔߹

= 100; int? b = null; a = null; // Τϥʔ print(a + b); // Τϥʔ if (b != null) { print(a + b); } print(a + (b ?? 0)); C͕OVMMͷ࣌͸ආ͚ ͯ͘ΕΔͷͰ҆৺ EBSU΍/VMM4BGFUZͳݴޠͷ৔߹ C͕OVMMͩͬͨΒ Λ࢖͏ͱ͍͏ҙຯ

= 100; int? b = null; a = null; // Τϥʔ print(a + b); // Τϥʔ if (b != null) { print(a + b); } print(a + (b ?? 0)); C͕OVMMͷ࣌͸ආ͚ ͯ͘ΕΔͷͰ҆৺ EBSU΍/VMM4BGFUZͳݴޠͷ৔߹ C͕OVMMͩͬͨΒ Λ࢖͏ͱ͍͏ҙຯ ઈରOVMM͡Όͳ͍ʂͬͯ৔߹͸ ɹɹͱॻ͘͜ͱ΋Ͱ͖Δ b!

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

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ʹ௥Ճͤ͑ʂ

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ʣ զ͸όϒʙͱ͍͏ࠇ৭ͷ ਅΜதدͤςΩετͰ͋Δʂ

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

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

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

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

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

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

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

෼ؒٳܜ

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

΢ΟδΣοτ ϖʔδશମ

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

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

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

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

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

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

*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 ֦ுػೳ͸͜͏࢖͏ʂʢผϖʔδͰઆ໌ʣ

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

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

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

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

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Λ࢖ͬͯ΋ ඳ͚·͢ʂ

$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"$)&% ɽɽɽ

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

$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"$)&% ɽɽɽ *O fi OJUZʂʂ

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

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

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

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

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

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

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

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

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

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

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

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

ϥϯν

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

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

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

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

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

(BuildContext context) => B(), ), ); Navigator.pop(conte 8JEHFU ࠓճ͸4FDPOE1BHF Λ .BUFSJBM1BHF3PVUFʹ౉ͯ͠ 3PVUFΛ࡞ΓɼͦΕΛදࣔ

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

(BuildContext context) => B(), ), ); Navigator.pop(conte

(BuildContext context) => B(), ), ); Navigator.pop(conte ͍͍ͪͪ͜Εॻ͘ͷ ΊΜͲ͍͘͞ʂʂʂ

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

(SBQI2-ͬͯͳΜͩʂ

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

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

(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*ͩͱଞͷ৘ใ·Ͱ Ҿͬு͖ͬͯͪΌ͏ʜ ࠓඞཁͳσʔλ͚ͩ औಘͰ͖Δʂ

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

(SBQIJ2- IUUQTTFSFOFHBSEFOIFSPLVBQQDPN

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

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

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

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

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

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

$IBMMFOHFղઆ IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM

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

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

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

IUUQTHJUIVCDPNNJYJHSPVQ#FHJOOFS5SBJOJOH'MVUUFSQVMM $IBMMFOHFղઆ

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

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

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

Ϋϩʔδϯά

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

ҎԼิ଍ࢿྉ

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

#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͕ݟ͔ͭͬͨʂ

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

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

More Decks by MIXI ENGINEERS

Other Decks in Programming

Featured

Transcript