title: Using Dropdown_button2 package does not work for a card view in Flutter
body: <p>I want to make an SVG icon I have to show a dropdown on this card.
  I am using Dropdown_button2 package. <a href="https://pub.dev/packages/dropdown_button2" rel="nofollow noreferrer">https://pub.dev/packages/dropdown_button2</a></p>
  <p>I was able to get the dropdown button working independently.</p>
  <p>here is how I did it</p>
  <pre><code>import 'package:flutter/material.dart';
  import 'package:dropdown_button2/dropdown_button2.dart';
  import 'package:flutter_svg/svg.dart';
  
  class CustomButtonTest extends StatefulWidget {
    const CustomButtonTest({Key? key}) : super(key: key);
  
    @override
    State&lt;CustomButtonTest&gt; createState() =&gt; _CustomButtonTestState();
  }
  
  class _CustomButtonTestState extends State&lt;CustomButtonTest&gt; {
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        body: Stack(
          children: [
            DropdownButtonHideUnderline(
              child: DropdownButton2(
                customButton: SvgPicture.asset(
                  'assets/threedots.svg',
                  height: 30,
                  width: 30,
                ),
                customItemsIndexes: const [4],
                customItemsHeight: 8,
                items: [
                  ...MenuItems.firstItems.map(
                    (item) =&gt; DropdownMenuItem&lt;MenuItem&gt;(
                      value: item,
                      child: MenuItems.buildItem(item),
                    ),
                  ),
                ],
                onChanged: (value) {
                  MenuItems.onChanged(context, value as MenuItem);
                },
                itemHeight: 40,
                itemPadding: const EdgeInsets.only(left: 16, right: 16),
                dropdownWidth: 160,
                dropdownPadding: const EdgeInsets.symmetric(vertical: 6),
                dropdownDecoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(4),
                  color: Colors.black87,
                ),
                dropdownElevation: 8,
                offset: const Offset(0, 8),
              ),
            ),
          ],
        ),
      );
    }
  }
  
  class MenuItem {
    final String text;
    final IconData icon;
  
    const MenuItem({
      required this.text,
      required this.icon,
    });
  }
  
  class MenuItems {
    static const List&lt;MenuItem&gt; firstItems = [
      profilepic,
      coverpic,
      nametag,
      aboutme
    ];
  
    static const profilepic =
        MenuItem(text: 'Profile Picture', icon: Icons.person_pin_outlined);
    static const coverpic = MenuItem(text: 'Cover Image', icon: Icons.image);
    static const nametag = MenuItem(text: 'Nametag', icon: Icons.person_add);
    static const aboutme =
        MenuItem(text: 'About Me', icon: Icons.bookmark_added_rounded);
  
    static Widget buildItem(MenuItem item) {
      return Row(
        children: [
          Icon(item.icon, color: Colors.white, size: 20),
          const SizedBox(
            width: 10,
          ),
          Text(
            item.text,
            style: const TextStyle(
              fontSize: 14,
              color: Colors.white,
            ),
          ),
        ],
      );
    }
  
    static onChanged(BuildContext context, MenuItem item) {
      switch (item) {
        case MenuItems.profilepic:
          //Do something
          break;
        case MenuItems.nametag:
          //Do something
          break;
        case MenuItems.coverpic:
          //Do something
          break;
        case MenuItems.aboutme:
          //Do something
          break;
      }
    }
  }
  </code></pre>
  <p>But Infusing this code with my postcard renders the button use less
  Here is my approach for the same.</p>
  <pre><code>import 'package:dropdown_button2/dropdown_button2.dart';
  import 'package:flutter/material.dart';
  import 'package:flutter_svg/svg.dart';
  
  class ProfilePageCard extends StatefulWidget {
    const ProfilePageCard({Key? key}) : super(key: key);
  
    @override
    State&lt;ProfilePageCard&gt; createState() =&gt; _ProfilePageCardState();
  }
  
  class _ProfilePageCardState extends State&lt;ProfilePageCard&gt; {
    final double coverHeight = 232;
    final double profileHeight = 225;
    final double profileWidth = 169;
  
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        body: Stack(
          clipBehavior: Clip.none,
          alignment: Alignment.centerLeft,
          children: [
            buildCoverImage(),
            const Positioned(
              top: 198,
              left: 350,
              child: Icon(
                Icons.perm_contact_cal,
                color: Colors.white,
              ),
            ),
            Positioned(
              top: 185,
              left: 6,
              child: buildProfileImage(),
            ),
            Positioned(
              top: 185 + 214,
              left: 148,
              child: DropdownButtonHideUnderline(
                child: DropdownButton2(
                  customButton: SvgPicture.asset(
                    'assets/threedots.svg',
                    height: 30,
                    width: 30,
                  ),
                  customItemsIndexes: const [4],
                  customItemsHeight: 8,
                  items: [
                    ...MenuItems.firstItems.map(
                      (item) =&gt; DropdownMenuItem&lt;MenuItem&gt;(
                        value: item,
                        child: MenuItems.buildItem(item),
                      ),
                    ),
                  ],
                  onChanged: (value) {
                    MenuItems.onChanged(context, value as MenuItem);
                  },
                  itemHeight: 40,
                  itemPadding: const EdgeInsets.only(left: 16, right: 16),
                  dropdownWidth: 160,
                  dropdownPadding: const EdgeInsets.symmetric(vertical: 6),
                  dropdownDecoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(4),
                    color: Colors.black87,
                  ),
                  dropdownElevation: 8,
                  offset: const Offset(0, 8),
                ),
              ),
            ),
          ],
        ),
      );
    }
  
    Widget buildCoverImage() =&gt; Container(
          color: Colors.grey,
          child: Image.network(
            'https://images.unsplash.com/photo-1488646953014-85cb44e25828?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxleHBsb3JlLWZlZWR8MXx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1000&amp;q=60',
            width: double.infinity,
            height: coverHeight,
            fit: BoxFit.cover,
          ),
        );
  
    Widget buildProfileImage() =&gt; Container(
          decoration: BoxDecoration(
            border: Border.all(
              width: 6,
              color: Colors.white,
            ),
          ),
          child: Image.network(
            'https://images.unsplash.com/photo-1553860214-87b92d6c1e22?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxleHBsb3JlLWZlZWR8OXx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1000&amp;q=60',
            width: profileWidth,
            height: profileHeight,
            fit: BoxFit.cover,
          ),
        );
  
    Widget buildUsername() =&gt; SizedBox(
          width: 193,
          child: IntrinsicHeight(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: const [
                Text(
                  &quot;XYZ Traveler&quot;,
                  style: TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.bold,
                      fontFamily: 'Inter'),
                ),
              ],
            ),
          ),
        );
  }
  
  class MenuItem {
    final String text;
    final IconData icon;
  
    const MenuItem({
      required this.text,
      required this.icon,
    });
  }
  
  class MenuItems {
    static const List&lt;MenuItem&gt; firstItems = [home, share, settings, logout];
  
    static const home =
        MenuItem(text: 'Profile Picture', icon: Icons.person_pin_outlined);
    static const share = MenuItem(text: 'Cover Image', icon: Icons.image);
    static const settings = MenuItem(text: 'Nametag', icon: Icons.person_add);
    static const logout = MenuItem(text: 'Log Out', icon: Icons.logout);
  
    static Widget buildItem(MenuItem item) {
      return Row(
        children: [
          Icon(item.icon, color: Colors.white, size: 20),
          const SizedBox(
            width: 10,
          ),
          Text(
            item.text,
            style: const TextStyle(
              fontSize: 14,
              color: Colors.white,
            ),
          ),
        ],
      );
    }
  
    static onChanged(BuildContext context, MenuItem item) {
      switch (item) {
        case MenuItems.home:
          //Do something
          break;
        case MenuItems.settings:
          //Do something
          break;
        case MenuItems.share:
          //Do something
          break;
        case MenuItems.logout:
          //Do something
          break;
      }
    }
  }
  </code></pre>
  <p>Can anyone point out what am I doing wrong here?</p>