Flutterウィークリー #16

# Flutterウィークリーとは？
FlutterファンによるFlutterファンのためのニュースレター
https://flutterweekly.net/

この記事は#16の日本語訳です
https://mailchi.mp/2d5f2e1d7e04/flutter-weekly-237585


# 読み物＆チュートリアル

### モーダルプログレスインジケーターを作り方
https://codingwithjoe.com/flutter-how-to-build-a-modal-progress-indicator/
Flutterでプログレスインジケーターを作るチュートリアル

![How to Build a Modal Progress Indicator](https://qiita-image-store.s3.amazonaws.com/0/129712/b225b3a8-7fd4-9c9c-098d-bdac893d7f75.png)

### 無限リストビュー
https://marcinszalek.pl/flutter/infinite-dynamic-listview/
Flutterで無限にするコールできるListViewを作る方法

![Infinite dynamic listview](https://qiita-image-store.s3.amazonaws.com/0/129712/ec44cc21-0001-bb9f-c16f-dc7d985d36df.gif)


### Flutterアプリのテスト
https://medium.com/@muhammedsalihguler/testing-flutter-applications-f961969da86a
Flutterアプリのコードをどのようにしてテストしてロックなアプリを作るかを紹介

### Flutter版: Reduxは不要かも
https://medium.com/@chimon1984/you-might-not-need-redux-the-flutter-edition-9c11eba006d7
setState, スコープモデル、ReduxをFlutterで使う方法

### Xamarinデベロッパーの為のFlutter
https://medium.com/@imthepk/flutter-for-an-android-xamarin-app-developer-b2fc1d17dd6
Xamarinデベロッパーから見たFlutterに関する面白い考察

### Flutterでアナログ時計を作る
https://medium.com/@NPKompleet/creating-an-analog-clock-in-flutter-i-68def107d9f4
4部構成でアナログ時計を作るための記事

![Creating an Analog Clock in Flutter](https://qiita-image-store.s3.amazonaws.com/0/129712/980df379-a5fa-30fb-be10-c9e917003886.gif)

### Flutterログインアニメーション
https://blog.geekyants.com/flutter-login-animation-ab3e6ed4bd19
Flutterで作ったログインページ用のアニメーションのサンプル

![Flutter Login animation](https://qiita-image-store.s3.amazonaws.com/0/129712/dc8c986d-8dc6-6534-af1e-309f8775957f.png)

### Flutterを試してみた
https://www.evernote.com/shard/s12/sh/1192435f-c2c2-4bbf-817c-1d2597f060ee/17099c74e9beff36
EvernoteチームがFlutterを動かして試してみた情報をまとめた記事

# ビデオ＆メディア

### Flutterチャレンジ: 天気予報
https://youtu.be/GFRfSM4yA9U
おなじみFlutteryのFlutterチャレンジ、今回は美しい天気予報アプリの作り方

<img width="299" alt="Flutter Challenge: Weather Forecast with Rain" src="https://qiita-image-store.s3.amazonaws.com/0/129712/c56b2cf0-686e-b975-82d0-e0091be27fca.png">


### Flutter: 美しいマテリアルスプラッシュスクリーンを作る | Dart 2
https://youtu.be/FNBuo-7zg2Q
スプラッシュスクリーンをDart 2で作る方法

<img width="290" alt="Screen Shot 0030-05-24 at 19.17.10.png" src="https://qiita-image-store.s3.amazonaws.com/0/129712/519f8a0f-f682-a325-298d-64f7a94fa87a.png">


### Flutter: ログイン、登録のFirebase実装 - Part 2
https://youtu.be/BNOUtPSN-kA

Firebaseを使ったログイン＋登録フローの実装手順をまとめたチュートリアル

<img width="805" alt="Flutter: Login, Registration & Firebase Integration" src="https://qiita-image-store.s3.amazonaws.com/0/129712/062e48e9-2ad5-a5dc-dc32-25d3804bb8bb.png">


# ライブラリ＆コード

### CatBox — Flutterで作ったネコの里親探しアプリ
https://medium.com/@t04glovern/catbox-cat-adoption-app-in-flutter-de017f19cd57
Flutterで作ったネコの里親探しアプリを紹介した記事、コードはgithubで公開していて、このアプリの作り方をベースにFlutterでのアプリ開発を教えてくれるUdemyのコースも作成したらしい

![CatBox — Cat Adoption App in Flutter](https://qiita-image-store.s3.amazonaws.com/0/129712/c4e28508-66f0-c295-3950-5eb983698704.png)

### Flutterトースト
https://github.com/PonnamKarthik/FlutterToast
AndroidとiOS両方で動作するトーストプラグイン

### get_version
https://github.com/AppleEducate/get_version
アプリのバージョン情報を取得するFlutterプラグイン

<img width="375" alt="get_version" src="https://qiita-image-store.s3.amazonaws.com/0/129712/ab7e5a07-acf9-ee08-fc14-a6b104aae157.png">

### bitrise.ioでFlutterをビルドする手順
https://github.com/DroidsOnRoids/bitrise-step-flutter
Bitrise.io CIでFlutterアプリをビルドするためのインストラクション

### Flutter WebRTC DataChannel plugin
https://github.com/Piasy/FlutterWebRTCDataChannel
FlutterでWebRTC DataChannelを使ってP2P接続を実現するためのプラグイン

![Flutter WebRTC DataChannel plugin](https://qiita-image-store.s3.amazonaws.com/0/129712/c5515816-519f-a184-44a3-e116f0484fd6.png)

### Gametime
https://github.com/mitchhymel/gametime-flutter
ゲームのアクティビティをトラッキングするためのFlutterアプリ。Flutterでクライアント、Google Cloud Firestoreでバックエンドのデータストア、Cloud Functions for FirebaseでAPI、Flutter Reduxでアプリ内のステータス管理を行っています

<img width="687" alt="Gametime" src="https://qiita-image-store.s3.amazonaws.com/0/129712/0bcd34d0-772b-fc88-ff9a-6243a56d70e9.png">