flutter 动画json_Flutter每分钟自动刷新JSON

I have searched the web for auto refresh widgets and auto refresh future JSON for Flutter but the results all seem to be for pull down refresh.

What I need is like a function that I can call and every minute that said function repeats.

I know I have to integrate something like:

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

However I am not sure where I need to put it.

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 {

Future track;

@override

Widget build(BuildContext context) {

double c_width = MediaQuery.of(context).size.width;

return new FutureBuilder(

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: [

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 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');

}

}

}

解决方案

The simplest way to do this I have found is to use the Timer function.

If you put the timer into initState it will start when the the app is started.

In the code below, the timer will call the addValue() method every 5 seconds which increases the value by one each time. Just remember to dispose of the timer when you have finished with it.

class MyHomePage extends StatefulWidget {

MyHomePage({Key key, this.title}) : super(key: key);

final String title;

@override

_MyHomePageState createState() => _MyHomePageState();

}

class _MyHomePageState extends State {

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: [

Text(counter.toString())

],

),

),

);

}

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值