k4zek4ge
10/29/2019 - 10:42 AM

dropdown

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home:  Scaffold(
          resizeToAvoidBottomPadding: false,
      body: SafeArea(
          child: DropDownApp()
           
        ),       
      ),
    ); 
  }
}

class DropDownApp extends StatefulWidget {
  @override
  _DropDownAppState createState() => _DropDownAppState();
}

class _DropDownAppState extends State<DropDownApp> {
  String _value = "1";
  DropdownButton _dropDown() => DropdownButton<String>(
    items: [
        DropdownMenuItem<String>(
          value: "1",
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: <Widget>[
              Icon(Icons.add_alarm),
              Text('Flutter 1',style: TextStyle(color: Colors.black),)
            ],
          )
        ),
         DropdownMenuItem<String>(
          value: "2",
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Icon(Icons.add_comment),
              Text('Flutter 2',style: TextStyle(color: Colors.black),)
            ],
          )
        ),
         DropdownMenuItem<String>(
          value: "3",
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Icon(Icons.add_shopping_cart),
              Text('Flutter 3',style: TextStyle(color: Colors.black),)
            ],
          )
        ),
   ],

  onChanged: (value){
    setState(() {
       _value = value;
    });
  },
      //hint: Text('Go for it!'),
      value: _value,
      elevation: 4,
      style: TextStyle(fontSize: 30.0),
      isDense: false, //reduce the height of the button
      iconSize: 40.0, //size of the  triangle-arrow
      disabledHint: Text('Options Disabled'), //When items and onchanged is null
      isExpanded: false,
      );

  static String dropdownValue = 'Tango'; 
  DropdownButton _dropDown2() => DropdownButton<String>(
     value: dropdownValue,
     icon: Icon(Icons.arrow_downward),
     iconSize: 24,
     elevation: 16,
     style: TextStyle(
       color: Colors.deepPurple
     ),
     underline: Container(
       height: 2,
       color: Colors.deepPurpleAccent,
     ),
     onChanged: (String newValue) {
       setState(() {
         dropdownValue = newValue;
       });
        
     },
     items: <String>['Tango', 'Charlie', 'Watson', 'Walter']
       .map<DropdownMenuItem<String>>((String value) {
         return DropdownMenuItem<String>(
           value: value,
           child: Text(value),
         );
       })
       .toList(),
  );

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          Center(child:_dropDown(),),     //without underline
           Center(child:_dropDown2(),),   // with underline
           
        ],
      )
    );
  }
}