Flutter 每分钟自动刷新 JSON

Question

我在网上搜索了 Flutter 的自动刷新小部件和自动刷新 future JSON，但结果似乎都是下拉刷新。

我需要的是一个我可以调用的函数，并且该函数每分钟都会重复一次。

我知道我必须集成以下内容:

var future = new Future.delayed(const Duration(milliseconds: 10), TracksWidget());

但是我不确定需要把它放在哪里。

import 'dart:async';
import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import '../model/track.dart';

class TracksWidget extends StatefulWidget {
  @override
  _TracksWidgetState createState() => _TracksWidgetState();
}

class _TracksWidgetState extends State<TracksWidget> {
  Future<Track> track;

  @override
  Widget build(BuildContext context) {
    double c_width = MediaQuery.of(context).size.width;
    return new FutureBuilder<Track>(
      future: track,
      builder: (context, snapshot) {
        if (snapshot.hasData) {
          Track track = snapshot.data;
          return new Container(
              padding: const EdgeInsets.all(16.0),
              width: c_width,
              child: new Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                        Image.network(track.imageurl, width:200.0, height: 200.0,fit: BoxFit.cover),
                        Text(track.title),
                        Text(track.artist),
              ]),
          );
        } else if (snapshot.hasError) {
          return Text("${snapshot.error}");
        }
        //By default, show a loading spinner.
        return CircularProgressIndicator();
      },
    );
  }

  @override
  void initState() {
    super.initState();
    track = fetchTrack();
  }


  Future<Track> fetchTrack() async {
    final response =
        await http.get('http://139.59.108.222:2199/rpc/drn1/streaminfo.get');

    if (response.statusCode == 200) {
      // If the call to the server was successful, parse the JSON.
      var responseJson = json.decode(response.body);
      // assume there is only one track to display
      // SO question mentioned 'display current track'
      var track = responseJson['data']
          .map((musicFileJson) => Track.fromJson(musicFileJson['track']))
          .first;
      return track;
    } else {
      // If that call was not successful, throw an error.
      throw Exception('Failed to load post');
    }
  }
}

Answer 1

我发现最简单的方法是使用Timer 函数。

如果您将计时器放入 initState 中，它将在应用程序启动时启动。在下面的代码中，计时器将每 5 秒调用一次 addValue() 方法，每次将值加一。请记住在使用完计时器后将其丢弃。

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  Timer timer;
  int counter = 0;

  @override
  void initState() {
    super.initState();
    timer = Timer.periodic(Duration(seconds: 5), (Timer t) => addValue());
  }

  void addValue() {
    setState(() {
       counter++; 
    });
  }

  @override
  void dispose() {
    timer?.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(counter.toString())
          ],
        ),
      ),
    );
  }
}