Flutterウィークリー #56

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

この記事は#56の日本語訳です
https://mailchi.mp/flutterweekly/flutter-weekly-56

※Google翻訳を使って自動翻訳を行っています。翻訳に問題がある箇所を発見しましたら編集リクエストを送っていただければ幸いです。


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

### デスクトップシェル
https://github.com/flutter/flutter/wiki/Desktop-shells

<img src="https://repository-images.githubusercontent.com/31792824/fb7e5700-6ccc-11e9-83fe-f602e1e1a9f1" />
現在のステータスがDesktop FlutterプロジェクトのWikiページ


### Flutterページルート遷移について知っておくべきことすべて
https://medium.com/flutter-community/everything-you-need-to-know-about-flutter-page-route-transition-9ef5c1b32823

<img src="https://cdn-images-1.medium.com/max/1200/1*WAl2w_h9BRPm1HfhNJ6mSA.png" />
Flutterページルートがどのように機能するかについてのDivyanshu Bhargavaによる詳細な分析。


### Flutterリストビューを作成する
https://medium.com/@jun.chenying/flutter-tutorial-part-2-building-a-listview-in-flutter-544b48c0fe5b

<img src="https://cdn-images-1.medium.com/max/1200/1*rwBWrfO2O_bpvsEb5m9L_w.png" />
Ying ChenによるFlutterリストの紹介。


### iOSアプリのコード署名と公開方法
https://blog.codemagic.io/how-to-code-sign-publish-ios-apps/

<img src="https://blog.codemagic.io/uploads/2019/04/CM-codesigning_1-1.jpg" />
Codemagicチームは、iOS用のFlutterアプリに署名して公開する方法を説明します。


### Flutter複数のGestureDetectorsを組み合わせる
https://medium.com/flutter-community/combining-multiple-gesturedetectors-in-flutter-26d899d008b2

<img src="https://cdn-images-1.medium.com/max/1200/1*RB_g072ilIhlE2bfvxKthA.png" />
David Anayaは、複数の検出器がある場合のジェスチャ検出の処理方法を説明しています。


### Flutter ：動的に作成されたフィールドを検証する方法
https://medium.com/flutter-community/flutter-how-to-validate-fields-dynamically-created-40cafca5c3cb

<img src="https://cdn-images-1.medium.com/max/1200/1*4wl9Axq2xryB0tOudhUikA.png" />
動的フィールドを作成する機能とFrancesco Mineoによる検証方法を持つフォームの例。


### HTTPデータを取得し、ListViewでJSONを解析する
https://medium.com/@jun.chenying/flutter-tutorial-part-4-http-fetch-data-and-parse-json-with-listview-ba0fb638a0fa

<img src="https://cdn-images-1.medium.com/max/1200/1*cNqXRi-lybJe2p15ujnOTg.png" />
APIから情報を取得してそれをリストビューに入れる方法を示す、Ying Chenによるチュートリアル。


### Flutterで条件付きアニメーションを接続する
https://medium.com/@felixblaschke/connecting-animations-with-conditions-in-flutter-8b9cb35a78b4

<img src="https://cdn-images-1.medium.com/max/1200/1*IP0pZREPcoLKamMjRASwTA.png" />
Felix Blaschkeは、起動または停止がアプリケーションの状態によって異なる場合のアニメーションの処理方法を説明します。


### お振込みZ（Part：1 / n）
https://dev.to/itzmeanjan/making-of-transferz-part-1-n-3mjf

<img src="http://dev.to/social_previews/article/102522.png" />
Anjan Royによる、デバイス間でファイルをワイヤレスで転送するためのアプリの作成方法に関する一連のチュートリアルの最初のものです。


### Flutter SharedPreferencesを使用する
https://medium.com/flutterdevs/using-sharedpreferences-in-flutter-251755f07127

<img src="https://cdn-images-1.medium.com/max/1200/1*d7_x3XnsC6FJXNHNx_seQg.png" />
Ashish Rawatが、SharedPreferencesライブラリを使用してアプリにキーと値のペアを格納する方法を説明します。


### 以下のためのHnefatafl Flutter
https://medium.com/@eibaan_54644/hnefatafl-for-flutter-42c05a174031

<img src="https://cdn-images-1.medium.com/max/1200/1*lOQwo-7bfCAmME3wEVLYrQ.png" />
Stefan Matthias AustがFlutter古代チェスのような北欧のゲームを再現する方法を説明します。


### Flutter ATDDを使った自動テスト
https://medium.com/flutter-community/automated-testing-using-atdd-in-flutter-21d4d0cf5df6

<img src="https://cdn-images-1.medium.com/max/1200/1*T8RKJCWkT9axYxsLeh_lqg.png" />
Flutterエンドツーエンドの受け入れテストを作成する方法に関するDarshan Kawarによるチュートリアル。


### マルチレベル依存ドロップダウン
https://medium.com/@afegbua/flutter-thursday-08-multi-level-dependent-dropdown-d965c08d2748

<img src="https://cdn-images-1.medium.com/max/1200/1*uD0leYKUjen4Q5S0k94u2A.png" />
Shuaib Afegbuaは、1つを選択すると別のオプションのリストが変更されたときに一連のドロップダウンを作成する方法を示します。


### 有効なBLoCパターン
https://medium.com/flutterpub/effective-bloc-pattern-45c36d76d5fe

<img src="https://cdn-images-1.medium.com/max/1200/1*XUDik4jakpEcQ6ZVm5jo3A@2x.png" />
Sagar SuriによるBLoCの使用時の「経験則」のリスト


### Flutter用の最も欠けているプラグイン/パッケージ
https://medium.com/@segaud.kevin/your-most-missing-plugins-packages-for-flutter-46988495f22d

<img src="https://cdn-images-1.medium.com/max/1200/1*8ruS9UNNQCFHc2UP9eB8uQ.jpeg" />
Kevin Segaudによる他のプラットフォームのFlutter見逃しているプラグインやパッケージの詳細なリスト。


### CustomPainterを使ってFlutter描画する
https://medium.com/flutter-community/drawing-in-flutter-using-custompainter-307a9f1c21f8

<img src="https://cdn-images-1.medium.com/max/1200/1*hkO0m1ZeBasgkKseAuYbzA.jpeg" />
Sharan Singhは、CustomPainterを使用して描画アプリケーションを作成する方法を説明しています。


### Kotlin Flowのシンプルなデザイン
https://medium.com/@elizarov/simple-design-of-kotlin-flow-4725e7398c4c

<img src="https://cdn-images-1.medium.com/max/1200/1*H3TJSKXwD79K-e4PFqPYBQ.png" />
Roman Elizarovが、 Flutter Flowがどのように機能するのか、そしてそれらをどのように使用するのかを説明します。


### リストビューのページ区切り、上にスクロールしてもっと読み込む
https://medium.com/@jun.chenying/flutter-tutorial-part-5-listview-pagination-scroll-up-to-load-more-ed132f6a06be

<img src="https://cdn-images-1.medium.com/max/1200/1*bd3TeCLGr05nHqh0xYXgcA.png" />
リスト内のページ区切りを処理する方法についてのYing Chenによるチュートリアル。


### FlutterとFastlaneによる継続的インテグレーションとデプロイメント
https://medium.com/@arneolaim/continuous-integration-and-deployment-with-flutter-and-fastlane-a927014723e1

<img src="https://cdn-images-1.medium.com/max/1200/1*pvgOhHrwt8HHP6dyKyxxZA.png" />
Arne Mollandが、 Flutterを使用してFastlaneをCIとして設定するための手順を説明します。


### でフレアとボタンのアニメーションを作成する方法Flutter ？
https://medium.com/flutter-community/how-to-create-button-animation-with-flare-in-flutter-part-1-create-your-first-animation-b1c61c81bc1c

<img src="https://cdn-images-1.medium.com/max/1200/1*Ij9U8FTcJvhtVZQGvvIqVA.png" />
Paulina SzklarskaによるFlare in Flutter使い方のシリーズの最初の記事。


# ビデオ＆メディア

### アニメーション下バー
https://www.youtube.com/watch?v=yDEwxjybkEM&feature=youtu.be

<img src="https://i.ytimg.com/vi/yDEwxjybkEM/maxresdefault.jpg" />
アニメーションを使って一番下のバーを作成する方法に関するビデオ


### Flutter StackOverflowアプリチュートリアル
https://www.youtube.com/watch?v=-MBWdZ1u8tQ&feature=youtu.be

<img src="https://i.ytimg.com/vi/-MBWdZ1u8tQ/maxresdefault.jpg" />
スタックオーバーフロー質問APIを使用してFlutter StackOverflow Appを作成する方法


### サーバー側検証を使用したFlutterフォーム
https://www.youtube.com/watch?v=A-CIeC743pA&feature=youtu.be

<img src="https://i.ytimg.com/vi/A-CIeC743pA/hqdefault.jpg" />
フォームデータをサーバーに送信して検証のフィードバックを表示する方法に関するチュートリアルです。


### Flutterでモデルを操作する
https://www.youtube.com/watch?v=iMo1M4RXrlw&feature=youtu.be

<img src="https://i.ytimg.com/vi/iMo1M4RXrlw/maxresdefault.jpg" />
モデルを使用してデータと機能を表現し、 Dart機能を使用してモデルをより良くします。


### ValueListenableBuilder（今週のFlutterウィジェット）
https://www.youtube.com/watch?v=s-ZG-jS5QHQ&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=32&t=0s

<img src="https://i.ytimg.com/vi/s-ZG-jS5QHQ/maxresdefault.jpg" />
データが変更されたときにUIを更新するには、ValueListenableBuilderを使用してください。


### フレアとFlutterクイックスタート
https://www.youtube.com/watch?v=Q-6es0GX0fs

<img src="https://i.ytimg.com/vi/Q-6es0GX0fs/maxresdefault.jpg" />
スマイリーフェイスのFlutter統合！ Flautアニメーションを作成してFlutter組み込む方法を示します。


### Flutter Tutorial  - アニメーション付きCustomPaintウィジェット
https://www.youtube.com/watch?v=nq_1thqa1jg

<img src="https://i.ytimg.com/vi/nq_1thqa1jg/maxresdefault.jpg" />
このビデオでは、FlutterアプリケーションでCustomPaintウィジェットを使用する方法と、それにアニメーションを組み合わせる方法を説明します。


# ライブラリ＆コード

### MarcioQuimbundo / uber_clone
https://github.com/MarcioQuimbundo/uber_clone

Flutter作られたUberライダーとドライバーのアプリのクローン。


### サルビー/モルフェウス
https://github.com/salby/morpheus

材料設計ナビゲーション遷移を簡単に実装するためのFlutterパッケージ。


### hush2 / master_mind
https://github.com/hush2/master_mind

Flutterマスターマインドゲーム


### フルカンテクタ/ analog_clock
https://github.com/furkantektas/analog_clock

Flutter用のアナログ時計ウィジェット


### RegNex / WalletUiApp
https://github.com/RegNex/WalletUiApp

<img src="https://repository-images.githubusercontent.com/183678855/fc039180-6877-11e9-8f74-1eaa557226c9" />
このプロジェクトはUplabs.comのデザインの実装です。