Flutter : how to pass value to Stateful widget?

Question

I am new to flutter, I can easily create a stateless widget and require value to be set when creating an object (@required this.value)

However, I am a bit lost on how to do it with a stateful widget.

When looking at the code below, I want to be able to get "hint" value from the object created, into the stateful widget constructor, and down to the drop-down menu. I hope this makes sense.

class MyDropdownButton extends StatefulWidget {   MyDropdownButton({
    this.hint,   });   String hint;   @override   _MyDropdownButtonState createState() => _MyDropdownButtonState(); }

class _MyDropdownButtonState extends State<MyDropdownButton> {   String dropdownValue;   String hint;

  @override   Widget build(BuildContext context) {
    return Expanded(
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Text(
            'TO',
            style: TextStyle(color: kColourGreyText),
          ),
          DropdownButton<String>(
            value: dropdownValue != null ? dropdownValue : null,
            hint: Text(hint),
            icon: Icon(Icons.arrow_downward),
            iconSize: 24,
            elevation: 16,
            style: TextStyle(color: kColourGreyText),
            underline: Container(
              height: 2,
              color: kColorPrimary,
            ),
            onChanged: (String newValue) {
              setState(() {
                dropdownValue = newValue;
              });
            },
            items:
                accountNameList.map<DropdownMenuItem<String>>((String value) {
              return DropdownMenuItem<String>(
                value: value,
                child: Text(value),
              );
            }).toList(),
          ),
        ],
      ),
    );   } }

Answer 1

Found multiple problems with your code,

class MyDropdownButton extends StatefulWidget {
  MyDropdownButton({@required this.hint}); // use @required for required parameters, like this one here
  final String hint; // use final

  @override
  _MyDropdownButtonState createState() => _MyDropdownButtonState();
}

    // below line you missed `<MyDropdownButton>` after `State`, 
    // I'd suggest using a recommended IDE with a recommended Flutter 
    // Extention to generate code samples
class _MyDropdownButtonState extends State<MyDropdownButton> {
  String dropdownValue;

  // I added below 3 lines to avoid the errors in this sample code
  List<String> accountNameList = [];
  Color kColorPrimary = Colors.blue;
  Color kColourGreyText = Colors.grey;

  @override
  Widget build(BuildContext context) {

    // You don't need `Expanded` here, just wrap it with `Row` only
    return Row(
      mainAxisSize: MainAxisSize.min,
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Text('TO', style: TextStyle(color: kColourGreyText)),
        DropdownButton(
          value: dropdownValue != null ? dropdownValue : null,
          // when accessing parsed values in Statful, 
          // use widget.<variable name>
          hint: Text(widget.hint), 
          icon: Icon(Icons.arrow_downward),
          iconSize: 24,
          elevation: 16,
          style: TextStyle(color: kColourGreyText),
          underline: Container(height: 2, color: kColorPrimary),
          onChanged: (String newValue) {
            setState(() {
              dropdownValue = newValue;
            });
          },
          items: accountNameList.map((String value) {
            return DropdownMenuItem(value: value, child: Text(value));
          }).toList(),
        ),
      ],
    );
  }
}

and again, I'd suggest using a recommended IDE with a recommended Flutter Extention to generate code samples

Answer 2

You can access widget properties from a state directly. Try widget.hint