fix: searchBar open and close correctly
All checks were successful
/ mirror (push) Successful in 4s

This commit is contained in:
Florian Griffon 2025-01-16 13:20:54 +01:00
parent 8b1eb1d709
commit 4401cba5b5

View File

@ -14,11 +14,9 @@ class _MyHomePageState extends State<MyHomePage>
List<Contact> _contactSuggestions = []; List<Contact> _contactSuggestions = [];
final ContactService _contactService = ContactService(); final ContactService _contactService = ContactService();
@override @override
void initState() { void initState() {
super.initState(); super.initState();
// Set the TabController length to 3
_tabController = TabController(length: 3, vsync: this, initialIndex: 1); _tabController = TabController(length: 3, vsync: this, initialIndex: 1);
_tabController.addListener(_handleTabIndex); _tabController.addListener(_handleTabIndex);
_fetchContacts(); _fetchContacts();
@ -30,8 +28,6 @@ class _MyHomePageState extends State<MyHomePage>
} }
void _onSearchChanged(String query) { void _onSearchChanged(String query) {
print("Search query: $query");
setState(() { setState(() {
if (query.isEmpty) { if (query.isEmpty) {
_contactSuggestions = List.from(_allContacts); _contactSuggestions = List.from(_allContacts);
@ -62,7 +58,6 @@ class _MyHomePageState extends State<MyHomePage>
backgroundColor: Colors.black, backgroundColor: Colors.black,
body: Column( body: Column(
children: [ children: [
// Persistent Search Bar
Padding( Padding(
padding: const EdgeInsets.only( padding: const EdgeInsets.only(
top: 24.0, top: 24.0,
@ -77,47 +72,37 @@ class _MyHomePageState extends State<MyHomePage>
decoration: BoxDecoration( decoration: BoxDecoration(
color: const Color.fromARGB(255, 30, 30, 30), color: const Color.fromARGB(255, 30, 30, 30),
borderRadius: BorderRadius.circular(12.0), borderRadius: BorderRadius.circular(12.0),
border: Border( border:
top: BorderSide(color: Colors.grey.shade800, width: 1), Border.all(color: Colors.grey.shade800, width: 1),
left: BorderSide(color: Colors.grey.shade800, width: 1),
right: BorderSide(color: Colors.grey.shade800, width: 1),
bottom:
BorderSide(color: Colors.grey.shade800, width: 2),
),
), ),
child: SearchAnchor( child: SearchAnchor(
builder: builder: (BuildContext context,
(BuildContext context, SearchController controller) { SearchController controller) {
return SearchBar( return GestureDetector(
controller: controller,
padding:
MaterialStateProperty.all<EdgeInsetsGeometry>(
const EdgeInsets.only(
top: 6.0,
bottom: 6.0,
left: 16.0,
right: 16.0,
),
),
onTap: () { onTap: () {
controller.openView(); controller.openView(); // Open the search view
_onSearchChanged('');
}, },
backgroundColor: MaterialStateProperty.all( child: Container(
const Color.fromARGB(255, 30, 30, 30)), decoration: BoxDecoration(
hintText: 'Search contacts', color: const Color.fromARGB(255, 30, 30, 30),
hintStyle: MaterialStateProperty.all(
const TextStyle(color: Colors.grey, fontSize: 16.0),
),
leading: const Icon(
Icons.search,
color: Colors.grey,
size: 24.0,
),
shape:
MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12.0), borderRadius: BorderRadius.circular(12.0),
border: Border.all(
color: Colors.grey.shade800, width: 1),
),
padding: const EdgeInsets.symmetric(
vertical: 12.0, horizontal: 16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: const [
Icon(Icons.search,
color: Colors.grey, size: 24.0),
SizedBox(width: 8.0),
Text(
'Search contacts',
style: TextStyle(
color: Colors.grey, fontSize: 16.0),
),
],
), ),
), ),
); );
@ -125,8 +110,8 @@ class _MyHomePageState extends State<MyHomePage>
viewOnChanged: (query) { viewOnChanged: (query) {
_onSearchChanged(query); _onSearchChanged(query);
}, },
suggestionsBuilder: suggestionsBuilder: (BuildContext context,
(BuildContext context, SearchController controller) { SearchController controller) {
return _contactSuggestions.map((contact) { return _contactSuggestions.map((contact) {
return ListTile( return ListTile(
key: ValueKey(contact.id), key: ValueKey(contact.id),
@ -138,10 +123,8 @@ class _MyHomePageState extends State<MyHomePage>
); );
}).toList(); }).toList();
}, },
)),
), ),
),
),
// 3-dot menu
PopupMenuButton<String>( PopupMenuButton<String>(
icon: const Icon(Icons.more_vert, color: Colors.white), icon: const Icon(Icons.more_vert, color: Colors.white),
itemBuilder: (BuildContext context) => [ itemBuilder: (BuildContext context) => [