i want ask about how too create dropdown button, i have dropdawnbutton code inside main screen code,i need convert dropdawnbutton to custome widjet,becouse i need use this dropdawnbutton many screens,i need also print drop down selected value from same screen
i try create statfull widjet but i can not catch Dropdown Button selected value.

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:flutter_application_1/Models/cachdata.dart';
import 'package:flutter_application_1/uti/themes.dart';
import 'package:flutter_application_1/widget/testWidjet/dropdaown.dart';
import 'package:http/http.dart' as http;
Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  CacheData.cacheInitialization();
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: Themes.light,
      home: const MyHomePage(
        title: "test",
      ),
    );
  }
}
class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;
`your text`  @override
  State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
  List categoryItemlist = [];
  Future getAllCategory() async {
    var baseUrl = "https://gssskhokhar.com/api/classes/";
    http.Response response = await http.get(Uri.parse(baseUrl));
    if (response.statusCode == 200) {
      var jsonData = json.decode(response.body);
      setState(() {
        categoryItemlist = jsonData;
      });
    }
  }
  @override
  void initState() {
    super.initState();
    getAllCategory();
  }
  var dropdownvalue;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("DropDown List"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            //-----------------------------------------DropdownButton-------------------------
            Container(
              padding: const EdgeInsets.only(left: 16, right: 16),
              decoration: BoxDecoration(
                border: Border.all(color: Colors.amber),
                borderRadius: BorderRadius.circular(15),
              ),
              child: DropdownButton(
                underline: Container(),
                hint: const Text('hooseNumber'),
                items: categoryItemlist.map((item) {
                  return DropdownMenuItem(
                    value: item['ClassCode'].toString(),
                    child: Text(
                      item['ClassName'].toString(),
                      style: const TextStyle(color: Colors.amber, fontSize: 16),
                    ),
                  );
                }).toList(),
                onChanged: (newVal) {
                  setState(() {
                    dropdownvalue = newVal;
                  });
                },
                value: dropdownvalue,
              ),
            ),
            //--------------------------------------end DropdownButton---------------------
            ElevatedButton(onPressed: () {}, child: const Text("print Drop down selected value")),
          ],
        ),
      ),
    );
  }
    }