如何在带有Firebase实时数据库(而非Firestore)的flutter项目中实现搜索功能?

时间:2019-09-16 20:11:42

标签: android firebase firebase-realtime-database flutter flutter-test

我已经创建了一个应用程序,并从FirebaseAnimatedListView中的firebase实时数据库中获取数据。现在请建议我如何按名称或移动号码从数据库中搜索数据。在文本字段中。

我尝试了很多方法,但总是失败。所有人都使用Fire-store制作了教程,我正在寻找实时Firebase。

import 'package:flutter/material.dart';
import 'package:firebase_database/firebase_database.dart';
import 'package:firebase_database/ui/firebase_animated_list.dart';
import 'view_contact.dart';
import 'add_contact.dart';

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {

    DatabaseReference _databaseReference = FirebaseDatabase.instance.reference();

    navigateToAddScreen(){
      Navigator.push(context, MaterialPageRoute(builder: (context){
        return AddContact();
      } ));
    }

    navigateToViewScreen(id){
      Navigator.push(context, MaterialPageRoute(builder: (context){
        return ViewContact(id);
      } ));
    }

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(

        title: Text('Contacts App Home'),
        actions: <Widget>[
          IconButton(icon: Icon(Icons.search),onPressed: (){},)
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: navigateToAddScreen,
        child: Icon(Icons.add),
      ),
      body: Container(
        child: Column(
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: TextField(
                onChanged: (value) {
                },
                decoration: InputDecoration(
                    labelText: "Search",
                    hintText: "Search",
                    prefixIcon: Icon(Icons.search),
                    border: OutlineInputBorder(
                        borderRadius: BorderRadius.all(Radius.circular(25.0)))),
              ),
            ),
            Expanded(
              child: FirebaseAnimatedList(
          query: _databaseReference,
          itemBuilder: (BuildContext context, DataSnapshot snapshot, Animation<double> animation, int index){
            return GestureDetector(
              onTap: (){
                navigateToViewScreen(snapshot.key);
              },
              child: Card(
                color: Colors.white,
                elevation: 2.0,
                child: Container(
                  margin: EdgeInsets.all(10.0),
                  child: Row(
                    children: <Widget>[
                      Container(
                        width: 50.0,
                        height: 50.0,
                        decoration: BoxDecoration(
                          shape: BoxShape.circle,
                          image: DecorationImage(
                            fit: BoxFit.cover,
                          image: snapshot.value['photoUrl'] == "empty" ?
                          AssetImage("assets/logo.png"): NetworkImage(
                            snapshot.value['photoUrl']
                          ),

                          )
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.all(20.0),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            Text(" ${snapshot.value['firstName']} ${snapshot.value['lastName']}",
                            style:TextStyle(fontWeight: FontWeight.bold),),
                            Text(" ${snapshot.value['phone']}")
                          ],
                        ),
                      )
                    ],
                  ),
                ),
              ),
            );
          },

        ),
            )
          ],
        ),
     ),

    );
  }
}

0 个答案:

没有答案