8

インターネットから投稿をjsonとして取得するアプリを作成しています。ファクトリを使用して、フラッターで json を Post オブジェクトに解析します。Post オブジェクトには、タイトル、本文、および画像が含まれます。リストビュー ビルダーを使用して、これらの投稿をリストビューに表示します。大変な作業は、画像から 2 つの主要な色を計算して、投稿アイテムの背景グラデーションとして設定することです。これには、https ://pub.dartlang.org/packages/palette_generator を使用します。

必要な情報をすべて備えた完全な Post オブジェクトがあるため、json パーサー ファクトリで 2 つの支配的な色を計算します。また、この方法では、Post オブジェクトをレンダリングするときに色を計算する必要がありません。私は次のコードでこれを行います：

Future<List> _getColors() async {
  Color gradientOne, gradientTwo;
  String imageUrl = json['image'];

  paletteGenerator = await PaletteGenerator.fromImageProvider(
      CachedNetworkImageProvider(imageUrl));

  gradientOne = paletteGenerator.colors.toList()[0];
  gradientTwo = paletteGenerator.colors.toList()[1];

  return [gradientOne, gradientTwo];
}

これを Post オブジェクトに追加し、レンダリングでこの未来を待ちます。

post.gradientColors
    .then((result) => {
          gradient = result,
          this.setState(() {
                  loading = false;
                })
        })

メイン UI では、すべての先物が解決されるまでロード インジケーターを表示します。このために、次のコードを使用します。

List<Future> futures = [];

  for (var post in tmpList) {
    futures.add(post.gradientColors);
  }
  await Future.wait(futures)
      .then((result) => {list.addAll(tmpList)});
}

これは、新しい投稿を取得するときの遅延 UI を除いて問題なく動作します。少し読んだ後、Flutter で Isolates を使用できることがわかりました。そこで、ここで説明するように解析関数を変更しました: https://flutter.io/docs/cookbook/networking/background-parsing

これは問題なく動作し、アプリは遅延なく実行されています。欠点は、色が計算されないことです。何らかの理由で、compute() を使用すると、Future が結果になりません。

この状況で計算を使用することは可能ですか、それとも UI で遅延を発生させずに色を計算するより良い方法はありますか?

編集

Isolate を計算せずにプログラミングしようとしましたが、色の先物がまだロードされません。これは私が使用したコードです：

ReceivePort receivePort = ReceivePort();
Isolate isolate = await Isolate.spawn(getMorePosts, receivePort.sendPort);
receivePort.listen((data) {
  list.addAll(data);
});

私はすべてのデータを受け取りますが、やはり先物は終了しません。

4

1 に答える 1