Android 如何在背景上显示列表视图，并在颤振中从列表视图中弹出时消除黑屏？

我通过查询firebase中textfield的输入并将其显示为Flitter中UI中的列表来检索项目列表

这是我的密码-

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app_news/screens/drawer/news_drawer.dart';
import 'package:flutter_app_news/service/search_service/search_service.dart';

class Watchlist extends StatefulWidget {
  @override
  _WatchlistState createState() => new _WatchlistState();
}

class _WatchlistState extends State<Watchlist> {
  var tempSearchStore = [];
  var queryResult = [];
  final FirebaseAuth _firebaseAuth = FirebaseAuth.instance;
  CollectionReference users = FirebaseFirestore.instance.collection('Users');

  initiateSearch(value) {
    if (value.length == 0) {
      setState(() {
        queryResult = [];
        tempSearchStore = [];
      });
    }

    if (queryResult.length == 0 && value.length == 1) {
      SearchService().searchByName(value).then((QuerySnapshot snapshot) {
        for (int i = 0; i < snapshot.docs.length; i++) {
          queryResult.add(snapshot.docs[i].data());
          setState(() {
            tempSearchStore.add(queryResult[i]);
          });
        }
      });
    } else {
      tempSearchStore = [];
      queryResult.forEach((element) {
        if (element['name'].toString().startsWith(value)) {
          setState(() {
            tempSearchStore.add(element);
          });
        }
      });
    }
    ;
    if (tempSearchStore.length == 0 && value.length > 1) {
      setState(() {});
    }
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        extendBodyBehindAppBar: true,
        appBar: AppBar(
          iconTheme: IconThemeData(color: Colors.black),
          backgroundColor: Colors.white,
          title: Text(
            "Finbox",
            style: TextStyle(color: Colors.black),
          ),
        ),
        drawer: Drawer(child: NewsDrawer()),
        body: ListView(children: <Widget>[
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Text(
              "Your WatchList",
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.w500),
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(10.0),
            child: TextField(
              onChanged: (val) {
                initiateSearch(val);
              },
              decoration: InputDecoration(
                  prefixIcon: IconButton(
                    color: Colors.black,
                    icon: Icon(Icons.arrow_back),
                    iconSize: 20.0,
                    onPressed: () {
                      Navigator.of(context, rootNavigator: true).pop(context);
                    },
                  ),
                  contentPadding: EdgeInsets.only(left: 25.0),
                  hintText: 'Search by name',
                  border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(4.0))),
            ),
          ),
          SizedBox(height: 10.0),
          ListView.builder(
              shrinkWrap: true,
              itemCount: tempSearchStore.length,
              itemBuilder: (context, index) {
                return ListTile(
                  title: Text(tempSearchStore[index]['name']),
                  onTap: () {
                    users.doc(_firebaseAuth.currentUser.uid).update({
                      "subscribeTopic": FieldValue.arrayUnion(
                          [tempSearchStore[index]['name']])
                    });
                    Navigator.pop(context);
                  },
                );
              }),
          SizedBox(
            height: 10,
          ),
          StreamBuilder(
              stream: FirebaseFirestore.instance
                  .collection("Users")
                  .doc(_firebaseAuth.currentUser.uid)
                  .snapshots(),
              builder: (BuildContext context,
                  AsyncSnapshot<DocumentSnapshot> snapshot) {
                switch (snapshot.connectionState) {
                  case ConnectionState.waiting:
                    return Center(
                        child: CircularProgressIndicator(
                            valueColor:
                                AlwaysStoppedAnimation<Color>(Colors.black)));
                  default:
                    return SingleChildScrollView(
                      child: GridView.builder(
                          shrinkWrap: true,
                          gridDelegate:
                              SliverGridDelegateWithFixedCrossAxisCount(
                                  childAspectRatio: MediaQuery.of(context)
                                          .size
                                          .width /
                                      (MediaQuery.of(context).size.height / 7),
                                  crossAxisCount: 2),
                          itemCount: snapshot.data.get('subscribeTopic').length,
                          itemBuilder: (context, index) {
                            return GestureDetector(
                              onLongPress: () {
                                showAlertDialog(context,
                                    snapshot.data.get('subscribeTopic')[index]);
                                print(
                                    snapshot.data.get('subscribeTopic')[index]);
                              },
                              child: Container(
                                child: Text(
                                  snapshot.data.get('subscribeTopic')[index],
                                  style: TextStyle(
                                      fontSize: 15,
                                      fontWeight: FontWeight.w500),
                                ),
                                margin: EdgeInsets.all(15),
                                decoration: BoxDecoration(
                                  color: Color(0xFF92f7bb),
                                ),
                              ),
                            );
                          }),
                    );
                }
              })
        ]));
  }

  showAlertDialog(BuildContext context, value) {
    // set up the buttons
    Widget yesButton = ElevatedButton(
      child: Text("Yes"),
      onPressed: () async {
        // await FirebaseMessaging.instance.unsubscribeFromTopic(value);
        users.doc(_firebaseAuth.currentUser.uid).update({
          "subscribeTopic": FieldValue.arrayRemove([value])
        });
        Navigator.of(context)
            .push(MaterialPageRoute(builder: (context) => Watchlist()));
        ;
      },
    );
    Widget noButton = ElevatedButton(
      child: Text("No"),
      onPressed: () {
        Navigator.of(context).pop();
      },
    );

    // set up the AlertDialog
    AlertDialog alert = AlertDialog(
      title: Text("Finbox"),
      content: Text("Do you like to unsubscribe for " + value + " ?"),
      actions: [
        yesButton,
        noButton,
      ],
    );

    // show the dialog
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return alert;
      },
    );
  }
}

import'包：cloud_firestore/cloud_firestore.dart'；
导入“包：firebase_auth/firebase_auth.dart”；
进口“包装：颤振/材料.省道”；
导入“包：flatter_app_news/screens/drawer/news_drawer.dart”；
导入“包：flatter_app_news/service/search_service/search_service.dart”；
类监视列表扩展了StatefulWidget{
@凌驾
_WatchlistState createState（）=>new_WatchlistState（）；
}
类_WatchlistState扩展状态{
var tempSearchStore=[]；
var queryResult=[]；
final FirebaseAuth _FirebaseAuth=FirebaseAuth.instance；
CollectionReference users=FirebaseFirestore.instance.collection（'users'）；
初始搜索（值）{
如果（value.length==0）{
设置状态（）{
queryResult=[]；
tempSearchStore=[]；
});
}
if（queryResult.length==0&&value.length==1）{
SearchService（）.searchByName（值）。然后（（QuerySnapshot快照）{
对于（int i=0；i1）{
setState（（）{}）；
}
}
@凌驾
小部件构建（构建上下文）{
归还新脚手架(
extendedBodyBehindAppBar:true，
appBar:appBar(
iconTheme:IconThemeData（颜色：Colors.black），
背景颜色：Colors.white，
标题：正文(
“Finbox”，
样式：TextStyle（颜色：Colors.black），
),
),
抽屉：抽屉（子：NewsDrawer（）），
正文：列表视图（子项：[
填充物(
填充：常数边集全部（8.0），
子：文本(
“你的观察名单”，
样式：TextStyle（fontSize:20，fontWeight:fontWeight.w500），
),
),
填充物(
填充：常数边集全部（10.0），
孩子：TextField(
一旦更改：（val）{
初始搜索（val）；
},
装饰：输入装饰(
前缀：图标按钮(
颜色：颜色，黑色，
图标：图标（图标。箭头返回），
iconSize:20.0，
已按下：（）{
of（context，rootNavigator:true）.pop（context）；
},
),
contentPadding:仅限边集（左：25.0），
hintText:'按名称搜索'，
边框：大纲输入边框(
borderRadius:borderRadius.circular（4.0）），
),
),
尺寸箱（高度：10.0），
ListView.builder(
收缩膜：对，
itemCount:tempSearchStore.length，
itemBuilder：（上下文，索引）{
返回列表块(
标题：文本（tempSearchStore[索引]['name']），
onTap:（）{
users.doc（\u firebaseAuth.currentUser.uid）。更新({
“subscribeTopic”：FieldValue.arrayUnion(
[tempSearchStore[索引]['name']]
});
Navigator.pop（上下文）；
},
);
}),
大小盒子(
身高：10，
),
StreamBuilder(
流：FirebaseFirestore.instance
.收集（“用户”）
.doc（_firebaseAuth.currentUser.uid）
.snapshots（），
生成器：（BuildContext上下文，
异步快照（快照）{
交换机（快照.连接状态）{
案例连接状态。正在等待：
返回中心(
子对象：循环压缩机指示器(
valueColor：
（颜色：黑色）；
违约：
返回SingleChildScrollView(
子项：GridView.builder(
收缩膜：对，
gridDelegate：
SliverGridDelegateWithFixedCrossAxisCount(
childAspectRatio:MediaQuery.of（上下文）
.尺寸
.宽度/
（MediaQuery.of（context.size.height/7），
交叉轴计数：2），
itemCount:snapshot.data.get（'subscribeTopic'）.length，
itemBuilder：（上下文，索引）{
返回手势检测器(
onLongPress:（）{
showAlertDialog（上下文，
snapshot.data.get（'subscribeTopic'）[index]）；
印刷品(
snapshot.data.get（'subscribeTopic'）[index]）；
},
子：容器(
子：文本(
snapshot.data.get（'subscribeTopic'）[index]，
样式：TextStyle(
尺寸：15，
fontWeight:fontWeight.w500），
),
Stack(
  children: [
  // whatever you want to show. Positioned will come on top of it.

  data.length == 0         // your search result length
    ? SizedBox(height: 0)
    : Positioned(
      top: 0,
      width: double.infinity,
      child: Container(

      // whatever you want to show here

      ),
  ]
),