I used animated_custom_dropdown: 1.2.2package and try this code to create a search bar with a dropdown. but I'm getting a huge error. how to solve this issue.

/C:/src/flutter/.pub-cache/hosted/pub.dartlang.org/animated_custom_dropdown-1.2.2/lib/dropdown_overlay.dart:57:29: Error: Method 'addPostFrameCallback' cannot be called on 'WidgetsBinding?' because it is potentially null.

• 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/C:/src/flutter/packages/flutter/lib/src/widgets/binding.dart'). Try calling using ?. instead. WidgetsBinding.instance.addPostFrameCallback((_) { ^^^^^^^^^^^^^^^^^^^^ /C:/src/flutter/.pub-cache/hosted/pub.dartlang.org/animated_custom_dropdown-1.2.2/lib/dropdown_overlay.dart:185:33: Error: No named parameter with the name 'thumbVisibility'. thumbVisibility: MaterialStateProperty.all( ^^^^^^^^^^^^^^^ /C:/src/flutter/packages/flutter/lib/src/material/scrollbar_theme.dart:33:9: Context: Found this candidate, but the arguments don't match. const ScrollbarThemeData({ ^^^^^^^^^^^^^^^^^^

FAILURE: Build failed with an exception.

• Where: Script 'C:\src\flutter\packages\flutter_tools\gradle\flutter.gradle' line: 1102

• What went wrong: Execution failed for task ':app:compileFlutterBuildDebug'.

Process 'command 'C:\src\flutter\bin\flutter.bat'' finished with non-zero exit value 1

• Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

• Get more help at https://help.gradle.org

BUILD FAILED in 48s Exception: Gradle task assembleDebug failed with exit code 1

import 'package:animated_custom_dropdown/custom_dropdown.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';



const _labelStyle = TextStyle(fontWeight: FontWeight.w600);

class FantomSearch extends StatefulWidget {
  const FantomSearch({Key? key}) : super(key: key);

  @override
  State<FantomSearch> createState() => _FantomSearchState();
}

class _FantomSearchState extends State<FantomSearch> {
  final formKey = GlobalKey<FormState>();
  final List<String> list = ['Developer', 'Designer', 'Consultant', 'Student'];
  final jobRoleDropdownCtrl = TextEditingController(),
      jobRoleFormDropdownCtrl = TextEditingController(),
      jobRoleSearchDropdownCtrl = TextEditingController();

  @override
  void dispose() {
    jobRoleDropdownCtrl.dispose();
    jobRoleFormDropdownCtrl.dispose();
    jobRoleSearchDropdownCtrl.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey[200],
      appBar: AppBar(
        systemOverlayStyle: SystemUiOverlayStyle.dark.copyWith(
          statusBarColor: Colors.white,
        ),
        backgroundColor: Colors.white,
        elevation: .25,
        title: const Text(
          'Custom Dropdown Example',
          style: TextStyle(color: Colors.black, fontSize: 18),
        ),
      ),
      body: ListView(
        padding: const EdgeInsets.all(16.0),
        children: [
          const Text('Job Roles Dropdown', style: _labelStyle),
          const SizedBox(height: 8),
          CustomDropdown(
            hintText: 'Select job role',
            items: list,
            controller: jobRoleDropdownCtrl,
            excludeSelected: false,
          ),
          const SizedBox(height: 24),
          const Divider(height: 0),
          const SizedBox(height: 24),

          // dropdown having search field
          const Text('Job Roles Search Dropdown', style: _labelStyle),
          const SizedBox(height: 8),
          CustomDropdown.search(
            hintText: 'Select job role',
            items: list,
            controller: jobRoleSearchDropdownCtrl,
          ),
          const SizedBox(height: 24),
          const Divider(height: 0),
          const SizedBox(height: 24),

          // using form for validation
          Form(
            key: formKey,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const Text(
                  'Job Roles Dropdown with Form validation',
                  style: _labelStyle,
                ),
                const SizedBox(height: 8),
                CustomDropdown(
                  hintText: 'Select job role',
                  items: list,
                  controller: jobRoleFormDropdownCtrl,
                  excludeSelected: false,
                ),
                const SizedBox(height: 16),
                SizedBox(
                  width: double.infinity,
                  child: ElevatedButton(
                    onPressed: () {
                      if (!formKey.currentState!.validate()) {
                        return;
                      }
                    },
                    child: const Text(
                      'Submit',
                      style: TextStyle(fontWeight: FontWeight.w600),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

CodePudding user response：

Downgrade the animated_custom_dropdown version to 1.2.1. The version you are using is upgraded to flutter 3.

Please check change log here