У меня проблема с тем, чтобы пользовательский интерфейс обновлялся в реальном времени, я получил данные из веб-сайта JSON, сделанные с помощью узлов JS и MySQL.
Здесь мой интерфейс выглядит так. Показанное изображение null
Я не знаю, почему это происходит. сначала перейдите к той странице, которая кажется пустой, затем я вернусь на предыдущую страницу и сделаю то же самое, и она работает, данные появляются. Изображение показывает данные
У меня вопрос, как сделать так, чтобы данные всегда обновлялись в реальном времени?
вот мой код
import 'package:crophero/detail.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:crophero/home_page.dart';
import 'package:crophero/login_page.dart';
import 'package:crophero/api_provider.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'dart:async';
import 'dart:io';
class SensorPage extends StatefulWidget {
SensorPage({Key key, this.id, this.gh, this.idgh, this.namagh})
: super(key: key);
final int id;
final int idgh;
final String namagh;
final List gh;
static String tag = 'sensor-page';
@override
_SensorPageState createState() => new _SensorPageState();
}
Timer timer;
int suhu;
int rh;
int cahaya;
int air;
int tanah;
int angin;
class _SensorPageState extends State<SensorPage> {
Future loadSensor() async {
var jsonString = await http
.get('$endPoint/data_realtime?user_id=$id&&gh_id=${widget.idgh}');
final jsonResponse = json.decode(jsonString.body);
setState(() {
suhu = jsonResponse['suhu'];
rh = jsonResponse['rh'];
cahaya = jsonResponse['cahaya'];
air = jsonResponse['air'];
tanah = jsonResponse['tanah'];
angin = jsonResponse['angin'];
});
}
@override
void initState() {
super.initState();
loadSensor();
_buatlist();
}
@override
void dispose() {
super.dispose();
timer.cancel();
}
List<Container> daftarSensor = new List();
var karakter = [
{
"nama": "Air Temperature",
"gambar": "temp.png",
"warna": 0xFFD50000,
"nilai": "$suhu *C"
},
{
"nama": "Relative Humidity",
"gambar": "rh.png",
"warna": 0xFF33691E,
"nilai": "$rh %"
},
{
"nama": "Water Temperature",
"gambar": "water.png",
"warna": 0xFF0288D1,
"nilai": "$air *C"
},
{
"nama": "Light Intensity",
"gambar": "light.png",
"warna": 0xFFFFAB00,
"nilai": "${cahaya} lux"
},
{
"nama": "Soil Moisture",
"gambar": "soil.png",
"warna": 0xFF795548,
"nilai": "$tanah"
},
{
"nama": "Wind Velocity",
"gambar": "wind.png",
"warna": 0xFF00695C,
"nilai": "${angin} m/s"
},
];
_buatlist() async {
for (var i = 0; i < karakter.length; i++) {
final karakternya = karakter[i];
final data = karakter[i];
final String gambar = karakternya["gambar"];
daftarSensor.add(
new Container(
padding: new EdgeInsets.all(10.0),
child: new Column(
children: <Widget>[
new Material(
child: new Column(
children: <Widget>[
MaterialButton(
minWidth: 200.0,
height: 75.0,
onPressed: () {
Navigator.push(
context,
new MaterialPageRoute(
builder: (context) => new Detail(
gambar: karakternya["gambar"],
warna: karakternya["warna"],
nilai: data["nilai"],
nama: karakternya["nama"],
idgh: widget.idgh,
namagh: widget.namagh,
)));
},
child: Column(
children: <Widget>[
Row(
children: <Widget>[
new Image.asset(
"img/$gambar",
fit: BoxFit.cover,
width: 50,
),
SizedBox(width: 130),
Text((karakternya["nilai"]),
style: TextStyle(
color: Colors.white,
fontSize: 25,
),
textAlign: TextAlign.left),
],
),
Text((karakternya["nama"]),
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
textAlign: TextAlign.end),
],
),
)
],
),
color: Color(karakternya["warna"]),
borderRadius: BorderRadius.circular(20),
),
],
),
),
);
}
}
@override
Widget build(BuildContext context) {
return new Scaffold(
bottomNavigationBar: Container(
height: 50,
child: BottomAppBar(
color: Colors.green[900],
child: new Center(
child: new Row(
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(horizontal: 50.0),
),
],
),
),
),
),
backgroundColor: Colors.white,
appBar: new AppBar(
backgroundColor: Colors.green[900],
title: new Text(
"${widget.namagh} ",
style: new TextStyle(color: Colors.white),
),
),
body: new ListView(
children: daftarSensor,
),
);
}
}