Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up
for free
IntelliJ IDEAのFlutter Live Previewおためし会
NanoNano / Banno Takuya
December 06, 2018
Technology
1
970
IntelliJ IDEAのFlutter Live Previewおためし会
2018.12.06 Flutter Meetup Tokyo #6
NanoNano / Banno Takuya
December 06, 2018
Tweet
Share
More Decks by NanoNano / Banno Takuya
See All by NanoNano / Banno Takuya
nanonano
0
73
nanonano
2
580
Other Decks in Technology
See All in Technology
yuzutas0
8
3k
torisoup
11
5.9k
viva_tweet_x
3
2.9k
gobeyond20xx
0
240
mii3king
0
430
imdigitallab
0
420
chaspy
6
1.3k
harshbothra
0
130
futo23
1
330
hmatsu47
4
630
masakazu
0
180
akitok_
1
690
Featured
See All Featured
philhawksworth
192
8.8k
swwweet
206
6.9k
brianwarren
82
4.7k
dotmariusz
94
5.5k
deanohume
294
28k
marcelosomers
221
15k
jcasabona
8
550
smashingmag
283
47k
frogandcode
128
20k
brettharned
93
3k
smashingmag
230
18k
pedronauck
652
110k
Transcript
Flutterお助けTool検証シリーズ IntelliJ IDEAの Flutter Live Previewおためし会 2018.12.06 Flutter Meetup Tokyo #6
@nano2_aloerina
• 坂野 匠弥 / なのなの • 株式会社アスネット 技術部 開発グループ所属 •
業務は主にAndroid(フロントエンド) • Flutterレベル: とりあえず何か作ろうと奮闘中 • Twitter: @nano2_aloerina / GitHub: nano-nano 自己紹介 Flutter勝手に擬人化キャラクター 「ふらったん」です!
None
None
!!
Let’s Try!!
None
None
None
None
None
None
None
None
None
ちなみに……
None
None
None
None
ここがGood!! • それぞれの子Widgetが色分けされて表示される ◦ 色分けは自動だが、見やすくてよい • プレビューのWidgetをクリックすると、対応するコードにジャンプしてくれる ◦ Flutter Outlineの機能のようです
• コードを変更すると、Widgetのサイズ等も動的に変わる ◦ 相対的なWidgetのサイズ等を確認しやすい
ここがNOT Good... • Widgetの内容(TextとかImageとか)は表示されない • Widgetを選択しても、すぐにプレビューが出るわけではない ◦ 最初のレンダリングに少し時間がかかる • ときどきレンダリングされないままになることがある
◦ Projectを開き直す、コードをいじってみる等で解消することも • 端末の画面サイズ等を考慮したプレビューでは無い • ドラッグできない
まとめ • 現時点では「使えるような、使えないような……」という感じ ◦ 開発中機能なので仕方ない • 正式機能としてリリースされる頃には、きっと便利ツールになってるはず!
Appendix. 参考文献等 Using live preview https://github.com/flutter/flutter-intellij/wiki/Using-live-preview Flutter Outline, Hot Reload,
and the implementation of a live widget preview https://medium.com/flutter-io/flutter-outline-hot-reload-and-the-implementation-of-a-live-widget-pre view-69abd39aa3bb
Thank You!!