Flutter Meetup Tokyo #13 参加レポート

# Flutter Meetup Tokyo #13
[Flutter Meetup Tokyo #13](https://flutter-jp.connpass.com/event/155559/)にブログまとめ枠で参加してきたので、参加レポートを書かせていただきます。

> Flutter Meetup Tokyoは東京で開催するFlutter勉強会です。
内容はFlutterにまつわることであればなんでもOKです。
初心者の方もガチ勢の方も大歓迎です！ぜひぜひ奮ってご参加ください！

## 開催概要
日時：2019年12月10日（火） 19:00
場所：Yahoo! JAPAN オープンコラボレーションスペース「LODGE」


#LT発表 15分枠
## Supernova StudioでFlutter爆速開発の夢を見れるか？ ([@motoy3d](https://twitter.com/motoy3d))

### 概要
- Macアプリ「Supernova Studio」の紹介
- Sketch、XDのデザインファイルを元に、SwiftやReact Nativeなど各種プラットフォーム向けのコードを自動生成してくれる
- 2019年3月にFlutterエクスポートに正式対応
- 12月4日リリースのV8.0では、Hot Reloadに対応するなどFlutterにかなり力を入れている
- 現段階での本格利用は難しいが、開発が非常に活発なため近い将来期待できそう

### スライド
<script async class="speakerdeck-embed" data-id="8e25bba0bace48c7b69c92b87bec53f4" data-ratio="1.77777777777778" src="//speakerdeck.com/assets/embed.js"></script>
[Supernova Studioで Flutter爆速開発の夢を見れるか？ / Supernova Studio and Flutter Ultra Speed Development - Speaker Deck](https://speakerdeck.com/motoy3d/supernova-studio-and-flutter-ultra-speed-development)

### 関連資料
[Supernova Studio | The World's First Design to Code Platform](https://supernova.io/)
[Getting Started with Supernova Studio（動画）](https://vimeo.com/378180538)

### 感想
- アプリエンジニアがデザインを見ながらレイアウトやアニメーションをコーディングするという一般的なモバイル開発の流れに、今後革命をもたらす可能性を感じた。
<iframe title="vimeo-player" src="https://player.vimeo.com/video/378180538" width="640" height="360" frameborder="0" allowfullscreen></iframe>
- 現状ではFlutter向けにエクスポートしたコードがエラーになったり、レイアウトが崩れるなど細かい問題はあるものの、自力で調整すればなんとかなりそう。
- 安定性が向上すれば爆速開発の実現に期待が高まる。
- デザイナーとエンジニアの連携をよりスムーズにしてくれるような、理想的なツールになってくれると嬉しい。

## Flutterプラグインでdart:ffiを使ってみる ([@espresso3389](https://twitter.com/espresso3389))

### 概要
- dart:ffiを使ってみた
- FlutterからC/C++の関数呼び出しは簡単
- 構造体は闇

### スライド
<script async class="speakerdeck-embed" data-id="fcde540074894350bea141ba25944571" data-ratio="1.77777777777778" src="//speakerdeck.com/assets/embed.js"></script>
[Flutterプラグインでdart:ffiを使ってみる - Speaker Deck](https://speakerdeck.com/espresso3389/flutterhurakuintedart-ffiwoshi-tutemiru)

### 関連資料
[Binding to native code using dart:ffi - Flutter](https://flutter.dev/docs/development/platform-integration/c-interop)
[ffi | Dart Package](https://pub.dev/packages/ffi)

### 感想
- Objective-C/Swift/Java/Kotlinのコードは一切触らず、Platform Channelなど難しいのもなく呼び出しクソ簡単で驚いた。
- 正直あまり使うシーンが想像できなかったけど、いざという時に使える安心感があるのは良い。
- 新卒未経験でSEになった頃、C言語のmallocに苦しめられた思い出が蘇った（個人の感想です）

# LT発表 5分枠
## Flutter desktop embedding for Linux ([@kurun_pan](https://twitter.com/kurun_pan))

### 概要
- 発表から1年経ったFlutter desktop embeddingの現状共有
- まだ不安定でプロダクトには使えない(公式見解)
- 割と普通に動くが使えるプラグインが少な過ぎる

### スライド
[Flutter desktop embedding for Linux - Speaker Deck](https://speakerdeck.com/kurunpan/flutter-desktop-embedding-for-linux)

### 関連資料
[google/flutter-desktop-embedding - GitHub](https://github.com/google/flutter-desktop-embedding)
[[Flutter][macOS] Flutter desktop embedding環境構築](https://qiita.com/kurun_pan/items/9ac5bd6b61fd6081bcf0 #Qiita)
[[Flutter][Linux] Flutter desktop embedding環境構築](https://qiita.com/kurun_pan/items/47c25a4b2425725bc199 #Qiita)

### 感想
- Flutterでデスクトップアプリが作成できるようになればマルチプラットフォーム展開の幅が広がるので期待。
- Linuxネイティブの仕組みがシンプルな点も良い感じ。

## Desktop向け業務アプリでFlutterを採用しようとした話 ([@mirock0606](https://twitter.com/mirock0606))

### 概要
- 業務アプリでFlutterの採用を検討したが、技術選定の結果Electronを選んだ
- 悔しいのでFlutter Desktopの話をしにきた
- MacOS向けはわりと安定している
- 対応プラグインが少ない？拡張できるよ！
- 開発途上なので警告なしで変更加わる可能性あり

### スライド
[fm13_slide/20191210_fm13.pdf at master · mi6ock/fm13_slide](https://github.com/mi6ock/fm13_slide/blob/master/slide/20191210_fm13.pdf)

### 関連資料
[google/flutter-desktop-embedding - GitHub](https://github.com/google/flutter-desktop-embedding)
[flutter-desktop-embedding/macOS-Security.md at master · google/flutter-desktop-embedding](https://github.com/google/flutter-desktop-embedding/blob/master/macOS-Security.md)
[Desktop shells · flutter/flutter Wiki](https://github.com/flutter/flutter/wiki/Desktop-shells)
[salihgueler/DroidKaigi2019Presentation: The Flutter presentation that I made at the DroidKaigi conference](https://github.com/salihgueler/DroidKaigi2019Presentation)

### 感想
- 登壇資料が実際にFlutter Desktopアプリで作られており感動した
- Markdownエディタやデータ取得、ファイル選択などサラッと実装しててすごいと思った（小並感）
- Material UIでデスクトップアプリ作れるの良さそう

## アプリ名を変更するプラグインを作った話 ([@moyashidaisuke](https://twitter.com/moyashidaisuke))

### 概要
- 基本公式通りにやればプラグイン作成できる
- コードの書き方は似てるプラグインを参考にした
- 英語は頑張る
- 一度公開すると削除できないの怖い

### スライド
<iframe src="//www.slideshare.net/slideshow/embed_code/key/ALcz4QXgCiXBq8" width="595" height="485" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;" allowfullscreen> </iframe> <div style="margin-bottom:5px"> <strong> <a href="//www.slideshare.net/moyashidaisuke/20191210-flutter-meetup-203989753" title="20191210 flutter meetup" target="_blank">20191210 flutter meetup</a> </strong> from <strong><a href="https://www.slideshare.net/moyashidaisuke" target="_blank">大翼 福田</a></strong> </div>

### 関連資料
[【Flutter】アプリケーションの名前を変更するpackage/plugin「flutter_launcher_name」を作った-もやぶろ-](https://www.moyashidaisuke.com/entry/create-flutter-launcher-name)
[flutter_launcher_name | Flutter Package](https://pub.dev/packages/flutter_launcher_name)
[Developing packages & plugins  - Flutter](https://flutter.dev/docs/development/packages-and-plugins/developing-packages)

### 感想
- 自分も何かしらプラグイン公開したいと思っていたので、流れがわかってありがたかった
- OSS活動の手始めとして良いチャンスかもしれない

## Atomic DesignをFlutterでやってみた (つっちー)

### 概要
- Atoms, MoleculesがUI BLoC依存すると、他のUIで扱いづらいのでBLoCに依存させたくない
- Atomic DesignはWidgetをきれいに整理できる
- 厳密に再利用性を確保しようとするとFlutterの良さを失う

### スライド
<script async class="speakerdeck-embed" data-id="a5554c8ce35b475489ac9c19a8a8002a" data-ratio="1.33333333333333" src="//speakerdeck.com/assets/embed.js"></script>
[Atomic DesignをFlutterでやってみた - Speaker Deck](https://speakerdeck.com/tsucchy1/atomic-designwoflutterdeyatutemita)

### 感想
- Flutterの良いところを活かしつつ、Atomic Designを採用するのは難易度が高そう
- 適材適所ではあるが部分的な採用ならアリかと思った

## そのアプリ…文字サイズをデカくしてもUI崩れないですか？ ([@_masaokb](https://twitter.com/_masaokb))

### 概要
- Flutterでは簡単に文字サイズ調整対応ができる
- 日本は高齢化社会に突入
- スマホアプリは若者だけでなくすべての年齢層が使うもの
- 日本市場向けアプリを作るからには文字サイズは意識した方が良い

### スライド
[そのアプリ…文字サイズをデカくしてもUI崩れないですか？ - Google スライド ](https://docs.google.com/presentation/d/1hvSX3ZzXPZZr3HeoBNhJiqSff-bPPa-UhhszgmClN2Q/edit#slide=id.g56f2e3b4b9_0_20)

### 関連資料
[Tenxia-inc/font_size_changeable: Flutter example to change font size with keeping UI up](https://github.com/Tenxia-inc/font_size_changeable)
[textScaleFactor property - Text class - widgets library - Dart API](https://api.flutter.dev/flutter/widgets/Text/textScaleFactor.html)
[auto_size_text | Flutter Package](https://pub.dev/packages/auto_size_text)

### 感想
- FlutterではTextScaleFactorやAutoSizeTextなどを使うことで文字サイズ調整が簡単に出来て最高
- 高齢化社会に必須となる配慮だと感じた
- 自分で画面やUI作るときにも気にかけるようにしたい

# まとめ
今回はデザインに関するお話が多く、大変参考になりました。個人的にはSupernova Studioの凄さに衝撃を受けました。

デスクトップアプリについては、今後実運用可能なレベルに達するまで注目していきたいと思います。プラグインの作成などにも手を出していきたいですね。

会場提供していただいたYahoo!JAPANさん、Flutter Meetup Tokyo運営の皆さま、登壇者の方々、当日はありがとうございました！

[Flutter Japan User Group - connpass](https://flutter-jp.connpass.com/)