Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
IntelliJ IDEAのFlutter Live Previewおためし会
Search
Banno Takuya / NanoNano
December 06, 2018
Technology
1
1.7k
IntelliJ IDEAのFlutter Live Previewおためし会
2018.12.06 Flutter Meetup Tokyo #6
Banno Takuya / NanoNano
December 06, 2018
Tweet
Share
More Decks by Banno Takuya / NanoNano
See All by Banno Takuya / NanoNano
20230925 After DroidKaigi LT Night
nanonano
0
91
クイズ大会をシミュレーションする vbc on Webの挑戦?と展望 / Simulation Quiz Tournament
nanonano
0
490
Flutter製アプリのアクセシビリティ対応(音声読み上げ編) / Screen reading in Flutter app
nanonano
2
1.7k
Other Decks in Technology
See All in Technology
Classmethod流のPlatform Engineering / classmethod-platform-engineering-devio2024
tomoki10
0
480
AWSサービスメニュー開発をしていてAWSを好きだ!と感じた瞬間
toru_kubota
0
130
年間一億円削減した時系列データベースのアーキテクチャ改善~不確実性の高いプロジェクトへの挑戦~
lycorptech_jp
PRO
3
2.9k
さらに高品質・高速化を目指すAI時代のテスト設計支援と、めざす先 / AI Test Lab vol.1
shift_evolve
0
190
目標設定は好きですか? アジャイルとともに目標と向き合い続ける方法 / Do you like target Management?
kakehashi
10
3k
Android研修【MIXI 24新卒技術研修】
mixi_engineers
PRO
0
100
CTOから見た事業開発とプロダクト開発 / My Perspective on Business and Product Development as CTO
keisuke69
4
960
DevIO2024_レガシー運用からの脱却 -クラウド活用の実践事例とベストプラクティス-
jun2882
0
210
データベース研修 分析向けSQL入門【MIXI 24新卒技術研修】
mixi_engineers
PRO
0
110
AOAI Dev Day - Opening Session
yoshidashingo
2
470
データベース研修 DB基礎【MIXI 24新卒技術研修】
mixi_engineers
PRO
0
220
Github Actions 로 Android 팀의 효율성 극대화
hadonghyun
0
160
Featured
See All Featured
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
353
29k
[RailsConf 2023] Rails as a piece of cake
palkan
35
4.4k
How to train your dragon (web standard)
notwaldorf
79
5.5k
Fontdeck: Realign not Redesign
paulrobertlloyd
79
5.1k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.9k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
29
2.5k
Building a Modern Day E-commerce SEO Strategy
aleyda
25
6.7k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
360
22k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
26
1.8k
5 minutes of I Can Smell Your CMS
philhawksworth
200
19k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
17
1.5k
ParisWeb 2013: Learning to Love: Crash Course in Emotional UX Design
dotmariusz
105
6.8k
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!!