週刊 Dart & Flutter インプット 27

ntaoo
12 min readJul 17, 2020

--

https://cdn-images-1.medium.com/max/1760/1*L7Mmc_dhEiJfS_kHXhj4rQ.png

毎週金曜日に、@ntaoo がインプットしたDart & Flutterの情報のリンク集をまとめて共有します。

Introducing a brand new pub.dev | Dart

  • マテリアルデザインのもと、サイトデザインを洗練
  • Flutter用のパッケージを検索する際、Android, iOS, Web 用のフィルターを提供。Advanced Optionとして、Linux, macOS, Windows のフィルターもあり。
  • パッケージの評価指標を、コミュニティベースの人気投票に加えて、pub pointsという指標で詳細化して明示。Dartの慣習に従っているか、ドキュメントを提供しているかなどで機械的に評価。

Update the state management Options page (#4346) · flutter/website@2d65137

package:providerを推奨する文言が追加されました。 各手法への一行の説明文が追加されました。

Flutter Meet Up Tokyo

Flutter Meet Up Tokyoのスライドをすべて拝見しました。Add to App まわりはなんもわからんので、あまりやりたくはないですけどもしもそれが必要な事態に直面したら、ふたつのスライドをまっさきに見返します。GraphQLは導入する機会、いつかどこかであるかなー。

既存iOS/AndroidアプリにFlutterを追加する — Google Slides

Flutter with Platform — Speaker Deck

【Online】Flutter Meetup / FlutterでFirebaseの機能を活用しよう #gdgtokyo #flutter_meetup_tokyo — Speaker Deck

GraphQLを使ってアプリを作っている話 / The story of building an app using GraphQL — Speaker Deck

FFmpeg Tool with Flutter. FFmpeg is a multiplatform, open-source… | by ßãssãnt Adél | Hamza Solutions | Jul, 2020 | Medium

FFmpegとはなにか、そのライブラリ群、コマンドサンプル、および package:flutter_ffmpeg の紹介。 package:flutter_ffmpegには、node.js の fluent-ffmpeg パッケージにあるようなようなラッパーAPIは提供されず、execute() メソッドに ffmpeg のコマンド文字列を渡す方法になっています。潔い。

Dart Academy

Dart 1時代には著名で Dart 2時代では更新が停滞していたサイトが、最近更新を再開しています。内容は、人口に膾炙しているほうの「オブジェクト指向」のデザインパターンを Dart で解説するシリーズが中心です。すこし内容を確認しましたが、入門者、初心者向けに基本から丁寧に解説している印象。

Anchored Custom Routes. How to implement a route which anchors… | by Gabriel Terwesten | Flutter Community | Jul, 2020 | Medium

Dribble に掲載さている UI を Flutter で実装してみた系記事。

Implementing complex UI with Flutter — Marcin Szałek | Flutter Europe — YouTube

素人が知識ゼロから2ヶ月ちょっとでFlutterアプリをリリースした過程 — Qiita

たくさんの先行の記事を参考にされて2ヶ月で作って公開したそうで、そのストーリーを記事にされています。このアプリのコンセプト良いですね。

pedromassango/build_context: Access most used properties in your BuildContext instance.

BuildContext にこういった雑多な拡張メソッドを生やしていくのは、単純に読みにくいし書き方の統一性が崩れる恐れがあるのであまり良いアイデアとは思えないんですけど、どうなんでしょう?

Flutter Hooks, say goodbye to StatefulWidget and reduce boilerplate code. | by Jimmy Aumard | Flutter Community | Jul, 2020 | Medium

React Hooks の移植となる Flutter Hooks の紹介記事。

Hooks にライフサイクルを隠蔽するアイデアについては、そのメリットは理解できますが、 単純に class で機能をくくり出すだけでかなり見通しがよくなるので、StatefulWidget のままでも実際に私は困っていないですし、この分野で Flutter フレームワーク組み込みでないもので冒険したくない気持ちがあります。

もしも Hooks を採用するならば、一貫性を保つためにいずれは アプリのなかの全ての StatefulWidget と StatelessWidget を HookWidget に置き換えるべきなのではと思いますが、とてもそこまで実行する思い切りを持てません。私が保守的すぎるのかもしれません。

Hooks について、さまざまな観点から長い議論がされています。

React Hooksのカスタムフックが実現する世界 — オブジェクト指向とOSS — Qiita

What is Equatable package in Dart and Flutter | by Jehad Nasser | Flutter Community | Jul, 2020 | Medium

== operator と hashCodeの override methodを書かなくても済むようになるので、ValueObject を作るときに便利。

仮に Entity にも適用するならば、こんな感じでしょうか。

import 'package:equatable/equatable.dart';abstract class Entity<T> extends Equatable {
T get id;
@override
List<Object> get props => [id];
}

class SomeEntity extends Entity<String> {
final String id;
SomeEntity(this.id);
}

main() {
print(SomeEntity('a') == SomeEntity('a')); // true.
}

Extends の使用を他の用途のために空けておく必要があるならば、以下になりそう。

import 'package:equatable/equatable.dart';

mixin Entity<T> on EquatableMixin {
T get id;
@override
List<Object> get props => [id];
}

class SomeEntity with EquatableMixin, Entity<String> {
final String id;
SomeEntity(this.id);
}

main() {
print(SomeEntity('a') == SomeEntity('a')); // true.
}

mixinを他のmixinと合成しておけないのが惜しいですね。

ひとつの id フィールドだけならば、以下の実装で良さそうです。

import 'package:equatable/equatable.dart';

mixin Entity<T> {
T get id;
@override
bool operator ==(Object other) =>
runtimeType == other.runtimeType && other is Entity && id == other.id;
int get hashCode => id.hashCode;
}
class SomeEntity with Entity<String> {
final String id;
SomeEntity(this.id);
}

main() {
print(SomeEntity('a') == SomeEntity('a')); // true.
}

はやく Value ( = deeply immutable object ) 相当の言語仕様策定が進んでほしいです。

情報源

https://twitter.com/ntaoo が、followさせていただいている方々

最新の情報を中心にしますが、少し古めでも私が見つけた際に有益と判断した情報も載せていきます。情報の網羅性の高さは不明です。継続を重視して省力化しています。

  • 公式情報は優先順位最高にして載せます。
  • それら以外の情報は、私の関心に基づいて適当に間引きます。
  • 基礎は、https://dart.dev/codelabs , https://flutter.dev/docs , Udemyなどのオンラインビデオトレーニングコース、または書籍などで体系的に学んで習得しましょう。

--

--