I coded a dropdownbutton so it gets the items from a database from back4app, it shows the user the items that he saved on said database. But when I try to hold the state for the selection of said item, it shows a blank dropdownbutton, eventhough it is showing the items from the database. Here is the error: [A value of type 'String' can't be assigned to a variable of type 'List'.
Try changing the type of the variable, or casting the right-hand type to 'List']. What did I do wrong?
DropdownButton<String>(
items: dropdownItems.map((ParseObject value) {
return DropdownMenuItem<String>(
value: value.get<String>('numeracao')!,
child: Text(value.get<String>('numeracao')!),
);
}).toList(),
onChanged: (String? newValue) {
setState(() {
dropdownItems = newValue!;
});
},
),
You need a new var to hold the current value. Let's say String dropdownValue. Then your DropownButton should look something like this:
DropdownButton<String>(
value: dropdownValue,
items: dropdownItems.map((ParseObject value) {
return DropdownMenuItem<String>(
value: value.get<String>('numeracao')!,
child: Text(value.get<String>('numeracao')!),
);
}).toList(),
onChanged: (String? newValue) {
setState(() {
dropdownValue = newValue!;
});
},
),
Related
My DropdownMenuItem coming from API. How to disable the dropDown once user select a item from the list?
child: DropdownButton<Partner>(
value:
_selectedLab, //USER SELECTED DROPDOWN ITEM VALUE
hint: Text("Select Lab"),
isExpanded: true,
items: data.map((Partner data) =>
DropdownMenuItem<Partner>(
child: Text("${data.partnerName}"),
value: data,
)).toList().cast<DropdownMenuItem<Partner>>(),
onChanged: (val) {
setState(() {
_selectedLab = val!;
encLabId = val.encPartnerId;
getTestByLabResult = getTestByLab();
});
},
),
Create a bool on state bool absoreTap = false; and wrap you DropdownButton with AbsorbPointer like
AbsorbPointer(
absorbing: absoreTap,
child: DropdownButton<Partner>(
value:
_selectedLab, //USER SELECTED DROPDOWN ITEM VALUE
hint: Text("Select Lab"),
isExpanded: true,
items: data.map((Partner data) =>
DropdownMenuItem<Partner>(
child: Text("${data.partnerName}"),
value: data,
)).toList().cast<DropdownMenuItem<Partner>>(),
onChanged: (val) {
setState(() {
_selectedLab = val!;
encLabId = val.encPartnerId;
getTestByLabResult = getTestByLab();
absoreTap = true; ///
});
},
),
You can also check Ignore-pointer here is the different between them
I have 4 different dropdown fields with 5 options and I want to disable/remove an option from other fields if the option is already selected.
Screenshot:
Screenshot 1
Screenshot 2
DropDown Menu Code:
String opemo1, opemo2, opemo3, opemo4;
List<String> emoji = [
"❤️",
"🤩",
"✌️",
"😂",
"😡",
];
DropdownButtonFormField(
validator: (value) =>
value == null ? 'required' : null,
hint: Text('❤️'),
value: opemo1,
icon: Icon(Icons.arrow_drop_down),
iconSize: 36,
isExpanded: true,
style: TextType.regularDarkText,
onChanged: (newValue) {
setState(() {
opemo1 = newValue;
pollDataController.setop1Emoji(newValue);
});
},
items: emoji.map((opemo1) {
return DropdownMenuItem(
value: opemo1,
child: Text(opemo1),
);
}).toList(),
),
To manage it you need to remove the selected emoji from List<String> emoji.
onChanged: (newValue) {
setState(() {
emoji.removeWhere((element) => element == newValue); /// This removed selected emoji.
opemo1 = newValue;
pollDataController.setop1Emoji(newValue);
});
},
You can replace your onChanged with this snippet.
I'm trying to store the possible values for a DropDownButton in a variable.
Goal:
On the press of a button, I want a new list of Strings to be created and assigned as possible choices for the DropdownButton. To do so, I need to store the possible choices (list of DropdownMenuItem) in a variable.
This sample of code works:
static String defaultDropDownValue = 'Select your Network';
String dropdownValue = defaultDropDownValue;
[...]
new Flexible(
child: DropdownButton(
isExpanded: true,
value: dropdownValue,
onChanged: (String newValue) {
setState(() {
dropdownValue = newValue;
});
_checkSsid();
},
items: <String>[defaultDropDownValue, 'One', 'Two', 'Three', 'Four']
.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
),
),
[...]
Now, this sample of code does not work:
static String defaultDropDownValue = 'Select your Network';
String dropdownValue = defaultDropDownValue;
List<DropdownMenuItem> dropdownList = [defaultDropDownValue, 'one', 'two'].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList();
[...]
new Flexible(
child: DropdownButton(
isExpanded: true,
value: dropdownValue,
onChanged: (String newValue) {
setState(() {
dropdownValue = newValue;
});
_checkSsid();
},
items: dropdownList,
),
),
[...]
The compiler returns the following error message:
Error: The argument type 'Null Function(String)' can't be assigned to
the parameter type 'void Function(dynamic)'. Try changing the type of
the parameter, or casting the argument to 'void Function(dynamic)'.
onChanged: (String newValue) {
I don't really understand the meaning of the message, nor its cause.
Becasue you don't explicitly define the Type for array in the second example,
You could try DropdownMenuItem<String> and DropdownButton<String> to explicit them.
static String defaultDropDownValue = 'Select your Network';
String dropdownValue = defaultDropDownValue;
List<DropdownMenuItem<String>> dropdownList = [defaultDropDownValue, 'one', 'two'].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList();
[...]
new Flexible(
child: DropdownButton<String>(
isExpanded: true,
value: dropdownValue,
onChanged: (String newValue) {
setState(() {
dropdownValue = newValue;
});
_checkSsid();
},
items: dropdownList,
),
),
[...]
Referenced from DropdownButton's Documentation below:
The type T is the type of the value that each dropdown item represents. All the entries in a given menu must represent values with consistent types. Typically, an enum is used. Each DropdownMenuItem in items must be specialized with that same type argument.
I have flutter dropdown select list:
as
ListTile(
leading: const Icon(Icons.local_shipping),
title: DropdownButton<String>(
value: serviceProvider,
// hint: const Text('Select Service Provider'),
onChanged: (String newValue) {
setState(() {
serviceProvider = newValue;
});
},
items: <Map>[{"id":"1","business_name":'Business Name 1'}, {"id":"3","business_name":'Business Name 3'}, {"id":"6","business_name":'Business Name 6'}, {"id":"5","business_name":'Business Name 5'}].map<DropdownMenuItem<String>>((Map value) {
return DropdownMenuItem<String>(
value: value['id'],
child: Text(value['business_name']),
);
}).toList(),
),
),
If i decleare String serviceProvider = "6"; it just work fine. but after selecting one item from list it doest not persist there.
I am not able to figure out what's missing in my code,
Thanks
")
I wanted to control a drop-down button and make it unclickable using a button.
Is there any way to make it disable. Basically not allowing it able to change.
new DropdownButton(
value: animalName,
items: animals.map(
(String value) {
return new DropdownMenuItem<String>(
value: value,
child: new Text('$value'),
);
},
).toList(),
onChanged: (value) {
setState(() {
animalName = value;
});
},
),
So this is the code I currently use on the drop-down button, but i cant disabled it.
Found this in the DropdownButton docs:
If items or onChanged is null, the button will be disabled, the down arrow will be grayed out, and the disabledHint will be shown (if provided)
DropdownButton(
onChanged: null,
items: [...],
)
This isn't what you want to hear, but I don't think there's currently an easy way. I experimented with simply removing all the items and that causes a nice little crash. Maybe worth raising an issue with the flutter people on github...
There is an alternative that may be good enough for you for now. If you wrap your DropdownButton in an IgnorePointer, when you want it to be disabled you can change IgnorePointer's ignoring property to true.
That way if the user taps on it, it won't do anything.
But you'll probably want to indicate to the user somehow that it's disabled as well, something like setting the hint text (as it's grey).
child: new IgnorePointer(
ignoring: true,
child: new DropdownButton(
hint: new Text("disabled"),
items: ["asdf", "wehee", "asdf2", "qwer"].map(
(String value) {
return new DropdownMenuItem<String>(
value: value,
child: new Text('$value'),
);
},
).toList(),
onChanged: (value) {},
),
You can make DropdownButtonFormField or DropdownButton disabled if set onChanged to null, and if you want that dropdown still shows selected value you must set disabledHint. For example:
DropdownButtonFormField<String>(
disabledHint: Text(_selectedItem),
value: _selectedItem,
onChanged: enabled ? (value) => setState(() => _selectedItem = value) : null,
items: items.map<DropdownMenuItem<String>>((item) {
return DropdownMenuItem(
value: item,
child: Text(item),
);
}).toList(),
)
Just wrap it with IgnorePointer widget to make DropdownButton disable
IgnorePointer(
ignoring: enabled,
child: new DropdownButton(
value: animalName,
items: animals.map(
(String value) {
return new DropdownMenuItem<String>(
value: value,
child: new Text('$value'),
);
},
).toList(),
onChanged: (value) {
setState(() {
animalName = value;
});
},
),
);
If items or onChanged is null, the button will be disabled, the down
arrow will be grayed out, and the disabledHint will be shown (if
provided)
So something like this should work:
DropdownButton<String>(
...
onChanged: this.enabled ? (id) => setState(() => this.id = id) : null,
)
okay, i found a trick that satisfied me
i wanted it hide/show the DropdownButton depending on CheckboxListTile
in StatefulWidget Class
first create a function ex:
_buildDropDown(bool enable) {
if (enable) {
return DropdownButton<String>(
hint: Text("Hint"),
items: <String>[
'item 1',
'item 2',
'item 3',
].map((String value) {
return new DropdownMenuItem<String>(
value: value,
child: new Text(value),
);
}).toList(),
onChanged: (value) {},
);
} else { // Just Divider with zero Height xD
return Divider(color: Colors.white, height: 0.0);
}
}
and now in build
bool enable = true;
#override
Widget build(BuildContext context) {
return Column(
children: <Widget>[
CheckboxListTile(
title: const Text('Switcher'),
selected: true,
value: enable,
onChanged: (bool value) {
setState(() {
enable = value;
});
},
),
_buildDropDown(enable),
],
);
}
now every time you change enable it will display and hide the DropdownButton
DropdownButtonFormField(
onChange: isDisable ? null : (str){
},
disabledHint: isDisable ? null : Text('Your hint text'),
...
)
For disable
onChange: null
For disable Caption
disabledHint: Text('Your hint text')
//add widget'AbsorbPointer' true-disable,false-enable
// isEditable = ture
AbsorbPointer(
absorbing: isEditable
DropdownButton(
onChanged: null,
items: [...],
)
)
Simple:
decoration:InputDecoration(enabled: false),