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だけでテトリス作ってみた
Search
Aoi Umigishi
February 29, 2024
Programming
0
200
Flutterだけでテトリス作ってみた
第2回Flutter Nightでの登壇資料です。
Aoi Umigishi
February 29, 2024
Tweet
Share
More Decks by Aoi Umigishi
See All by Aoi Umigishi
iOS 26にアップデートすると実機でのHot Reloadができない?
umigishiaoi
0
110
SliverAppBarはなぜ変化する?~ Sliverを内側から理解する ~
umigishiaoi
0
120
My challenge to add Vision OS support in Flutter
umigishiaoi
0
88
Other Decks in Programming
See All in Programming
なぜ「共通化」を考え、失敗を繰り返すのか
rinchoku
1
630
NPOでのDevinの活用
codeforeveryone
0
720
PHP 8.4の新機能「プロパティフック」から学ぶオブジェクト指向設計とリスコフの置換原則
kentaroutakeda
2
720
データの民主化を支える、透明性のあるデータ利活用への挑戦 2025-06-25 Database Engineering Meetup#7
y_ken
0
340
たった 1 枚の PHP ファイルで実装する MCP サーバ / MCP Server with Vanilla PHP
okashoi
1
220
PHPでWebSocketサーバーを実装しよう2025
kubotak
0
260
XP, Testing and ninja testing
m_seki
3
220
エラーって何種類あるの?
kajitack
5
340
来たるべき 8.0 に備えて React 19 新機能と React Router 固有機能の取捨選択とすり合わせを考える
oukayuka
2
890
datadog dash 2025 LLM observability for reliability and stability
ivry_presentationmaterials
0
440
0626 Findy Product Manager LT Night_高田スライド_speaker deck用
mana_takada
0
140
deno-redisの紹介とJSRパッケージの運用について (toranoana.deno #21)
uki00a
0
180
Featured
See All Featured
Scaling GitHub
holman
459
140k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.3k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Done Done
chrislema
184
16k
The Cult of Friendly URLs
andyhume
79
6.5k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
Unsuck your backbone
ammeep
671
58k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
The Language of Interfaces
destraynor
158
25k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Transcript
F l u t t e r だ け で
テ ト リ ス 作 っ て み た F lu t t e r N i ght ���� 年 �� 月 �� 日 Aoi Umigishi
アジェンダ �. 自己紹介 �. 作成したテトリスの紹介 �. 作成ポイント a. テトリスのモデル化 b.
キーボード入力 c. 状態管理 �. まとめ
名前: Aoi Umigishi ( 東 優太 ) SNS 等: 職業:
フリーランスエンジニア (Flutter/TypeScript) 趣味:音楽、ゲーム、 etc ... 自己紹介
作成したテトリスの紹介
作成したテトリスの紹介 特徴: 特徴: �rd Party のパッケージを不使用!
作成ポイント ・テトリスのモデル化 [(false , 黒 ), (true , 紫 ),
(false , 黒 )], [(true , 紫 ), (true , 紫 ), (true , 紫 )] [ ] List<List<PanelModel>> ブロックを PanelModel でモデル化 ブロックを PanelModel でモデル化
作成ポイント ・テトリスのモデル化 移動のロジック 移動後の Block の位置に hasBlock = true のものがないか
チェック なければ移動を実行
作成ポイント ・テトリスのモデル化 移動のロジック 移動後の Block の位置に hasBlock = true のものがないか
チェック あれば移動しない
作成ポイント ・キーボード入力 https://docs.flutter.dev/ui/ interactivity/actions-and-shortcuts Shortcuts, Actions, Focus の � つの
Widget で実現
作成ポイント ・キーボード入力
作成ポイント ・状態管理 親 ゲーム画面 ボタン FieldState 課題 : ゲーム画面の状態をボタンから操作したい currentMino
作成ポイント ・状態管理 親 ゲーム画面 ボタン FieldState 課題 : ゲーム画面の状態をボタンから操作したい
作成ポイント ・状態管理 (StatefulWidget) ゲーム画面 ボタン FieldState 解決方法 : InheritedWidget の利用
TetrisController down (InheritedWidget) _InheritedTetris TetrisController.of(context).fieldState TetrisController.of(context).down
・Flutter だけでテトリスを作りました ・パッケージを使わずとも標準 API で色々できます まとめ ・でも、パッケージはやっぱり便利。感謝。 ・他にも Dart �
の List.indexed とか活用してます ・ リポジトリ見てください!
ご清聴ありがとうございました!