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.
User contributions licensed under CC BY-SA 3.0