![](https://blog.flutteruniv.com/wp-content/themes/cocoon-master/images/man.png)
Flutterの最新情報をキャッチアップしたい!
そんなあなたに送る、 Flutterニュース 。
本記事ではFlutterニュースとして、2022年4月第2週に話題になったFlutter関連の情報や、
アップされた記事、YouTube動画の紹介を行います。
読むだけでFlutterの最新情報がキャッチアップできます。 ぜひ読んでみてください!
- Flutter公式情報
- Flutterに関する話題
- Flutterに関する記事
- Flutterに関する動画
- Flutter大学メンバーがリリースしたアプリ
- Flutter大学メンバーによる記事
- FlutterとFIrebaseでCRUDできるデモアプリ作ってみた。
- 【Flutter】Windows Desktop アプリのビルド方法と開発環境の構築
- 【Flutter】最速で Flutter Web を Cloudflare Pages にデプロイする
- 【Flutter】geoflutterfireという範囲内の座標のみを取得する神パッケージの紹介
- 【Flutter】コマンド一発でスプラッシュ画面を実装する【flutter_native_splash】
- 【Flutter】初期化が終わるまでスプラッシュ画面を表示したい【flutter_native_splash】
- Flutter だけど GitHub リポジトリ名にハイフンを使いたい
- Flutter逆引き辞典の追加ページ
- 週刊Flutter大学の記事
- まとめ
- 編集後記(2022/4/11)
Flutter公式情報
MyDash: It’s not just one big build method anymore! | Learning to Fly
初心者がFlutterのアプリケーション作成を通してFlutterについて学んでいく公式の動画シリーズ、Learning to Fly が更新されました。
今回のテーマはWidgetの分割と、ファイル構成、デバッグの仕方についてです。
先輩エンジニアとの対話形式で学んでいく姿が見られます。
Flutterに関する話題
Dependabot の Flutter/Dartに対するベータサポートの開始
使用しているパッケージの依存関係を自動で確認し、
必要に応じてその更新を行ったプルリクエストを送ってくれるDependabotが、
Flutter/Dartに対応しました。
現状はGitHubからのパッケージには対応しておらず、pub
のパッケージのみ対応しているとのことです。
zwidget パッケージ
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/ed67759b5dc175d3ed7cae097a87d3f6.png)
Widgetを重ね合わせて3次元の見た目にするパッケージ、
ZWidgetがRedditで話題となっていました。
Flutterで3次元の要素を実装したり、
立体的な見た目のテキストやアイコンを実装するのに良さそうです。
Stockholm パッケージ
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/ed67759b5dc175d3ed7cae097a87d3f6.png)
Desktop アプリケーション向けにデザインされたUIを作成できるパッケージ、StockholmがRedditで話題になっていました。
ServerpodのUIを作成する中で作成したパッケージとのことです。
Flutterに関する記事
【個人開発】Flutter webでLINEグルチャメンバーの子どもの顔と名前がわかる「かおなまいっち」というサービスを作った話
![](https://qiita-user-contents.imgix.net/https%3A%2F%2Fcdn.qiita.com%2Fassets%2Fpublic%2Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png?ixlib=rb-4.0.0&w=1200&mark64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JUUzJTgwJTkwJUU1JTgwJThCJUU0JUJBJUJBJUU5JTk2JThCJUU3JTk5JUJBJUUzJTgwJTkxRmx1dHRlciUyMHdlYiVFMyU4MSVBN0xJTkUlRTMlODIlQjAlRTMlODMlQUIlRTMlODMlODElRTMlODMlQTMlRTMlODMlQTElRTMlODMlQjMlRTMlODMlOTAlRTMlODMlQkMlRTMlODElQUUlRTUlQUQlOTAlRTMlODElQTklRTMlODIlODIlRTMlODElQUUlRTklQTElOTQlRTMlODElQTglRTUlOTAlOEQlRTUlODklOEQlRTMlODElOEMlRTMlODIlOEYlRTMlODElOEIlRTMlODIlOEIlRTMlODAlOEMlRTMlODElOEIlRTMlODElOEElRTMlODElQUElRTMlODElQkUlRTMlODElODQlRTMlODElQTMlRTMlODElQTElRTMlODAlOEQlRTMlODElQTglRTMlODElODQlRTMlODElODYlRTMlODIlQjUlRTMlODMlQkMlRTIlODAlQTYmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTQ3MWM4MmQyZGE3NjBlZGU5ODdjYzQyZGViM2U4MjIy&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTcxNiZ0eHQ9JTQwc2VraXRha2FfMTIxNCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTMyJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9NTUyZTAxMTAxNTJiN2NmMmZlNTE3Y2VhOTliYTQ1NjY&blend-x=142&blend-y=491&blend-mode=normal&s=77d4e49c67e6e158756a609719da1c05)
Flutter Web でのサービスのリリース体験談です。
開発にあたって使用した技術の紹介や、
使っていて良かった点、辛かった点が紹介されています。
Flutter Animationの裏側
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/95e18ed871ffef684dc5f613eb9ebe3c.png)
Flutterのアニメーションについて深く掘り下げた記事です。
内部コードのリーディングを通して、
アニメーションの仕組みについて解説されています。
Flutterのローカルデータベースの紹介
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/42e0d259230d7a8c6c5f000216042a27.jpeg)
Flutterで使われるローカルデータベースを列挙し、
それぞれの特徴についてまとめた記事です。
ローカルデータベースの選定する際に有用です。
FlutterアプリケーションをシームレスにWindowsに統合する方法
FlutterでWindows向けのアプリケーションを作成するのに有用なパッケージを紹介している記事です。
Fluent UI や、window_manager等、UI面に着目しての紹介となっています。
VSCodeでFlutter テストカバレッジレポートを生成、解析する方法
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/d5d389e8bf9d26830e8e684b92d26206.png)
Flutterでのテストのカバレッジレポートの取得方法についての記事です。
カバレッジとは、プロジェクトの中のテスト可能なコードが
どれだけテストされたかを割合で表したものです。flutter test --coverage
を使用したカバレッジの取得方法や、
VSCodeの拡張機能を利用して、カバレッジを見やすくする方法について書かれています。
なぜFlutterは速いのか?
Flutterが何故速いのか、をテーマに、
3つの記事でその理由についてをまとめた記事が紹介されています。
Flutter内部の処理について、
3つのツリーの話のような基本的な部分から丁寧に解説されています。
Flutterの内側を学びたい際に有用な記事でした。
GraphQL Flutter + Flutter Hooks
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/269f6a67f1a02493e19aff64b73cfc5d.jpeg)
GraphQL Flutter パッケージの5.1.0がリリースされました。
このアップデートで、Flutter Hooksとの連携ができるようになったそうです。
記事ではこの基本的な使い方が端的に解説されています。
Dart/FlutterでのFutureOrとは何か?
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/d27f76a843aacc3b65ac52711731ffd5.jpeg)
Future<T>とTのユニオン型であるFutureOrについての解説記事です。
データベースを用いた具体例で、使用例を解説されています。
Flutterに関する動画
Flutter上に構成されるゲームエンジン、Flame エンジン
Flutterで2Dのゲームを遊べるようにするパッケージ(ゲームエンジン)である
Flameについての動画です。
Flameの紹介と、簡単な使い方について、動画にまとめられています。
Flutter大学メンバーがリリースしたアプリ
わらびアクセサリー ~個人アクセサリー製品の紹介アプリ~
かわさんによって、
個人アクセサリー製品の紹介アプリ、『わらびアクセサリー』がリリースされました!
昆虫をモチーフにして制作されたアクセサリーを、画像で紹介するアプリとなっています。
アプリリリースもすごいですが、
紹介されているアクセサリーがまるで本物かと見間違えるくらいのクオリティで、
とても素敵です。
ぜひダウンロードして見てみてください。
Flutter大学メンバーによる記事
FlutterとFIrebaseでCRUDできるデモアプリ作ってみた。
![](https://qiita-user-contents.imgix.net/https%3A%2F%2Fcdn.qiita.com%2Fassets%2Fpublic%2Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png?ixlib=rb-4.0.0&w=1200&mark64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9Rmx1dHRlciVFMyU4MSVBOEZJcmViYXNlJUUzJTgxJUE3Q1JVRCVFMyU4MSVBNyVFMyU4MSU4RCVFMyU4MiU4QiVFMyU4MyU4NyVFMyU4MyVBMiVFMyU4MiVBMiVFMyU4MyU5NyVFMyU4MyVBQSVFNCVCRCU5QyVFMyU4MSVBMyVFMyU4MSVBNiVFMyU4MSVCRiVFMyU4MSU5RiVFMyU4MCU4MiZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9YzY0MTBiYzJjZDMxZWVkODNmZWQ4MDQwMGJiMzg1NTA&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTcxNiZ0eHQ9JTQwSnVuaWNoaUhhc2hpbW90byZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTMyJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9MzY1N2MwMzA3ZWVlN2I4ZGRlZWM1MzkyZWZjYjE2OTQ&blend-x=142&blend-y=491&blend-mode=normal&s=cb07fe0849301f0aa9619d325f2ce6a7)
FlutterとFirebaseを使用しての、
追加や削除、編集ができるアプリケーションの作成について書かれた記事です。
Firebase のデータ構成から使用したパッケージ、サンプルコードが紹介されています。
【Flutter】Windows Desktop アプリのビルド方法と開発環境の構築
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/0c42b8781188a2b61cf0919a1adb4e6c.png)
Windows でのFluttterの環境構築から、Windows アプリのビルド方法まで書かれた記事です。
最近開始したFlutterのWindowsに対するサポートを早速利用してみた記事となっています。
【Flutter】最速で Flutter Web を Cloudflare Pages にデプロイする
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/6e477e1dcf93fd84d3eac4e586c256ab.png)
Flutter Web × Cloudflare Pagesの解説記事です。
特定のブランチにPushした際に自動でデプロイするための
GitHubやCloudflare Pages の設定について、
スクリーンショットや図を用いて詳細に解説されています。
【Flutter】geoflutterfireという範囲内の座標のみを取得する神パッケージの紹介
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/2b23f737ac159da9aebadf03742c6b0e.png)
geoflutterfire パッケージを紹介し、範囲内の座標のみを取得する方法について書かれた記事です。
スクリーンショットやサンプルコードを用いて、
座標の取得の仕組みについて丁寧に解説されています。
【Flutter】コマンド一発でスプラッシュ画面を実装する【flutter_native_splash】
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/ccda7ab5088c131fa4cbe5c0c5d9c20f.png)
Flutterのスプラッシュ画面の実装方法について書かれた記事です。
ただアイコン画像を表示する方法だけでなく、
Android と iOSでの位置調整の仕方や、
ダークモードの指定の仕方まで、詳細に解説されています。
【Flutter】初期化が終わるまでスプラッシュ画面を表示したい【flutter_native_splash】
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/5b6bb3273c035eedef036fcd201433b1.png)
初期化処理が終わるまでスプラッシュ画面を表示し続ける方法について解説された記事です。
対策前と後の動作の変化を、サンプルコードやgifを用いて丁寧に解説されています。
Flutter だけど GitHub リポジトリ名にハイフンを使いたい
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/a7633b559b036b7a3ee3df0f497b01ba.png)
Flutterでハイフン区切りのディレクトリ名を使う方法について書かれた記事です。
Flutterでのディレクトリ名を
ハイフン区切りにするのか、アンダーバー区切りにするのかは、好みで分かれる部分です。
記事では、ハイフン区切りにした方が良い理由について記載されています。
Flutter逆引き辞典の追加ページ
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/e2eec258d34910f7f2fb89e24ee30a8b.jpg)
先週の追加ページは以下になります。
週刊Flutter大学の記事
先週週刊Flutter大学に追加された記事は以下になります。
まとめ
![](https://blog.flutteruniv.com/wp-content/uploads/2022/03/新聞-1024x683.jpeg)
本記事ではFlutterニュースとして、
2022年4月第2週に話題になったFlutter関連の情報や、
アップされた記事、YouTube動画の紹介を行いました。
この記事が、みなさんのFlutterアプリ開発の一助となれば幸いです。
編集後記(2022/4/11)
昨日4/10に第8期の共同開発のキックオフミーティングがZoomで開かれました。
キックオフではアイデアのプレゼンテーションが行われました。
どれも素敵なアイデアで、参加したくなるものばかりでした。
特徴的だったのは、パッケージやFlutter Webの開発のような、
モバイルではないアイデアが持ち寄られたことです。
Flutterの進化により、共同開発の幅もどんどんと広がってきているな、と感じました。
キックオフミーティングのアーカイブ動画の確認や、
共同開発への参加は、Flutter大学のコミュニティプラン以上の会員であれば、
可能となります。
興味のある方はぜひ覗いてみてください。
Flutter大学への入学はこちらから。
![](https://firebasestorage.googleapis.com/v0/b/kboy-salon-app-prod.appspot.com/o/flutterdaigaku_thumbnail.jpg?alt=media&token=fbbb4738-3c41-4735-9fe0-92f683855464)
週刊Flutter大学では、Flutterに関する技術記事、Flutter大学についての紹介記事を投稿していきます。
記事の更新情報はFlutter大学Twitterにて告知します。
ぜひぜひフォローをお願いいたします。