Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to get selected index of dropdownbutton in flutter

Tags:

How to get selectedIndex of dropdown in flutter,

In dropdownbutton there is no property to get selected index, if there how to get the selected index and my code look like this:

new DropdownButton( hint:new Text("Select a users"),value: selectedUser,                onChanged: (String newValue) {                 setState(() {                   selectedUser = newValue;                 });               },               items: userInfoToMap.map((ListOfUsers value) {                 return new DropdownMenuItem<String>(                     value: value.name,                     child:new Text(value.name,style: new TextStyle(color: Colors.black))                 );               })                   .toList(),             ),            ),), 
like image 821
siva kumar Avatar asked Sep 20 '17 13:09

siva kumar


People also ask

How do you get the dropdown selected index in flutter?

Steps to create dropdown: Step 1: Add a variable called dropdownValue that holds the currently selected item. Step 2: Add the DropdownButton widget to your page. Step 3: Inside the DropdownButton, add the value parameter and assign the dropdownValue that we created in step 1.

How do you customize DropdownButton in flutter?

To change the dropdown Button color in Flutter, simply wrap your DropdownButton widget inside the Container and provide the styling instructions inside the decoration property using the BoxDecoration widget. Using the color property (insideBoxDecoration) you can assign the color.

How do I change the default value in DropdownButton flutter?

If we want to set an initial value to the dropdown, simply set the value to the value property. Its value must be included in the items list, otherwise, an error occurs.


2 Answers

You should probably use a custom model object (e.g. User) as the type for DropdownButton.

video

import 'package:flutter/material.dart';  void main() {   runApp(new MyApp()); }  class User {   const User(this.name);       final String name; }  class MyApp extends StatefulWidget {   State createState() => new MyAppState(); }  class MyAppState extends State<MyApp> {   User selectedUser;   List<User> users = <User>[User('Foo'), User('Bar')];       @override   Widget build(BuildContext context) {     return new MaterialApp(       home: new Scaffold(         body: new Center(           child: new DropdownButton<User>(             hint: new Text("Select a user"),             value: selectedUser,             onChanged: (User newValue) {               setState(() {                 selectedUser = newValue;               });             },             items: users.map((User user) {               return new DropdownMenuItem<User>(                 value: user,                 child: new Text(                   user.name,                   style: new TextStyle(color: Colors.black),                 ),               );             }).toList(),           ),         ),       ),     );   } } 
like image 140
Collin Jackson Avatar answered Sep 22 '22 15:09

Collin Jackson


Similar to Collin Jackson's answer, you can simply use a List of Strings and check the indexOf to set the value, which might be preferable in some situations rather than making a User class. If you want to set an initial value set _user to an integer value when defined.

int _user; ...  var users = <String>[   'Bob',   'Allie',   'Jason', ];  return new DropdownButton<String>(   hint: new Text('Pickup on every'),   value: _user == null ? null : users[_user],   items: users.map((String value) {     return new DropdownMenuItem<String>(       value: value,       child: new Text(value),     );   }).toList(),   onChanged: (value) {     setState(() {       _user = users.indexOf(value);     });   }, ); 
like image 38
Nico Westerdale Avatar answered Sep 26 '22 15:09

Nico Westerdale