apptomate_custom_dropdown 0.0.1

This CustomDropDown widget is a reusable, customizable dropdown widget in Flutter that allows you to create dropdown menus with enhanced styling and behavior.

example/lib/main.dart

import 'package:apptomate_custom_dropdown/apptomate_custom_dropdown.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _DropDownExampleState createState() => _DropDownExampleState();
}

class _DropDownExampleState extends State<MyHomePage> {
  MyItem? selectedValue;
  List<MyItem> items = [
    MyItem(id: "1", name: 'Option 1'),
    MyItem(id: "2", name: 'Option 2'),
    MyItem(id: "3", name: 'Option 3'),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Custom DropDown')),
      body: Center(
        child: CustomDropDown<MyItem>(
          items: items,
          value: selectedValue,
          hint: 'Select Option',
          backgroundColor: Colors.white,
          borderColor: Colors.grey,
          borderRadius: 6,
          elevation: 6,
          displayMapper: (MyItem item) => item.name,
          shadowColor: Colors.black26,
          width: 300,
          selectedDropdownTextStyle: TextStyle(color: Colors.grey),
          selectedTextStyle: TextStyle(color: Colors.red),
          dropDownTextStyle: TextStyle(
              color: Colors.black, fontWeight: FontWeight.bold, fontSize: 20),
          dropDownIcon: Icon(Icons.arrow_drop_down_sharp),
          height: 50,
          dropDownText: selectedValue.toString(),
          onChanged: (value) {
            setState(() {
              selectedValue = value;
            });
            print('Selected: $value');
          },
        ),
      ),
    );
  }
}

class MyItem {
  final String id;
  final String name;

  MyItem({required this.id, required this.name});

  @override
  String toString() => name; // Optional, but `displayMapper` takes priority
}