『Flutterの最新情報をキャッチアップしたい!』
そんなあなたに送る、 Flutterニュース 。
本記事ではFlutterニュースとして、2022年9月第2週に話題になったFlutter関連の情報や、
アップされた記事、YouTube動画の紹介を行います。
読むだけでFlutterの最新情報がキャッチアップできます。 ぜひ読んでみてください!
Flutter公式情報
Flutter 3.3.1 リリース!
Flutter 3.3.1 がリリースされました。
修正点は以下となります。
FlutterのLinkedin チャンネルの解説
Flutterがビジネス特化型SNS Linkedinにチャンネルを解説しました。
動画やブログなど、様々なコンテンツが更新予定とのことです。
Flutterに関する話題
kIsWeb がどのように動くか
実行されている端末がWebかどうかを判定するkIsWebがどのように判定しているか、
APIの実装のリンクを紹介した投稿がRedditで話題になっていました。
JavaScriptの特徴をうまく使って判定を行なっています。
詳細は投稿内リンクをご確認ください。
asset_manager_cli
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/9f366c59dd1e655e1679fe287d6a8266.png)
assets フォルダにある画像のパスを自動でpubspec.yamlに反映してくれるツール、
asset_manager_cli がRedditで話題となっていました。
リンク先のGIFにて使用感を見ることができます。
flutter_screen_capture プラグイン
デスクトップアプリにて、画面全体、または一部分をキャプチャするプラグイン、
flutter_screen_captureについての投稿がRedditで話題となっていました。
現状はmacOSとWindowsにて対応しているとのことです。
様々なサンプルコードリポジトリの紹介
Riverpod や GetXなど様々なトピックを開設するために作成したサンプルコードをまとめた
リポジトリの紹介の投稿です。
ほとんどのプロジェクトにテストが含まれている、とのことです。
wordstonumbers パッケージ
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/9f366c59dd1e655e1679fe287d6a8266.png)
英語で書いた数字の文字列を数字に変換するパッケージ、
wordtonumbersパッケージがRedditで話題となっていました。
このパッケージにて”one hundred twenty”と打ち込むと
120が返ってくるメソッドが使用可能となります。
flutter_rust_bridge
flutterとRustを結びつける、flutter_rust_bridgeがWeb に対応した、との投稿です。
投稿内GitHubのリンクから使用方法について知ることができます。
Flutterに関する記事
SliverListでもListView.separatedと同様の機能をシュッと実現する
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/117e1c66a00e0945218c6ff19aa26354.png)
SliverListでセパレーターを実装する方法について書かれた記事です。
extensionを利用し、UIの実装コードを簡潔にできる方法を紹介されています。
Flutter Animate パッケージの紹介
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/5f72fe07a3f9b8fa646798c10e47a277.jpg)
Flutter Animateパッケージの紹介記事です。
Impellerで話題になったwonderousを作成したチームによるパッケージです。
既存のウィジェットに対して簡単にアニメーションの追加を行うことが可能です。
Riverpodを使用した、多言語対応した文字列をWidgetの外で使用する方法
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/62e99969283ca9c4ec00909781244a64.png)
通常BuildContext
を使用して取得する多言語対応した文字列を、Widget
の外で取得する方法について書かれた記事です。
Error ハンドリングなど、Widget
の外で多言語対応した文字列を使用したい際に、
対応できるようになります。
Fork Bomb for Flutter
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/05a20a5ba37a118632fca8ce04d3faaa.png)
Flutter に関する リバースエンジニアリング手法について解説された記事です。
記事内では、BMWのアプリでの実演が記載されています。
Flutterに関する動画
Google Docs クローンをフルスタックで作ろう
Flutter とNode.js を使って共有のできるGoogle Docsのクローンを作ろう、
というチュートリアル動画です。
状態管理手法にRiverpodを、
バックエンドにMongo DBを用いて、共有機能を実装しています。
Flutter大学メンバーがリリースしたアプリ
マンメモ ~ 人を覚えるのが苦手な人へ ~
https://apps.apple.com/app/マンメモ/id1624843846
牧さんにより、人を覚えるのが苦手な人向けメモアプリ、
『マンメモ』がリリースされました!
名前や年齢、誕生日など、人の情報に特化したメモアプリとなっています。
シンプルかつわかりやすいUIで、
使いやすいアプリだと思いました!
ユー・フィール・チャート ~気持ちの浮き沈み表示アプリ~
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/60f79a42fa1349a1071d0367ba73f660.png)
JboyHashimotoさんにより、気持ちの浮き沈み表示アプリ、
『ユー・フィール・チャート』がリリースされました!
喜怒哀楽のようなパラメータを登録することで、
そのデータがグラフ化されて表示されるアプリとなっています。
バックエンドとしてFirebaseを、
状態管理手法としてriverpod等を使って作成したとのことです!
こちらについて、記事でも紹介されています。
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/58c565d6419ab930980ef0151a40f78b.png)
Flutter大学メンバーによる記事
初心者 Flutter x MySQL8 に挑戦する with mysql_client
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9JUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUUzJTgwJTgwRmx1dHRlciUyMHglMjBNeVNRTDglMjAlRTMlODElQUIlRTYlOEMlOTElRTYlODglQTYlRTMlODElOTklRTMlODIlOEIlMjAyNCUyMHdpdGglMjBteXNxbF9jbGllbnQmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPWE2YTRmYWVjMThkNjJjYmM5YjRhMmVhZWM2ZDQwYjZi&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZG9uZ3JpNzI3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wYWQ1MzMyZDNkNjlhY2Q3MDdiYzZhYjUyNzVmZTM5NA&blend-x=142&blend-y=491&blend-mode=normal&s=96e4560577577a719f92212a3ecc8d94)
FlutterとMySQL8の組み合わせに挑戦している様子が書かれた記事です。
今回はenv ファイルの導入に挑戦した内容が書かれています。
【Flutter】SliverAppBarを触ってみた
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9JUUzJTgwJTkwRmx1dHRlciVFMyU4MCU5MVNsaXZlckFwcEJhciVFMyU4MiU5MiVFOCVBNyVBNiVFMyU4MSVBMyVFMyU4MSVBNiVFMyU4MSVCRiVFMyU4MSU5RiZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9NTNmNWY2MmQ3NDZmNDI3NzZiMjMxOTM4ZDFhMWZiN2U&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwdGFpc2VpX2RldiZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9MDgwNjU0ZGI2OTBlM2MxM2RhNTMzMGFiZGQ2MzE0ZWM&blend-x=142&blend-y=491&blend-mode=normal&s=7fc0db34a1ee037ccf2f2dfcc464eaf8)
SliverAppBar
の使用方法について書かれた記事です。
GIF付きでSliverAppBar
の各プロパティでどのようなことができるか、解説がなされています。
Sample App of Flutter3 x MySQL8 with mysql_client
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9U2FtcGxlJTIwQXBwJTIwb2YlMjBGbHV0dGVyMyUyMHglMjBNeVNRTDglMjB3aXRoJTIwbXlzcWxfY2xpZW50JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWNsaXA9ZWxsaXBzaXMmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz04OWIwODc3MTUyNGRhZGU3YzQ4YzFhNDRmZjQ0YzQ3Nw&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZG9uZ3JpNzI3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wYWQ1MzMyZDNkNjlhY2Q3MDdiYzZhYjUyNzVmZTM5NA&blend-x=142&blend-y=491&blend-mode=normal&s=e1b2b7cde7f0eeb0fb0ee1177cb87fef)
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9U2FtcGxlJTIwQXBwJTIwb2YlMjBGbHV0dGVyMyUyMHglMjBNeVNRTDglMjB3aXRoJTIwbXlzcWxfY2xpZW50JTIwJTIwMiZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9MmZmNWM2M2M2NTEwZTI1MGQ5ODlhNzA4Mjg5ODEwMjA&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZG9uZ3JpNzI3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wYWQ1MzMyZDNkNjlhY2Q3MDdiYzZhYjUyNzVmZTM5NA&blend-x=142&blend-y=491&blend-mode=normal&s=f37ff258fc6404591868fe784d492a52)
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9U2FtcGxlJTIwQXBwJTIwb2YlMjBGbHV0dGVyMyUyMHglMjBNeVNRTDglMjB3aXRoJTIwbXlzcWxfY2xpZW50JTIwMyZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9NDMyYmQ4OTVjN2ViZjMzZWY1ODI1M2M0NGY3NDQzYTc&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZG9uZ3JpNzI3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wYWQ1MzMyZDNkNjlhY2Q3MDdiYzZhYjUyNzVmZTM5NA&blend-x=142&blend-y=491&blend-mode=normal&s=fc18d3f8c57a8757c196ded4f87c7a27)
Flutter とMySQL8の組み合わせについて、
実際に動くサンプルアプリを紹介している記事です。
ゼロから詳細にコードが紹介されており、それぞれのコードに対し解説もなされています。
【Flutter】flutterfire_cli を使って Dart コードのみで環境分けする
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/5bb66569c84de2e290ba5cc109096e83.png)
Flutterプロジェクトに対するFirebase の初期設定ツール、FlutterFire CLIを使用して、
開発環境分けをする方法について書かれた記事です。
Firebase.initializeApp
について、Dartコードのみでの環境分けの方法が紹介されています。
週刊Flutter大学の記事
先週週刊Flutter大学に追加された記事は以下になります。
まとめ
本記事ではFlutterニュースとして、
2022年9月第2週に話題になったFlutter関連の情報や、
アップされた記事、YouTube動画の紹介を行いました。
この記事が、みなさんのFlutterアプリ開発の一助となれば幸いです。
編集後記(2022/9/12)
今週のFlutterニュースでした。
今週のニュースでは、Sliverが2つほど話題に上がりました。
Sliverは便利な反面、少しわかりずらいところがあるので、
いつか記事化できたらなと思います。
個人的には、Flutter Gakkaiでの以下の動画がオススメです。
ぜひ併せて確認してみて下さい。
週刊Flutter大学では、Flutterに関する技術記事、Flutter大学についての紹介記事を投稿していきます。
記事の更新情報はFlutter大学Twitterにて告知します。
ぜひぜひフォローをお願いいたします。