From 7e4b9a383e108c21e20274487a220f82f5e00f37 Mon Sep 17 00:00:00 2001 From: "hanie.khodkari" Date: Mon, 12 May 2025 18:42:20 +0330 Subject: [PATCH] Improve search boxes ui --- .../CycleScreens/Result/search_box.dart | 67 +++++++++------- .../LabelScreens/Result/search_box.dart | 77 +++++++++++-------- .../TestResultScreens/Main/search_box.dart | 71 +++++++++-------- 3 files changed, 124 insertions(+), 91 deletions(-) diff --git a/lib/widgets/CycleScreens/Result/search_box.dart b/lib/widgets/CycleScreens/Result/search_box.dart index 3194fd7..0c3f3ee 100755 --- a/lib/widgets/CycleScreens/Result/search_box.dart +++ b/lib/widgets/CycleScreens/Result/search_box.dart @@ -1,3 +1,4 @@ +import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; @@ -24,44 +25,56 @@ class ResultSearchBox extends StatelessWidget { @override Widget build(BuildContext context) { - return TextField( - onEditingComplete: () { - FocusScope.of(context).unfocus(); - }, - controller: searchCTRL, - onChanged: onChanged, - decoration: InputDecoration( - icon: Icon( - FontAwesomeIcons.search, - size: 6 * _deviceBlockSize, + return Row( + crossAxisAlignment: CrossAxisAlignment.end, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + SizedBox( + width: 3, ), - labelStyle: TextStyle( - fontWeight: FontWeight.w100, - fontSize: 4 * _deviceBlockSize, + Expanded( + child: TextField( + onEditingComplete: () { + FocusScope.of(context).unfocus(); + }, + controller: searchCTRL, + onChanged: onChanged, + decoration: InputDecoration( + labelStyle: TextStyle( + fontWeight: FontWeight.w100, + fontSize: 4 * _deviceBlockSize, + ), + labelText: 'Search by $text $text2', + isDense: true, + contentPadding: EdgeInsets.symmetric(vertical: 2, horizontal: 3), + ), + style: TextStyle( + fontWeight: FontWeight.w700, + fontSize: 5 * _deviceBlockSize, + ), + keyboardType: textInputType, + ), ), - labelText: 'Search by $text $text2', - isDense: true, - contentPadding: EdgeInsets.symmetric(vertical: 2, horizontal: 3), - suffixIcon: InkWell( + InkWell( onTap: onTap, child: Container( - margin: EdgeInsets.all(5), + padding: EdgeInsets.all(7), + width: 8 * _deviceBlockSize, + margin: EdgeInsets.only(left: 5), decoration: BoxDecoration( shape: BoxShape.circle, color: Colors.black, ), - child: Icon( - Icons.input, - color: Colors.white, + child: Center( + child: Icon( + Icons.search, + size: 4 * _deviceBlockSize, + color: Colors.white, + ), ), ), ), - ), - style: TextStyle( - fontWeight: FontWeight.w700, - fontSize: 5 * _deviceBlockSize, - ), - keyboardType: textInputType, + ], ); } } diff --git a/lib/widgets/LabelScreens/Result/search_box.dart b/lib/widgets/LabelScreens/Result/search_box.dart index bdbc7da..6deabf6 100755 --- a/lib/widgets/LabelScreens/Result/search_box.dart +++ b/lib/widgets/LabelScreens/Result/search_box.dart @@ -1,5 +1,4 @@ import 'package:flutter/material.dart'; -import 'package:font_awesome_flutter/font_awesome_flutter.dart'; import 'package:provider/provider.dart'; import '../../../providers/labels.dart'; @@ -18,53 +17,63 @@ class LabelSearchBox extends StatelessWidget { @override Widget build(BuildContext context) { var searchVal; - return TextField( - onEditingComplete: () { - FocusScope.of(context).unfocus(); - }, - onChanged: (value) async { - searchVal = value; - }, - controller: searchCTRL, - decoration: InputDecoration( - icon: Icon( - FontAwesomeIcons.search, - size: 6 * _deviceBlockSize, + return Row( + crossAxisAlignment: CrossAxisAlignment.end, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + SizedBox( + width: 3, ), - labelStyle: TextStyle( - fontWeight: FontWeight.w100, - fontSize: 4 * _deviceBlockSize, + Expanded( + child: TextField( + onEditingComplete: () { + FocusScope.of(context).unfocus(); + }, + controller: searchCTRL, + onChanged: (value) async { + searchVal = value; + }, + decoration: InputDecoration( + labelStyle: TextStyle( + fontWeight: FontWeight.w100, + fontSize: 4 * _deviceBlockSize, + ), + labelText: 'Search by package name', + isDense: true, + contentPadding: EdgeInsets.symmetric(vertical: 2, horizontal: 3), + ), + style: TextStyle( + fontWeight: FontWeight.w700, + fontSize: 5 * _deviceBlockSize, + ), + keyboardType: TextInputType.number, + ), ), - labelText: 'Search by package name', - isDense: true, - contentPadding: EdgeInsets.symmetric(vertical: 2, horizontal: 3), - suffixIcon: InkWell( + InkWell( onTap: () async { - var labels = await Provider.of( - context, - listen: false); + var labels = + await Provider.of(context, listen: false); labels.setLoading(); await labels.search(searchVal); - }, child: Container( - margin: EdgeInsets.all(5), + padding: EdgeInsets.all(7), + width: 8 * _deviceBlockSize, + margin: EdgeInsets.only(left: 5), decoration: BoxDecoration( shape: BoxShape.circle, color: Colors.black, ), - child: Icon( - Icons.input, - color: Colors.white, + child: Center( + child: Icon( + Icons.search, + size: 4 * _deviceBlockSize, + color: Colors.white, + ), ), ), ), - ), - style: TextStyle( - fontWeight: FontWeight.w700, - fontSize: 5 * _deviceBlockSize, - ), - keyboardType: TextInputType.number, + ], ); } } diff --git a/lib/widgets/TestResultScreens/Main/search_box.dart b/lib/widgets/TestResultScreens/Main/search_box.dart index 7145dee..bd6f460 100755 --- a/lib/widgets/TestResultScreens/Main/search_box.dart +++ b/lib/widgets/TestResultScreens/Main/search_box.dart @@ -1,5 +1,4 @@ import 'package:flutter/material.dart'; -import 'package:font_awesome_flutter/font_awesome_flutter.dart'; import 'package:provider/provider.dart'; import '../../../providers/test_results.dart'; @@ -18,27 +17,39 @@ class TestResultSearchBox extends StatelessWidget { @override Widget build(BuildContext context) { var textVal; - return TextField( - onEditingComplete: () { - FocusScope.of(context).unfocus(); - }, - onChanged: (value) async { - textVal = value; - }, - controller: searchCTRL, - decoration: InputDecoration( - icon: Icon( - FontAwesomeIcons.search, - size: 6 * _deviceBlockSize, + return Row( + crossAxisAlignment: CrossAxisAlignment.end, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + SizedBox( + width: 3, ), - labelStyle: TextStyle( - fontWeight: FontWeight.w100, - fontSize: 4 * _deviceBlockSize, + Expanded( + child: TextField( + onEditingComplete: () { + FocusScope.of(context).unfocus(); + }, + controller: searchCTRL, + onChanged: (value) async { + textVal = value; + }, + decoration: InputDecoration( + labelStyle: TextStyle( + fontWeight: FontWeight.w100, + fontSize: 4 * _deviceBlockSize, + ), + labelText: 'Search by test name', + isDense: true, + contentPadding: EdgeInsets.symmetric(vertical: 2, horizontal: 3), + ), + style: TextStyle( + fontWeight: FontWeight.w700, + fontSize: 5 * _deviceBlockSize, + ), + keyboardType: TextInputType.number, + ), ), - labelText: 'Search by test name', - isDense: true, - contentPadding: EdgeInsets.symmetric(vertical: 2, horizontal: 3), - suffixIcon: InkWell( + InkWell( onTap: () async { var testResults = await Provider.of(context, listen: false); @@ -46,23 +57,23 @@ class TestResultSearchBox extends StatelessWidget { await testResults.search(textVal); }, child: Container( - margin: EdgeInsets.all(5), + padding: EdgeInsets.all(7), + width: 8 * _deviceBlockSize, + margin: EdgeInsets.only(left: 5), decoration: BoxDecoration( shape: BoxShape.circle, color: Colors.black, ), - child: Icon( - Icons.input, - color: Colors.white, + child: Center( + child: Icon( + Icons.search, + size: 4 * _deviceBlockSize, + color: Colors.white, + ), ), ), ), - ), - style: TextStyle( - fontWeight: FontWeight.w700, - fontSize: 5 * _deviceBlockSize, - ), - keyboardType: TextInputType.visiblePassword, + ], ); } }