maheshj01 / searchfield

A highly customizable simple and easy to use flutter Widget to add a searchfield to your Flutter Application.This Widget allows you to search and select from list of suggestions.
MIT License
84 stars 64 forks source link

Cursor missing on the Searchfield in (Release/Profile) #158

Closed varun-a50 closed 4 months ago

varun-a50 commented 4 months ago

when I am running app in profile mode or when I am releasing the app the searchfield many of the times does not show the cursor and text I typed

Screenshot 2024-07-23 130258

 Text("Utility Name", style: TextStyle(fontSize: 16.sp)),
              ListenableBuilder(
                listenable: _focusNode,
                builder: (context, child) {
                  return SearchField<TenantModel>(
                    animationDuration: const Duration(milliseconds: 1000),
                    autofocus: true,
                    focusNode: _focusNode2,
                    inputFormatters: <TextInputFormatter>[
                      FilteringTextInputFormatter.allow(RegExp("[a-zA-Z]")),
                    ],
                    controller: _searchController,
                    searchInputDecoration: InputDecoration(
                        hintText: 'Search',
                        hintStyle:
                            TextStyle(color: kGreyTextColor, fontSize: 14.sp),
                        prefixIcon: const Icon(Icons.search)),
                    validator:
                       ""
                    onSearchTextChanged: (query) {
                      setState(() {
                        if (query.length > 2 && query.contains(textOnlyRegex)) {

                          selectedTenantAlias = '';
                          searchOptionSelected = '';
                          isSelected = false;
                        }
                      });
                      _newformKey.currentState!.reset();
                      return null;
                    },
                    hint: 'Search Utility',
                    itemHeight: 50,
                    onTapOutside: (p0) {
                      FocusScope.of(context).unfocus();
                    },
                    scrollbarDecoration: ScrollbarDecoration(),
                    suggestionStyle: const TextStyle(color: kblack),
                    onSuggestionTap: (SearchFieldListItem<TenantModel> x) {
                      searchOptionSelected = x.item!.name;
                      debugPrint(searchOptionSelected);
                      selectedTenantAlias = x.item!.alias;

                      isSelected = true;
                      FocusScope.of(context).unfocus();
                    },
                    suggestions: _searchController.text.length > 2
                        ? ref
                            .watch(authProvider)
                            .tenants
                            .map((e) => SearchFieldListItem<>(
                                e.name.toString(),
                                item: e))
                            .toList()
                        : [],
                  );
                },
              ),
maheshj01 commented 4 months ago

Hi @varun-a50, Thanks for filing the issue. What device is this issue on? Are you using the latest version of the package found on pub.dev?

varun-a50 commented 4 months ago

Yes i have tried it on many different devices

On Tue, 23 Jul 2024, 17:41 Mahesh Jamdade, @.***> wrote:

Hi @varun-a50 https://github.com/varun-a50, Thanks for filing the issue. What device is this issue on? Are you using the latest version of the package found on pub.dev?

— Reply to this email directly, view it on GitHub https://github.com/maheshj01/searchfield/issues/158#issuecomment-2245075806, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANSS4TK73ET3S6TM32HO3KLZNZB57AVCNFSM6AAAAABLJ2KLM6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENBVGA3TKOBQGY . You are receiving this because you were mentioned.Message ID: @.***>

varun-a50 commented 4 months ago

Was that a genuine issue?

On Tue, 23 Jul 2024, 18:03 Varun Bhosle, @.***> wrote:

Yes i have tried it on many different devices

On Tue, 23 Jul 2024, 17:41 Mahesh Jamdade, @.***> wrote:

Hi @varun-a50 https://github.com/varun-a50, Thanks for filing the issue. What device is this issue on? Are you using the latest version of the package found on pub.dev?

— Reply to this email directly, view it on GitHub https://github.com/maheshj01/searchfield/issues/158#issuecomment-2245075806, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANSS4TK73ET3S6TM32HO3KLZNZB57AVCNFSM6AAAAABLJ2KLM6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENBVGA3TKOBQGY . You are receiving this because you were mentioned.Message ID: @.***>

maheshj01 commented 4 months ago

@varun-a50 I verified on Google Pxiel 7, macOS desktop, and Google Chrome for web and I am able to see the cursor on all of the devices

Are you able to see the cursor when you use a normal flutter Textfield or TextformField?

varun-a50 commented 4 months ago

Yes actually i will retest that i have used stack widget with position widget as a common widget then in that i was passing the searchfield I guess i must have missed something

Wait have you check it in release build? In debug or run without debug it is running fine

On Thu, 25 Jul 2024, 00:08 Mahesh Jamdade, @.***> wrote:

@varun-a50 https://github.com/varun-a50 I verified on Google Pxiel 7, macOS desktop, and Google Chrome for web and I am able to see the cursor on all of the devices

Are you able to see the cursor when you use a normal flutter Textfield or TextformField?

— Reply to this email directly, view it on GitHub https://github.com/maheshj01/searchfield/issues/158#issuecomment-2248672473, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANSS4TM65JCSVZKM3JSGIYTZN7YEBAVCNFSM6AAAAABLJ2KLM6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENBYGY3TENBXGM . You are receiving this because you were mentioned.Message ID: @.***>

maheshj01 commented 4 months ago

I have verified in both release and debug build.

  1. You should try replacing Searchfield with a normal TextField and see if you have that issue, If it does then it means there is an issue with your code
  2. If you only see the issue when using the searchfield package then please share a minimal and complete code sample for us to reproduce the issue.
varun-a50 commented 4 months ago

Ok I will test that and let you know

On Thu, 25 Jul 2024, 06:19 Mahesh Jamdade, @.***> wrote:

I have verified in both release and debug build.

  1. You should try replacing Searchfield with a normal TextField and see if you have that issue, If it does then it means there is an issue with your code
  2. If you only see the issue when using the searchfield package then please share a minimal and complete code sample for us to reproduce the issue.

— Reply to this email directly, view it on GitHub https://github.com/maheshj01/searchfield/issues/158#issuecomment-2249128291, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANSS4TPXF52UGJQHAQB4EVDZOBDP5AVCNFSM6AAAAABLJ2KLM6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENBZGEZDQMRZGE . You are receiving this because you were mentioned.Message ID: @.***>

varun-a50 commented 4 months ago

import 'package:awesome_snackbar_content/awesome_snackbar_content.dart'; import 'package:consumer_app/config/routes/routes_location.dart'; import 'package:consumer_app/data/models/tenant.dart'; import 'package:consumer_app/providers/auth/auth.dart'; import 'package:consumer_app/utils/color_constants.dart'; import 'package:consumer_app/widgets/common_auth_design.dart'; import 'package:consumer_app/widgets/common_dropdown.dart'; import 'package:consumer_app/widgets/common_elevated_button.dart'; import 'package:consumer_app/widgets/common_text.dart'; import 'package:consumer_app/widgets/common_text_box.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:go_router/go_router.dart'; import 'package:searchfield/searchfield.dart';

class SelectUtilityScreen extends ConsumerStatefulWidget { static SelectUtilityScreen builder( BuildContext context, GoRouterState state, ) => const SelectUtilityScreen(); const SelectUtilityScreen({super.key}); @override ConsumerState createState() => _SelectUtilityScreenState(); }

class _SelectUtilityScreenState extends ConsumerState { late TextEditingController _accountNumberController;

final TextEditingController _searchController = TextEditingController(); final TextEditingValue _searchValue = TextEditingValue(); List suggestions = []; String _displayStringForOption(TenantModel option) => option.alias. toString(); String? valueNull; final FocusNode _focusNode = FocusNode(); final _formKey = GlobalKey(); final _newformKey = GlobalKey(); final _newtextformKey = GlobalKey();

//04 bool isSelected = false; @override void initState() { _accountNumberController = TextEditingController();

// ref.read(authProvider.notifier).getTenants('').onError(
//   (error, stackTrace) {
//     final snackBar = SnackBar(
//       /// need to set following properties for best effect of

awesome_snackbar_content // elevation: 0, // behavior: SnackBarBehavior.floating, // // backgroundColor: Colors.transparent, // content: AwesomeSnackbarContent( // title: ' On Snap!', // message: error.toString(),

//         /// change contentType to ContentType.success,

ContentType.warning or ContentType.help for variants // contentType: ContentType.failure, // ), // ); // ScaffoldMessenger.of(context) // ..hideCurrentSnackBar() // ..showSnackBar(snackBar); // }, // );

super.initState();

}

@override void dispose() { _searchController.dispose(); _focusNode.dispose(); super.dispose(); }

KeyEventResult _handleKeyEvent(FocusNode node, KeyEvent event) { if (event is KeyDownEvent) { if (event.logicalKey == LogicalKeyboardKey.backspace) { setState(() { ref.watch(authProvider).clearList(); _formKey.currentState!.reset(); _searchController.clear(); debugPrint("keydown"); }); return KeyEventResult.handled; } } return KeyEventResult.ignored; }

@override Widget build(BuildContext context) { suggestions = ref.watch(authProvider).tenants; String selectedTenantAlias = ''; int selectUtilityId = 0; final RegExp textOnlyRegex = RegExp(r'^[a-zA-Z\s]+$'); String? searchOptionSelected; return Scaffold( backgroundColor: kPrimaryColor, resizeToAvoidBottomInset: false, body: KeyboardListener( onKeyEvent: (KeyEvent event) { _handleKeyEvent(_focusNode, event); }, focusNode: _focusNode, child: AuthDesignScreen( formKey: _formKey, title: 'Setup your account!', subTitle: "", mainchildren: [ Text("Utility Name", style: TextStyle(fontSize: 16.sp)), CommonTextBox( controller: _accountNumberController, hintText: "", validator: ref.read(authProvider.notifier). validateEmptyField, ), SearchField( inputFormatters: [ FilteringTextInputFormatter.allow(RegExp("[a-zA-Z]")), ], controller: _searchController, suggestionItemDecoration: const BoxDecoration(), searchInputDecoration: const InputDecoration( / prefixIcon: Icon(Icons.search)), validator: ref.read(authProvider.notifier). validateUtilityField, onSearchTextChanged: (query) { setState(() { if (query.length > 2 && query.contains(textOnlyRegex)) { ref.read(authProvider.notifier).getTenants(query). onError( (error, stackTrace) { final snackBar = SnackBar( elevation: 0, behavior: SnackBarBehavior.floating, backgroundColor: Colors.transparent, content: AwesomeSnackbarContent( title: 'On Snap!', message: error.toString(), contentType: ContentType.failure, ), );

                      ScaffoldMessenger.of(context)
                        ..hideCurrentSnackBar()
                        ..showSnackBar(snackBar);
                    },
                  );
                  selectedTenantAlias = '';
                  searchOptionSelected = '';
                  isSelected = false;
                }
              });
              _newformKey.currentState!.reset();
              return null;
            },
            hint: 'Search Utility',
            itemHeight: 50,
            onTapOutside: (p0) {
              FocusScope.of(context).unfocus();
            },
            scrollbarDecoration: ScrollbarDecoration(),
            suggestionStyle: const TextStyle(color: kblack),
            onSuggestionTap: (SearchFieldListItem<TenantModel> x) {
              searchOptionSelected = x.item!.name;
              debugPrint(searchOptionSelected);
              selectedTenantAlias = x.item!.alias.toString();
              ref
                  .read(authProvider.notifier)
                  .getUtilitiesForTenant(selectedTenantAlias)
                  .onError(
                (error, stackTrace) {
                  final snackBar = SnackBar(
                    elevation: 0,
                    behavior: SnackBarBehavior.floating,
                    backgroundColor: Colors.transparent,
                    content: AwesomeSnackbarContent(
                      title: 'On Snap!',
                      message: error.toString(),
                      contentType: ContentType.failure,
                    ),
                  );

                  ScaffoldMessenger.of(context)
                    ..hideCurrentSnackBar()
                    ..showSnackBar(snackBar);
                },
              );
              isSelected = true;
              FocusScope.of(context).unfocus();
            },
            suggestions: _searchController.text.length > 2
                ? ref
                    .watch(authProvider)
                    .tenants
                    .map((e) => SearchFieldListItem<TenantModel>(
                        e.name.toString(),
                        item: e))
                    .toList()
                : [],
          ),
          SizedBox(
            height: 10.h,
          ),
          CommonText(
            title: "Service Provider",
            fontSize: 16.sp,
          ),
          Form(
            key: _newformKey,
            child: CommonDropdown(
              validator: (value) =>
                  value == null ? "Please Select Service Provider!" :

null, hint: "Select Service provider", items: ref.watch(authProvider).utilities.toList().map( (e) { return DropdownMenuItem( value: e, child: Text(e.name.toString()), ); }, ).toList(), onChanged: (value) { selectUtilityId = value.id; }, ), ), SizedBox( height: 15.h, ), CommonElevatedButton( onPressed: () {

                // }
                context.push(RouteLocation.login);
              },
              title: "Setup"),
          SizedBox(
            height: 15.h,
          ),
        ],
        belowchildren: const [],
      ),
    ));

} } THE ABOVE CODE IS MAIN CODE

Below is common widget that was created import 'package:consumer_app/utils/color_constants.dart'; import 'package:flutter/material.dart';

class AuthDesignScreen extends StatelessWidget { const AuthDesignScreen( {super.key, required this.title, required this.subTitle, required this.mainchildren, required this.belowchildren, this.formKey}); final String title; final String subTitle; final List mainchildren; final List belowchildren; final Key? formKey;

@override Widget build(BuildContext context) { return Form( key: formKey, child: Stack( children: [ Positioned( top: MediaQuery.of(context).size.height 0.12, left: MediaQuery.of(context).size.width 0.07, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text(title, style: const TextStyle( fontSize: 24, fontWeight: FontWeight.w600, color: kBackgroundColor, letterSpacing: 2.0)), const SizedBox( height: 5, ), Text(subTitle, style: const TextStyle( fontSize: 14, fontWeight: FontWeight.w500, color: kBackgroundColor, )), SizedBox( height: MediaQuery.of(context).size.height 0.12, ), ], ), ), Positioned( top: MediaQuery.of(context).size.height 0.05, left: MediaQuery.of(context).size.width 0.0125, child: SizedBox( width: MediaQuery.of(context).size.width 1, child: Image.asset( "assets/images/app_main_background126.png", fit: BoxFit.fitWidth, ), )), Positioned( top: MediaQuery.of(context).size.height 0.29, left: 0, right: 0, child: Container( height: MediaQuery.of(context).size.height, decoration: const BoxDecoration( color: Colors.white, borderRadius: BorderRadius.only( topLeft: Radius.circular(36), topRight: Radius.circular(36), ), ), ), ), Positioned( top: MediaQuery.of(context).size.height 0.27, left: MediaQuery.of(context).size.width 0.05, right: MediaQuery.of(context).size.width 0.05, child: Container( decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(12), boxShadow: [ BoxShadow( color: Colors.grey.withOpacity(0.5), blurRadius: 10) ]), child: Padding( padding: EdgeInsets.all(MediaQuery.of(context).size.width 0.05 ), child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.start, children: mainchildren, ), ), ), ), Positioned( top: MediaQuery.of(context).size.height 0.70, left: MediaQuery.of(context).size.width 0.109, right: MediaQuery.of(context).size.width 0.109, child: Column( crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.start, children: belowchildren), ), ], ), ); } }

I hope now you can find the problem I really want to use this package it is very useful when working please check it and let me know if i am doing anything wrong here

On Sun, Jul 28, 2024 at 5:59 PM Varun Bhosle @.***> wrote:

Ok I will test that and let you know

On Thu, 25 Jul 2024, 06:19 Mahesh Jamdade, @.***> wrote:

I have verified in both release and debug build.

  1. You should try replacing Searchfield with a normal TextField and see if you have that issue, If it does then it means there is an issue with your code
  2. If you only see the issue when using the searchfield package then please share a minimal and complete code sample for us to reproduce the issue.

— Reply to this email directly, view it on GitHub https://github.com/maheshj01/searchfield/issues/158#issuecomment-2249128291, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANSS4TPXF52UGJQHAQB4EVDZOBDP5AVCNFSM6AAAAABLJ2KLM6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENBZGEZDQMRZGE . You are receiving this because you were mentioned.Message ID: @.***>

maheshj01 commented 4 months ago

@varun-a50 You are just adding new questions without really answering the query that you have been asked, Pleae see the conversation above.

you didn't answer what device/platform you are facing the issue on, whether you tried using a normal TextField, Neither does the code sample you shared is a minimal reproducible code sample

I have verified in both release and debug build.

  1. You should try replacing Searchfield with a normal TextField and see if you have that issue, If it does then it means there is an issue with your code
  2. If you only see the issue when using the searchfield package then please share a minimal and complete code sample for us to reproduce the issue.

Please providet the answers to above before investigating further

varun-a50 commented 4 months ago

I have test it on Pixel 3a XL API 33 (emulator) And oneplus 11r Nothing 2

Now I guess I have answered your question that this many devices I have tested the app

And for the minimal code requirement: I have given you the common widget that I am using named "AuthDesignScreen" in which I have column in the column widget I am using your "searchfield" widget what else do you need?

On Mon, 29 Jul 2024, 19:14 Mahesh Jamdade, @.***> wrote:

@varun-a50 https://github.com/varun-a50 You are just adding new questions without really answering the query that you have been asked, Pleae see the conversation above.

you didn't answer what device/platform you are facing the issue on, whether you tried using a normal TextField, Neither does the code sample you shared is a minimal reproducible code sample

I have verified in both release and debug build.

  1. You should try replacing Searchfield with a normal TextField and see if you have that issue, If it does then it means there is an issue with your code
  2. If you only see the issue when using the searchfield package then please share a minimal and complete code sample for us to reproduce the issue.

Please providet the answers to above before investigating further

— Reply to this email directly, view it on GitHub https://github.com/maheshj01/searchfield/issues/158#issuecomment-2255988776, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANSS4TMWFXB6YQG7A22XAPLZOZBKXAVCNFSM6AAAAABLJ2KLM6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENJVHE4DQNZXGY . You are receiving this because you were mentioned.Message ID: @.***>

maheshj01 commented 4 months ago

@varun-a50 The code sample shared above is not a minimal reproducible code sample, Please use this guideline for creating a minimal reproducible example https://stackoverflow.com/help/minimal-reproducible-example

Your code should be minimal without any thirdparty packages and yet reproduce the issue. I would also recommend you to try running the example app and see if the issue reproduces

varun-a50 commented 4 months ago

Thank you Mahesh for educating me on this. I have found the problem. It is not in the package but in the theme color I am using. I don't know why other widgets are working and taking the desired theme color and not searchfield, It was working fine with another widget a couple days ago. Now that I have found the problem I can solve that problem, the problem was from my side indeed. Please accept my apology. you had to recheck the correctly working package, I hope if in future somebody faces the same problem it might be this one...

Thank you

On Tue, Jul 30, 2024 at 7:18 AM Mahesh Jamdade @.***> wrote:

@varun-a50 https://github.com/varun-a50 The code sample shared above is not a minimal reproducible code sample, Please use this guideline for creating a minimal reproducible example https://stackoverflow.com/help/minimal-reproducible-example

Your code should be minimal without any thirdparty packages and yet reproduce the issue. I would also recommend you to try running the example app https://github.com/maheshj01/searchfield/tree/master/example and see if the issue reproduces

— Reply to this email directly, view it on GitHub https://github.com/maheshj01/searchfield/issues/158#issuecomment-2257304231, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANSS4TOPB4YSV3A3HADW4C3ZO3WIRAVCNFSM6AAAAABLJ2KLM6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENJXGMYDIMRTGE . You are receiving this because you were mentioned.Message ID: @.***>

maheshj01 commented 4 months ago

Glad you found the issue. Closing as invalid!