Как я могу автоматически реализовать окно AlertDialog внутри ListView в приложении Flutter Android без нажатия какой-либо кнопки? - PullRequest
Новая
       77

Как я могу автоматически реализовать окно AlertDialog внутри ListView в приложении Flutter Android без нажатия какой-либо кнопки?

0 голосов
/ 24 февраля 2020

Я работаю над проектом, в котором я создал RestApi, где у меня есть данные автомобилей и который я постоянно обновляю каждые 3 часа c. Автомобили находятся на пересечении 4 дорог, теперь, когда автомобиль приближается к определенной дороге, обозначенной id, "is_green" станет true, а в ListView -> CircleAvtar станет зеленым, который покажет, идет машина или нет Теперь мой вопрос как мне реализовать окно AlertDialog, которое будет автоматически появляться без нажатия любой кнопки, когда bool isGreen = userData[index]["is_green"] будет содержать значение true. Я новичок, чтобы трепетать, поэтому я не знаю, как это сделать ... Пожалуйста, помогите мне 

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:async';
import 'dart:convert';

void main() {
  runApp(MaterialApp(
    debugShowCheckedModeBanner: false,
    theme: ThemeData.dark(),
    home: Home(),
  ));
}

class Home extends StatefulWidget {
  Home({Key key}) : super(key: key);
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  Map data;
  List userData;
  Future getData() async {
    print("updating data...");
    http.Response response = await http.get("http://10.100.101.154:3000/xd");
    data = jsonDecode(response.body);
    setState(() {
      userData = data["data"];
    });
  }

  @override
  void initState() {
    super.initState();

    Timer.periodic(new Duration(seconds: 3), (timer) {
      getData();
    });

  }

  Color getColor(bool isGreen) {
    if (isGreen == true) {
      return Colors.green;
    } else {
      return Colors.red;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('SGH'),
        centerTitle: true,
      ),
      body: ListView.builder(
          itemCount: userData == null ? 0 : userData.length,
          itemBuilder: (BuildContext context, int index) {
            bool isGreen = userData[index]["is_green"];
            return Card(
              child: Row(
                children: <Widget>[
                  Padding(
                    padding: EdgeInsets.all(10),
                    child: CircleAvatar(
                      backgroundColor: getColor(isGreen),
                      minRadius: 6,
                    ),
                  ),
                  Padding(
                    padding: EdgeInsets.all(10),
                    child: Wrap(
                      direction: Axis.horizontal,
                      children: <Widget>[
                        Text(
                          "Road Id = ${userData[index]["id"]} \CarInQueue = ${userData[index]["car_que"]} \nIsGreen ? --> ${userData[index]["is_green"]} ",
                          style: TextStyle(
                              fontSize: 20, fontWeight: FontWeight.bold),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            );
          }),
    );
  }
}

1 Ответ

1 голос
/ 24 февраля 2020

Просто проверяйте каждый раз, когда обновляете список автомобилей ... Затем показывайте Dialog с информацией о том, какой автомобиль пересекает 

Future getData() async {
    print("updating data...");
    http.Response response = await http.get("http://10.100.101.154:3000/xd");
    data = jsonDecode(response.body);
    setState(() {
      userData = data["data"];
    });
    checkDialog();
  }


checkDialog(){
var item = userData.where((car)=>car["is_green"]).first;//this is the first car where is_green is true
if(item!=null){
        showDialog(context:context,
        builder:(BuildContext context)=>AlertDialog( 
          //.... content here
         ));
}
}
...