『Flutterの最新情報をキャッチアップしたい!』
そんなあなたに送る、 Flutterニュース 。
本記事ではFlutterニュースとして、2022年8月第5週〜9月第1週に話題になったFlutter関連の情報や、
アップされた記事、YouTube動画の紹介を行います。
読むだけでFlutterの最新情報がキャッチアップできます。 ぜひ読んでみてください!
- Flutter公式情報
- Flutterに関する話題
- Flutterに関する記事
- Flutter大学メンバーがリリースしたアプリ
- Flutter大学メンバーによる記事
- 初心者 Flutter x MySQL8 に挑戦する with mysql_client
- ボタンのグレーアウトのロジックを考えてみた!
- 次のページに値を渡す
- shared_preferencesについて学ぶ🤔
- 【Flutter】夏が終わる前におれと波に乗らないか?【アニメーション】
- FlutterでAppleSignを実装する
- GoogleSignInを実装する
- FlutterでBottomNavigationBarを作る
- StreamProviderでListを使う
- Flutterで折線グラフを作ってみた!
- flutter_dotenv:FlutterWebデプロイ時に’.env’が読み込まれない
- flutter_hooksでATT(App Tracking Transparency)
- DropdownButtonで配列について学ぶ
- 週刊Flutter大学の記事
- まとめ
- 編集後記(2022/9/5)
Flutter公式情報
Flutter 3.3 / Dart 2.18 リリース!
stableチャンネルにて Flutter 3.3 / Dart 2.18 がリリースされました。
テキストを選択可能にするSelectionArea
ウィジェットなど、
様々な追加がなされています。
Flutter Vikings 開催
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/48925828cf59975a0d2e4c78d7d86fe5.jpg)
Flutter コミュニティでも最大級のカンファレンス、Flutter Vikingsが8/31, 9/1に開かれました。
オフライン、オンラインの同時開催で、
こちらのYouTubeチャンネルにて公演を見返すことが可能です。
Flutterアプリのパフォーマンスの測り方、向上のさせ方
Flutterアプリのパフォーマンスの測り方、工場のさせ方についてのミートアップが
開催されます。
日本時間で9/6 9/13(火)午前9:00からの開催予定となっています。
TextStyle (今週のパッケージ)
Flutter 公式のパッケージ紹介動画シリーズ、Package of the Week の最新動画が更新されました。
今回はパッケージではありませんが、
Textの装飾面で重要となるTextStyle
についての紹介動画となっています。
Flutterに関する話題
adaptive_scaffold パッケージ
GitHub上でFlutter のパッケージにadaptive_scaffoldが追加されました。
このScaffoldを使って色々な画面サイズに即座に対応できるレイアウトが実装可能になるようです。
残像つきスクロールの実装
Flutter にて残像が残るようなスクロールの実装デモの動画ツイートが話題となっていました。
Tweetのスレッドにてデモアプリのソースコードを確認することが可能です。
Flutterに関する記事
Zapp!でFlutterアプリをWebブラウザだけで開発する
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9WmFwcCUyMSVFMyU4MSVBN0ZsdXR0ZXIlRTMlODIlQTIlRTMlODMlOTclRTMlODMlQUElRTMlODIlOTJXZWIlRTMlODMlOTYlRTMlODMlQTklRTMlODIlQTYlRTMlODIlQjYlRTMlODElQTAlRTMlODElOTElRTMlODElQTclRTklOTYlOEIlRTclOTklQkElRTMlODElOTklRTMlODIlOEImdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTQ3MGM3MTQzMWM0NGI0MzVmMzIyNDdhNmRiYTdiZGUx&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZ29vZm1pbnQmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPWM3NjI4ZTUwMGU3YmU5NzcyYmRiMmYwZTAyMTdlMTk1&blend-x=142&blend-y=491&blend-mode=normal&s=576e937d0d385bee8974642155fac9b6)
ブラウザ上でFlutterを動かせる環境のZapp!の紹介記事です。
Zapp! の様々なパッケージをインストールできる特徴を利用し、
サンプルアプリを作成して紹介されています。
Flutter 製 非公式Ubuntu ソフトウェア配布アプリ
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/587fe67876f5ec6f9352e2ea6da20a1e.jpg)
Flutterで作られた非公式のUbuntu ソフトウェア配布アプリについて紹介している記事です。
記事内で外見等を見ることが可能です。
こちらのGitHubにてソースコードを見ることができます。
Flutter Vikings おすすめ講演の紹介
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/f5a7671a0a8e5e3fa2c0b6f3420b7711.png)
8/31 ~ 9/1 に開催されたFlutter Vikingsに対し、
CodeMagic オープンソースチームが開催前に厳選した講演を紹介している記事です。
合計11もの講演が概要とともに記事内で紹介されています。
Flutter大学メンバーがリリースしたアプリ
Flashwords ~反復学習向きのマイ単語帳~
okbさんにより、反復学習向きのマイ単語帳、
『Flashwords』がリリースされました!
昔ながらの単語帳をそのままアプリに落とし込んだような内容で、
自分の好きなように単語の設定等ができるようになっています。
単語帳をひっくり返すアニメーションが癖になる、
勉強にピッタリのアプリだと思いました!
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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9JUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUUzJTgwJTgwRmx1dHRlciUyMHglMjBNeVNRTDglMjAlRTMlODElQUIlRTYlOEMlOTElRTYlODglQTYlRTMlODElOTklRTMlODIlOEIlMjAyMCUyMHdpdGglMjBteXNxbF9jbGllbnQmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPThjNDI1ODMzZDllODllNzg4Y2Y2Y2Q4ZWFlYWFhN2U3&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZG9uZ3JpNzI3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wYWQ1MzMyZDNkNjlhY2Q3MDdiYzZhYjUyNzVmZTM5NA&blend-x=142&blend-y=491&blend-mode=normal&s=ac76f2aee2b79ab32557eddc1541ec25)
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9JUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUUzJTgwJTgwRmx1dHRlciUyMHglMjBNeVNRTDglMjAlRTMlODElQUIlRTYlOEMlOTElRTYlODglQTYlRTMlODElOTklRTMlODIlOEIlMjAyMSUyMHdpdGglMjBteXNxbF9jbGllbnQmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTA4Y2Q2MGRmYmVlODYxNDQyNWFiMGQ5NGQ5MTk3NzA1&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZG9uZ3JpNzI3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wYWQ1MzMyZDNkNjlhY2Q3MDdiYzZhYjUyNzVmZTM5NA&blend-x=142&blend-y=491&blend-mode=normal&s=aa4d1b914ccac3211453582aa4e7b6ef)
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9JUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUUzJTgwJTgwRmx1dHRlciUyMHglMjBNeVNRTDglMjAlRTMlODElQUIlRTYlOEMlOTElRTYlODglQTYlRTMlODElOTklRTMlODIlOEIlMjAyMiUyMHdpdGglMjBteXNxbF9jbGllbnQmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTM5ZWUyYTEzOWQzNTEyMWE3NzBhZDBhZGFmNjU3OWY0&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZG9uZ3JpNzI3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wYWQ1MzMyZDNkNjlhY2Q3MDdiYzZhYjUyNzVmZTM5NA&blend-x=142&blend-y=491&blend-mode=normal&s=96676fe1e38b3a9ad5795201ff5e6509)
![](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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9JUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUUzJTgwJTgwRmx1dHRlciUyMHglMjBNeVNRTDglMjAlRTMlODElQUIlRTYlOEMlOTElRTYlODglQTYlRTMlODElOTklRTMlODIlOEIlMjAyMyUyMHdpdGglMjBteXNxbF9jbGllbnQmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTBkMjNlYjI3MmQ2ZDMzZDBjZjkyODYxYTZlZWU5NmI2&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZG9uZ3JpNzI3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wYWQ1MzMyZDNkNjlhY2Q3MDdiYzZhYjUyNzVmZTM5NA&blend-x=142&blend-y=491&blend-mode=normal&s=a4cc41bd07bd85ed748b8a885ee46447)
Flutter とMySQL8との組み合わせについて、
筆者が苦戦しながらもアプリを作成していく体験談について紹介している記事です。
今回はListの扱い方や、自作WidgetでのWidgetの切り出しに挑戦している様子が
書かれています。
ボタンのグレーアウトのロジックを考えてみた!
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/756a36c4874241f049e828b7bd9444b3.png)
TextField への値の入力されていないときにボタンがグレーアウトして押せなくなるような
UIの実装方法について書かれた記事です。
サンプルコードをベースに紹介がなされています。
次のページに値を渡す
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/4eae181fa805fab561ce7b3ee048158f.png)
次のページに値を渡す画面遷移の仕方について書かれた記事です。
サンプルコードと画像付きで紹介がなされています。
shared_preferencesについて学ぶ🤔
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/e4ed51208e6d1a9f87a97c8744480a28.png)
shared_preferences の使い方について学んだことを書いた記事です。
自作のサンプルアプリを紹介し、保存、参照、削除の処理の実装方法を紹介しています。
【Flutter】夏が終わる前におれと波に乗らないか?【アニメーション】
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/2d28664de522b9367324d16f42fac0fd.png)
Flutter で実装した波乗りアニメーションの実装方法の解説記事です。
上下運動アニメーションの実装に置いてAnimationController
を使った方法について、
詳細に解説がなされています。
FlutterでAppleSignを実装する
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/08c6d66bf51173fba4f841050446610a.png)
Apple アカウントでのサインインの実装方法について書かれた記事です。
Dartコード以外の設定部分についても解説がなされています。
GoogleSignInを実装する
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/259b46a4a18231e5d06e61ef957966b1.png)
Google アカウントでのサインインの方法について書かれた記事です。
デバイスがAndroid / iOS 、それぞれに対し、設定から解説がなされています。
FlutterでBottomNavigationBarを作る
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/fb2ec18ed6a3e50afebae4bfa3924a69.png)
BottomNavigationBarでの画面遷移実装について書かれた記事です。
Riverpod を使用した画面パラメータの管理方法について、
サンプルコードをベースに紹介がなされています。
StreamProviderでListを使う
![](https://res.cloudinary.com/zenn/image/upload/s--il0n56gO--/c_fit%2Cg_north_west%2Cl_text:notosansjp-medium.otf_55:StreamProvider%25E3%2581%25A7List%25E3%2582%2592%25E4%25BD%25BF%25E3%2581%2586%2Cw_1010%2Cx_90%2Cy_100/g_south_west%2Cl_text:notosansjp-medium.otf_37:Jboy%2Cx_203%2Cy_98/g_south_west%2Ch_90%2Cl_fetch:aHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyLzNjOTBiY2M0M2YuanBlZw==%2Cr_max%2Cw_90%2Cx_87%2Cy_72/og-base.png)
FirestoreのデータをStreamで取得してListViewにて表示する方法について書かれた記事です。
ミニマムなサンプルアプリでコードの紹介がなされています。
Flutterで折線グラフを作ってみた!
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/9c4f13ae821d4ddae012d0981fb6509f.png)
fl_chartパッケージを使用して折れ線グラフを表示する方法について書かれた記事です。
スマホの画面上に指定した点を通るグラフを表示する方法について書かれています。
flutter_dotenv:FlutterWebデプロイ時に’.env’が読み込まれない
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/fa9984339008aafab2fd91902bcaf869.png)
flutter_dotenv にてFlutterWebデプロイ時に”dot.env”ファイルが読み込まれない際の
対処方法について書かれた記事です。
筆者が調べてわかった対処方法について、端的に述べられています。
flutter_hooksでATT(App Tracking Transparency)
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/e9ca9925c2139c796b0ed31369f38a28.png)
iOSで広告を出す際に重要となる、
App Tracking Transparency のダイアログの出し方について書かれた記事です。
Riverpodでの実装方法について、サンプルコードをベースに紹介されています。
DropdownButtonで配列について学ぶ
![](https://blog.flutteruniv.com/wp-content/uploads/cocoon-resources/blog-card-cache/e97b5f360cb7b956ccdc72ffdce4a539.png)
DropdownButton とListのmap関数を使ってサンプルアプリを紹介している記事です。
筆者が学んだ内容をサンプルアプリのコードにて紹介されています。
週刊Flutter大学の記事
先週週刊Flutter大学に追加された記事は以下になります。
まとめ
本記事ではFlutterニュースとして、
2022年8月第5週〜9月第1週に話題になったFlutter関連の情報や、
アップされた記事、YouTube動画の紹介を行いました。
この記事が、みなさんのFlutterアプリ開発の一助となれば幸いです。
編集後記(2022/9/5)
今週のFlutter ニュースの記事でした。
Flutter Vikings、ついに開催されましたね!
この記事を読んでいる方の中でも注目されていた方多いのではないでしょうか?
自分はRiverpod 2.0 の講演に注目して見ていました。
とても驚きが多かったのと同時に、
発表の上手さに感服しました。
いつか、自分もこのような場所で講演できるくらい、
Flutterコミュニティに貢献して、
知識を深めていきたいものです。
あなたはどの講演が気になりましたか?
ぜひご意見をお聞かせください。
週刊Flutter大学では、Flutterに関する技術記事、Flutter大学についての紹介記事を投稿していきます。
記事の更新情報はFlutter大学Twitterにて告知します。
ぜひぜひフォローをお願いいたします。