在同一小部件​​中增加多个时间戳-Flutter

Question

我正在寻找一种方法来计算以下每个时间戳所经过的时间。我有一种使用流的基本方法，但无法弄清楚如何实现它。 counterStream.listen每秒显示一个递增的值。

Widget _changeTimestamp(timestamp) {
  var counterStream =
      Stream<int>.periodic(Duration(seconds: 1), (x) => timestamp + x);
  counterStream.listen(print);
}


return Scaffold(
    body: ListView(
  padding: const EdgeInsets.all(8.0),
  children: <Widget>[
    Container(
      height: 50,
      color: Colors.amber[600],
      child: Center(child: _changeTimestamp(1562499809820)),
    ),
    Container(
      height: 50,
      color: Colors.amber[500],
      child: Center(child: _changeTimestamp(1562499766191)),
    ),
  ],
)
    );

Answer 1

您可以采用多种方法来实现这一目标。我已经使用Stream构建器来做到这一点。

首先，我重构了您的_changeTimestamp方法，使其返回Stream中的int

Stream<int> _changeTimeStamp(int milliseconds) async* {
  yield* Stream<int>.periodic(
    Duration(seconds: 1),
    (period) => milliseconds + period,
  );
}

现在我所要做的就是在StreamBuilder中使用ListView小部件，该小部件是Stream的源泉

@override
Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
      body: ListView(
        children: <Widget>[
          Container(
            height: 50,
            color: Colors.amber[600],
            child: Center(
              child: StreamBuilder<int>(
                stream: _changeTimeStamp(2738942),
                builder: (context, snapshot) {
                  if (snapshot.hasData) {
                    int timestamp = snapshot.data;
                    String formattedTimestamp = _formatTimestamp(timestamp);
                    return Text('$formattedTimestamp');
                  }
                  return CircularProgressIndicator();
                },
              ),
            ),
          ),
        ],
      ),
    ),
  );
}

您可以通过设置自定义方法或使用timeago之类的插件来设置时间戳的格式。

String _formatTimestamp(int timestamp) {
  // Format your timestamp here
}