Flutter Meetup Tokyo #5 初心者枠で使った資料です
イベント: https://flutter-jp.connpass.com/event/101447/ PDF: https://github.com/sesta/slide/raw/master/20181017_be-cool-flutter-webview.pdf
Flutter Ͱ WebView Λ͍͍ײ͡ʹ͢ΔZOZOςΫϊϩδʔζɹాमฏ / sesta / ͤͨ͢2018/10/17 Flutter Meetup Tokyo #5 1
View Slide
ࣗݾհాमฏ▸ גࣜձࣾZOZOςΫϊϩδʔζɺ৽ࣄۀΛ୲▸ Google Assistant पΓɺFirebaseɺFlutter Λ৮ͬͯΔ▸ ҰࣇͷύύͰझຯఉ͍͡Γ▸ ಈ͖͢͞ͰબΜͰ͠·͏2
WebView3
WebView ΛͲ͏ͬͯΈࠐΉ͔flutter_webview_plugin▸ https://pub.dartlang.org/packages/flutter_webview_plugin▸ ʮ flutter webview ʯͰݕࡧ͢Δͱ1൪ͻ͔͔ͬΔ4
ͦͷ··͏ͱͲ͏ͳΔ͔ 5
ͦͷ··ͬͨͱ͖ͷॴײ͏ͪΐͬͱ͍͍ײ͡ʹ͍ͨ͠▸ ΕΔΑ͏ʹ͍ͨ͠▸ ಡΈࠐΈதͩͬͯΘ͔ΔΑ͏ʹ͍ͨ͠6
͍͍ײ͡ʹͨ͠ΒͲ͏ͳ͔ͬͨ 7
ͬͨ͜ͱ▸ ΕΔΑ͏ʹ͍ͨ͠▸ UIΛՃ▸ ώετϦʔཧ▸ ಡΈࠐΈதͩͬͯΘ͔ΔΑ͏ʹ͍ͨ͠▸ ϩʔσΟϯάͷදࣔΛՃ8
github.com/sesta/be_cool_webviewͰެ։ͯ͠·͢sesta ( ॳ )ৄ͘͢͠લʹ
ΕΔΑ͏ʹ͍ͨ͠ - UI ΛՃ▸ WebviewScaffold ͷ persistentFooterButtons Λར༻▸ Align ͕ end ʹͳͬͯͯӈ͔Β͔͠٧·Βͳ͍ɺɺɺ▸ ۤ͠ฆΕͷ MediaQuery Ͱ padding 10padding
ΕΔΑ͏ʹ͍ͨ͠ - ώετϦʔཧ▸ Plugin ʹͦͷखͷػೳҰͳ͠▸ back Β next Βͳ͠ɺreload(url) ͋Δ▸ url Λ List Ͱཧͯ͠ɺback͚࣮ͩ▸ next ͕ೖ్ͬͨɺindex ͕ඞཁʹͳ͍ͬͯͨ͜Ί11
ಡΈࠐΈதͩͬͯΘ͔ΔΑ͏ʹ͍ͨ͠ - ϩʔσΟϯάͷදࣔΛՃ▸ LinearProgressIndicator Λ༻▸ WebviewScaffold ʹ body తͳͷ͕ͳ͍ͷͰ Appbar => Bottom ʹՃ▸ valueColor ͷதΛͪΌΜͱࢦఆ͢ΕɺϓϩάϨεײ͕૿ͣ͢12
Flutter ͷײͳΜ͔͍͍ײ͡ʹͳΔ▸ ϚςϦΞϧσβΠϯʹଇΓίϯϙʔωϯτ͕ఏڙ͞Ε͍ͯΔͷͰ ύʔπΛஔ͍͚ͯͩ͘ͰͦΕͬΆ͘ͳΔ▸ ͔͠ Android iOS ྆ํ▸ ϨΠΞτΉ͍ͣ▸ ࠨʹد͍͚ͤͨͩͳΜ͚ͩͲɺɺɺ▸ എܠͷ৭ม͍͚͑ͨͩͳΜ͚ͩͲɺɺɺ13
END14