How to search in ListView Flutter?

0

In my application I have created a bottom navigation bar So I have created a common app bar for all navigations but in every navigation screen I am showing ListView from moor database, so Does anyone help me to achieve search functionality in my application?

My Home Screen Code where I have Coded for bottom navigation bar:

import 'package:flutter/material.dart';
import 'package:secret_keeper/screens/home_screen/banks/BanksNavigation.dart';
import 'package:secret_keeper/screens/home_screen/cards/CardsNavigation.dart';
import 'package:secret_keeper/screens/home_screen/notes/NotesNavigation.dart';
import 'package:secret_keeper/screens/home_screen/passwords/PasswordsNavigation.dart';
import 'package:secret_keeper/screens/input_screen/bank_input/BankInput.dart';
import 'package:secret_keeper/screens/input_screen/card_input/CardInput.dart';
import 'package:secret_keeper/screens/input_screen/note_input/NoteInput.dart';
import 'package:secret_keeper/screens/input_screen/password_input/PasswordInput.dart';

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  //Properties

  int currentTab = 0;
  final List<Widget> screens = [
    PasswordsNavigation(),
    CardsNavigation(),
    BanksNavigation(),
    NotesNavigation(),
  ];

  //Active Page (Tab)

  Widget currentScreen = PasswordsNavigation();
  final PageStorageBucket bucket = PageStorageBucket();
  Icon cusIcon = Icon(Icons.search);
  Widget cusSearchBar = Row(children: [
    Text(
      "SECRET",
      style: TextStyle(color: Colors.orange[900], fontWeight: FontWeight.w700),
    ),
    Text(
      "KEEPER",
      style: TextStyle(color: Colors.black87, fontWeight: FontWeight.w700),
    ),
  ]);

  void checkNavigation() {
    if (currentTab == 0)
      Navigator.push(
          context, MaterialPageRoute(builder: (context) => PasswordInput()));
    else if (currentTab == 1)
      Navigator.push(
          context, MaterialPageRoute(builder: (context) => CardInput()));
    else if (currentTab == 2)
      Navigator.push(
          context, MaterialPageRoute(builder: (context) => BankInput()));
    else
      Navigator.push(
          context, MaterialPageRoute(builder: (context) => NoteInput()));
  }

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async => false,
      child: Scaffold(
        appBar: AppBar(
          automaticallyImplyLeading: false,
          title: cusSearchBar,
          actions: [
            IconButton(
              onPressed: () {
                setState(() {
                  if (this.cusIcon.icon == Icons.search) {
                    this.cusIcon = Icon(Icons.cancel, color: Colors.black87);
                    this.cusSearchBar = Container(
                      height: 50,
                      child: TextField(
                        textInputAction: TextInputAction.go,
                        autofocus: true,
                        decoration: InputDecoration(
                            border: InputBorder.none, hintText: "Search here"),
                        style: TextStyle(
                          fontSize: 20.0,
                        ),
                      ),
                    );
                  } else {
                    this.cusIcon = Icon(Icons.search);
                    this.cusSearchBar = Row(children: [
                      Text(
                        "SECRET",
                        style: TextStyle(
                            color: Colors.orange[900],
                            fontWeight: FontWeight.w700),
                      ),
                      Text(
                        "KEEPER",
                        style: TextStyle(
                            color: Colors.black87, fontWeight: FontWeight.w700),
                      ),
                    ]);
                  }
                });
              },
              icon: cusIcon,
            ),
            PopupMenuButton(
              itemBuilder: (context) => [
                PopupMenuItem(
                  value: 1,
                  child: Container(
                    width: 100.0,
                    child: Text(
                      "Sync",
                      style: TextStyle(
                        fontWeight: FontWeight.w500,
                        color: Colors.black,
                      ),
                    ),
                  ),
                ),
                PopupMenuItem(
                  value: 2,
                  child: Container(
                    width: 100.0,
                    child: Text(
                      "Settings",
                      style: TextStyle(
                        fontWeight: FontWeight.w500,
                        color: Colors.black,
                      ),
                    ),
                  ),
                ),
                PopupMenuItem(
                  value: 3,
                  child: Container(
                    width: 100.0,
                    child: Text(
                      "Rate us",
                      style: TextStyle(
                        fontWeight: FontWeight.w500,
                        color: Colors.black,
                      ),
                    ),
                  ),
                ),
                PopupMenuItem(
                  value: 4,
                  child: Container(
                    width: 100.0,
                    child: Text(
                      "Lock vault",
                      style: TextStyle(
                        fontWeight: FontWeight.w500,
                        color: Colors.black,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ],
        ),
        body: PageStorage(
          child: currentScreen,
          bucket: bucket,
        ),

        //FAB Button

        floatingActionButton: FloatingActionButton(
          child: Icon(Icons.add),
          backgroundColor: Colors.orangeAccent,
          onPressed: () {
            checkNavigation();
          },
        ),

        //FAB Position

        floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,

        //Bottom App Bar

        bottomNavigationBar: BottomAppBar(
          shape: CircularNotchedRectangle(),
          child: Container(
            height: 60,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    MaterialButton(
                      minWidth: 40,
                      onPressed: () {
                        setState(() {
                          currentScreen = PasswordsNavigation();
                          currentTab = 0;
                        });
                      },
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Icon(
                            Icons.paste_sharp,
                            color: currentTab == 0 ? Colors.orange : Colors.grey,
                          ),
                          Text(
                            'Passwords',
                            style: TextStyle(
                              color:
                                  currentTab == 0 ? Colors.orange : Colors.grey,
                            ),
                          ),
                        ],
                      ),
                    ),
                    MaterialButton(
                      minWidth: 40,
                      onPressed: () {
                        setState(() {
                          currentScreen = CardsNavigation();
                          currentTab = 1;
                        });
                      },
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Icon(
                            Icons.credit_card_rounded,
                            color: currentTab == 1 ? Colors.orange : Colors.grey,
                          ),
                          Text(
                            'Cards',
                            style: TextStyle(
                              color:
                                  currentTab == 1 ? Colors.orange : Colors.grey,
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
                Row(
                  children: [
                    MaterialButton(
                      minWidth: 40,
                      onPressed: () {
                        setState(() {
                          currentScreen = BanksNavigation();
                          currentTab = 2;
                        });
                      },
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Icon(
                            Icons.food_bank_outlined,
                            color: currentTab == 2 ? Colors.orange : Colors.grey,
                          ),
                          Text(
                            'Banks',
                            style: TextStyle(
                              color:
                                  currentTab == 2 ? Colors.orange : Colors.grey,
                            ),
                          ),
                        ],
                      ),
                    ),
                    MaterialButton(
                      minWidth: 40,
                      onPressed: () {
                        setState(() {
                          currentScreen = NotesNavigation();
                          currentTab = 3;
                        });
                      },
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Icon(
                            Icons.notes,
                            color: currentTab == 3 ? Colors.orange : Colors.grey,
                          ),
                          Text(
                            'Notes',
                            style: TextStyle(
                              color:
                                  currentTab == 3 ? Colors.orange : Colors.grey,
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

This is my First Navigation Screen Code where i am showing ListView from moor database:

import 'package:flutter/material.dart';
import 'package:moor_flutter/moor_flutter.dart' hide Column;
import 'package:provider/provider.dart';
import 'package:secret_keeper/Database/Moor/moor_database.dart';
import 'package:secret_keeper/screens/home_screen/passwords/ShowData.dart';

class PasswordsNavigation extends StatefulWidget {
  @override
  _PasswordsNavigationState createState() => _PasswordsNavigationState();
}

class _PasswordsNavigationState extends State<PasswordsNavigation> {

  String _wName, _wAddress, _userName, _password, _notes;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Expanded(
            child: _buildPasswordList(context),
          ),
        ],
      ),
    );
  }

  Widget stackBehindDismiss() {
    return Container(
      alignment: Alignment.centerRight,
      padding: EdgeInsets.only(right: 20.0),
      color: Colors.red,
      child: Icon(
        Icons.delete,
        color: Colors.white,
      ),
    );
  }

  StreamBuilder<List<Password>> _buildPasswordList(BuildContext context) {
    final dao = Provider.of<PasswordDao>(context);
    return StreamBuilder(
      stream: dao.watchAllPasswords(),
      builder: (context, AsyncSnapshot<List<Password>> snapshot) {
        final passwords = snapshot.data ?? List();
        return ListView.builder(
          itemCount: passwords.length,
          itemBuilder: (_, index) {
            final itemPassword = passwords[index];
            return _buildListItem(itemPassword, dao);
          },
        );
      },
    );
  }

  Widget _buildListItem(Password itemPassword, PasswordDao dao) {
    return Dismissible(
      background: stackBehindDismiss(),
      key: ObjectKey(itemPassword),
      direction: DismissDirection.endToStart,
      onDismissed: (direction) {
        _wName = itemPassword.wName;
        _wAddress = itemPassword.wAddress;
        _userName = itemPassword.uName;
        _password = itemPassword.password;
        _notes = itemPassword.notes;
        dao.deletePassword(itemPassword);
        Scaffold.of(context).showSnackBar(
          SnackBar(
            content: Text("Entry deleted!"),
            action: SnackBarAction(
              label: "UNDO",
              textColor: Color(0xFFFFFFFF),
              onPressed: () {
                //To undo deletion
                undoDeletion(_wName, _wAddress, _userName, _password, _notes);
              },
            ),
          ),
        );
      },
      child: ListTile(
        title: Text(
          itemPassword.wName,
          style: TextStyle(
            fontWeight: FontWeight.w800,
            color: Colors.black,
          ),
        ),
        subtitle: Text(itemPassword.wAddress),
        onTap: () {
          Navigator.of(context).push(
            MaterialPageRoute(
              builder: (_) => ShowData(
                itemPassword: itemPassword,
              ),
            ),
          );
        },
      ),
    );
  }

  void undoDeletion(wName, wAddress, userName, password, notes) {
    final passwordDao = Provider.of<PasswordDao>(context);
    final values = PasswordsCompanion(
        wName: Value(wName),
        wAddress: Value(wAddress),
        uName: Value(userName),
        password: Value(password),
        notes: Value(notes)
    );
    passwordDao.insertPassword(values);
  }

}

Please tell me how to do this, I am beginner so I don't have lot of experience about flutter.

flutter
listview
asked on Stack Overflow Dec 5, 2020 by Jaydip Pawar

0 Answers

Nobody has answered this question yet.


User contributions licensed under CC BY-SA 3.0