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
Flutterとの1年
Search
najeira
September 02, 2018
Technology
4
1.5k
Flutterとの1年
najeira
September 02, 2018
Tweet
Share
More Decks by najeira
See All by najeira
Flutter with Platform
najeira
4
1.4k
Google I/O 2019 Extended Tokyo - Flutter
najeira
1
180
Flutter APP DOJO 2019-04
najeira
1
190
Flutter List View 概要
najeira
0
1.1k
Flutter / Google I/O 2018 報告会 信州
najeira
0
300
仕組みを知れば怖くない! Flutter入門
najeira
16
7.9k
FlutterでAndroid/iOS両対応のアプリ開発
najeira
0
4.5k
Google I/O 2017 報告会 Firebase/Cloud
najeira
1
170
Google I/O 2017 報告会 Flutter/Dart
najeira
1
320
Other Decks in Technology
See All in Technology
第64回コンピュータビジョン勉強会「The PanAf-FGBG Dataset: Understanding the Impact of Backgrounds in Wildlife Behaviour Recognition」
x_ttyszk
0
240
QuickSight SPICE の効果的な運用戦略~S3 + Athena 構成での実践ノウハウ~/quicksight-spice-s3-athena-best-practices
emiki
0
290
サービスを止めるな! DDoS攻撃へのスマートな備えと最前線の事例
coconala_engineer
1
180
PHPからはじめるコンピュータアーキテクチャ / From Scripts to Silicon: A Journey Through the Layers of Computing
tomzoh
2
120
How to Quickly Call American Airlines®️ U.S. Customer Care : Full Guide
flyaahelpguide
0
240
公開初日に Gemini CLI を試した話や FFmpeg と組み合わせてみた話など / Gemini CLI 初学者勉強会(#AI道場)
you
PRO
0
1.3k
本当にわかりやすいAIエージェント入門
segavvy
1
340
ClaudeCode_vs_GeminiCLI_Terraformで比較してみた
tkikuchi
1
1k
american aa airlines®️ USA Contact Numbers: Complete 2025 Support Guide
aaguide
0
500
Four Keysから始める信頼性の改善 - SRE NEXT 2025
ozakikota
0
410
セキュアな社内Dify運用と外部連携の両立 ~AIによるAPIリスク評価~
zozotech
PRO
0
120
60以上のプロダクトを持つ組織における開発者体験向上への取り組み - チームAPIとBackstageで構築する組織の可視化基盤 - / sre next 2025 Efforts to Improve Developer Experience in an Organization with Over 60 Products
vtryo
3
1.9k
Featured
See All Featured
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
340
Optimizing for Happiness
mojombo
379
70k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Why Our Code Smells
bkeepers
PRO
337
57k
YesSQL, Process and Tooling at Scale
rocio
173
14k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
29
9.6k
BBQ
matthewcrist
89
9.7k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Practical Orchestrator
shlominoach
189
11k
How GitHub (no longer) Works
holman
314
140k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Typedesign – Prime Four
hannesfritz
42
2.7k
Transcript
Flutter との1 年 GDG DevFest 2018 Tokyo @najeira
Flutter との1 年 Flutter をアプリ開発(プロダクション)に 使い始めてから1 年と少し経った 開発にまつわる四方山話
Agenda どういうアプリを作ったか? なぜFlutter を選んだか? 使ってみての感想 OSS としてのFlutter
作ったアプリ CARTUNE (車のコミュニティ)
なぜFlutter を選んだか? 高い開発効率 すばやく試行錯誤(リリース)したい 少人数での開発 Android/iOS の両方でリリースしたい → クロスプラットフォームSDK を使いたい
検証 Flutter を利用して開発できるか事前に検証 1 画面を試しに実装 ネイティブとの連携
写真グリッドを試しに実装 ※スクリーンショットは最新のもので、検証版とは多少異なります
写真グリッドを試しに実装 重要な機能となる1 画面を選んで実装してみた Flutter 初心者でも1 日で実装できた さわってみて パフォーマンスには問題なかった
ネイティブとの連携 Flutter ⇔ ネイティブ
ネイティブとの連携 ネイティブ(Activity/ViewController )の 画面へ遷移することができるか確認した これができれば、Flutter で実装できなくても いざとなったらネイティブ実装でなんとかなる
CARTUNE でのネイティブ画面 WebView お知らせ、ヘルプ 写真Picker Android / iOS のプラットフォーム固有の 機能(API)
を使うため 写真編集 OpenCV を使っているため Flutter で実装できない画面は少なかった
写真Picker Android は Intent でギャラリー系アプリを起動 iOS は Photos フレームワーク
写真編集 OpenCV を使ってナンバー検出して隠す Android JNI を経由するためネイティブ側で実装 ※おそらくFlutter でも画面は実装できる
ネイティブとの連携 分かりやすく分けると UI に関するものは Flutter でできる そうでないものはネイティブ側で作る
使ってみての感想
よかったこと
コードの共有 画面数で数えると: 95% コード(Dart) でみると: 70% ※写真編集で使っているOpenCV 関連コードが多くDart が70% にとどまる
開発効率 ホットリロードがとても便利
困ったこと
機能的な課題 不十分な箇所があった(改善してきている) [Fixed] 動画再生がない [Fixed] 一部のマイナー文字で落ちる [Fixed] 複数行テキスト入力がない フォント選択が日本語にならないことがある IME
や入力欄の挙動がネイティブと違う 広告SDK との連携がいまいち テキストまわりが多い
テキストまわり CARTUNE ではテキスト入力欄はネイティブ側で実装 Flutter 側の画面で 投稿・入力ボタンを押すと ネイティブの Activity / ViewController
が起動 テキスト入力して OK すると Flutter に入力した文章が渡される あとはそれを使って処理を実行
その他バグとの遭遇 Issue 報告 Pull Request Flutter(Dart 部分) のバグは 回避して UI
を作れば OK だいたいワークアラウンドがある C++ で書かれたエンジン部分のバグは 直すしかないことが多い →CARTUNE ではパッチをあてて使っている
OSS としてのFlutter
OSS としてのFlutter GitHub: utter/ utter Stars: 35,963 Commits: 11,701 Contributors:
238 今月だけでも: 272 commits, 47,173 additions, 14,296 deletions, 691 closed issues ※2018/08/27 時点
Contribution CONTRIBUTING . md があるので読む コードを変更する (必要に応じて)テストを追加する テストを実行する あとは GitHub
のプルリクエスト
Contribution utter/engine 側は準備が必要 C++ で書かれているのでビルドツールを準備 あとは utter/ utter と同じ ※こちらもCONTRIBUTING
. md があるので読めばOK
まとめ CARTUNE というアプリをFlutter で作り、継続してア ップデートできている 開発効率が高いのがよい バグなどはあるが、改善されていっている 開発は活発、OSS なので自分でなおせる