DropdownMenuItem width is affected by selectedItemBuilder width #133267
Description
Is there an existing issue for this?
- I have searched the existing issues
- I have read the guide to filing a bug
Steps to reproduce
-
I am trying to have a DropdownMenuItem with DropdownButton but when i try to have selectedItemBuilder because i want a different widget to show rather than the whole value when i apply that it affect the DropdownMenuItem about the width
-
Even if i apply the same widget of the DropdownMenuItem in the selectedItemBuilder the widget will change which i have to adjusted until it will match the one in the DropdownMenuItem you can bellow code example to understand more of the problem.
Just in case you want the selectedItemBuilder result here it is:
Expected results
I am expecting this from the DropdownMenuItem this is without the selectedItemBuilder
Actual results
But i get this if i have selectedItemBuilder
If i have expanded on the text i get this
Code sample
Code sample
TextField(
decoration: InputDecoration(
prefixIcon: Padding(
padding:
const EdgeInsets.symmetric(horizontal: 20),
child: DropdownButton(
value: selectedCurrency,
selectedItemBuilder: (BuildContext context) {
return currency.map((items) {
return SizedBox(
width: 30,
child: FittedBox(
fit: BoxFit.contain,
child: CircleAvatar(
backgroundImage:
AssetImage(items['imagePath']),
),
),
);
}).toList();
},
underline: const SizedBox(),
icon: const Icon(
Icons.keyboard_arrow_down_rounded,
color: Colors.black,
),
items: currency.map((items) {
return DropdownMenuItem(
alignment: Alignment.centerLeft,
value: items['Text'],
child: Row(
children: [
CircleAvatar(
radius: 13,
backgroundImage:
AssetImage(items['imagePath']),
),
sizedBoxWidth(5),
Expanded(
child: Text(
items['Text'],
style: const TextStyle(
fontWeight: FontWeight.bold),
),
),
],
),
);
}).toList(),
onChanged: (value) {
setState(() {
selectedCurrency = value as String;
});
},
),
),
),
),Screenshots or Video
Screenshots / Video demonstration
[Upload media here]
Logs
Logs
Reloaded 1 of 1098 libraries in 711ms (compile: 44 ms, reload: 199 ms, reassemble: 291 ms).
D/EGL_emulation(10611): app_time_stats: avg=1116.81ms min=2.03ms max=14462.71ms count=13
D/EGL_emulation(10611): app_time_stats: avg=6354.91ms min=6354.91ms max=6354.91ms count=1
════════ Exception caught by rendering library ═════════════════════════════════
The following assertion was thrown during layout:
A RenderFlex overflowed by 3.0 pixels on the right.
The relevant error-causing widget was
Row
donationPage.dart:276
You can inspect this widget using the 'Inspect Widget' button in the VS Code notification.
The overflowing RenderFlex has an orientation of Axis.horizontal.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size.
This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView.
The specific RenderFlex in question is: RenderFlex#10c67 relayoutBoundary=up1 OVERFLOWINGFlutter Doctor output
Doctor output
[✓] Flutter (Channel stable, 3.13.0, on Microsoft Windows [Version 10.0.22621.2134], locale en-US)
• Flutter version 3.13.0 on channel stable at E:\flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision efbf63d9c6 (9 days ago), 2023-08-15 21:05:06 -0500
• Engine revision 1ac611c64e
• Dart version 3.1.0
• DevTools version 2.25.0
[✓] Windows Version (Installed version of Windows is version 10 or higher)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
• Android SDK at C:\Users\Zheer\AppData\Local\Android\sdk
• Platform android-33-ext4, build-tools 33.0.2
• Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java
• Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-9586694)
• All Android licenses accepted.
[✓] Chrome - develop for the web
• Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe
[✓] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.5.0)
• Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
• Visual Studio Community 2022 version 17.5.33414.496
• Windows 10 SDK version 10.0.22000.0
[✓] Android Studio (version 2022.2)
• Android Studio at C:\Program Files\Android\Android Studio
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• android-studio-dir = C:\Program Files\Android\Android Studio
• Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-9586694)
[✓] VS Code (version 1.81.1)
• VS Code at C:\Users\Zheer\AppData\Local\Programs\Microsoft VS Code
• Flutter extension version 3.46.0
[✓] Connected device (4 available)
• sdk gphone64 x86 64 (mobile) • emulator-5556 • android-x64 • Android 12 (API 32) (emulator)
• Windows (desktop) • windows • windows-x64 • Microsoft Windows [Version 10.0.22621.2134]
• Chrome (web) • chrome • web-javascript • Google Chrome 116.0.5845.98
• Edge (web) • edge • web-javascript • Microsoft Edge 114.0.1823.67
[✓] Network resources
• All expected network resources are available.
• No issues found!Metadata
Metadata
Assignees
Labels
Important issues not at the top of the work listflutter/packages/flutter/material repository.Found to occur in 3.13Found to occur in 3.14flutter/packages/flutter repository. See also f: labels.The issue has been confirmed reproducible and is ready to work onIssue is closed as already fixed in a newer versionOwned by Design Languages teamTriaged by Design Languages team
Type
Projects
Status