Stateful constrictor Widget in flutter - flutter

Question

I am trying to do customized class using stateful widget and I have to use stateful because it have setState function however I want to add property for the class so, when ever I invoke the class I pass the colors I want or store the data I want I did the same for Rassed Button using stateless widget and it is works but for the statefulI have an error that the variable is undefined
I tried to invoke it using widget.borderColor but i have an error that the widget is not defined
here is the code :
class DoseDropDown extends StatefulWidget {
Color borderColor;
Color hintColor;
DoseDropDown({
this.hintColor,
this.borderColor,
});
#override
_DoseDropDownState createState() => _DoseDropDownState();
}
String medicationDose;
List<DropdownMenuItem> getDropDownItem() {
List<DropdownMenuItem> dropDownItems = [];
for (String dose in medcationDose) {
var newItem = DropdownMenuItem(
child: Text(
dose,
style: TextStyle(
here I am trying to use it :
color: hintColor,
and I have error that it is not defined
fontSize: 23, fontWeight: FontWeight.bold,
),
),
value: dose,
);
dropDownItems.add(newItem);
}
return dropDownItems;
}
List<String> medcationDose = [
'مرة واحدة في اليوم',
'مرتان في اليوم',
'ثلاث مرات في اليوم',
'اربعة مرات في اليوم',
'وقت الحاجة'
];
class _DoseDropDownState extends State<DoseDropDown> {
#override
Widget build(BuildContext context) {
return SizedBox(
height: 70,
width: 350,
child: DropdownButtonFormField(
dropdownColor: white,
value: medicationDose,
items: getDropDownItem(),
iconSize: 50,
iconEnabledColor: yellow,
onChanged: (value) {
setState(() {
medicationDose = value;
});
},
decoration: InputDecoration(
prefixIcon: Icon(
MyFlutterApp.pills__2_,
color: yellow,
size: 30,
),
hintText: 'الجرعة',
hintStyle: TextStyle(
fontSize: 30, fontWeight: FontWeight.bold, color: white),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: borderColor,
),
borderRadius: BorderRadius.circular(30.0),
),
),
),
);
}
}

Answer 1

You can copy paste run full code below
In this case, function getDropDownItem() is global and not in class _DoseDropDownState
You can pass hintColor as a parameter
You can in DropdownButtonFormField use widget.hintColor and pass to getDropDownItem
code snippet
List<DropdownMenuItem> getDropDownItem(Color hintColor) {
...
child: DropdownButtonFormField(
dropdownColor: Colors.white,
value: medicationDose,
items: getDropDownItem(widget.hintColor),
working demo
full code
import 'package:flutter/material.dart';
String medicationDose;
List<DropdownMenuItem> getDropDownItem(Color hintColor) {
List<DropdownMenuItem> dropDownItems = [];
for (String dose in medcationDose) {
var newItem = DropdownMenuItem(
child: Text(
dose,
style: TextStyle(
color: hintColor,
fontSize: 23,
fontWeight: FontWeight.bold,
),
),
value: dose,
);
dropDownItems.add(newItem);
}
return dropDownItems;
}
List<String> medcationDose = [
'مرة واحدة في اليوم',
'مرتان في اليوم',
'ثلاث مرات في اليوم',
'اربعة مرات في اليوم',
'وقت الحاجة'
];
class DoseDropDown extends StatefulWidget {
Color borderColor;
Color hintColor;
DoseDropDown({
this.hintColor,
this.borderColor,
});
#override
_DoseDropDownState createState() => _DoseDropDownState();
}
class _DoseDropDownState extends State<DoseDropDown> {
#override
Widget build(BuildContext context) {
return SizedBox(
height: 70,
width: 350,
child: DropdownButtonFormField(
dropdownColor: Colors.white,
value: medicationDose,
items: getDropDownItem(widget.hintColor),
iconSize: 50,
iconEnabledColor: Colors.yellow,
onChanged: (value) {
setState(() {
medicationDose = value;
});
},
decoration: InputDecoration(
prefixIcon: Icon(
Icons.home,
color: Colors.yellow,
size: 30,
),
hintText: 'الجرعة',
hintStyle: TextStyle(
fontSize: 30, fontWeight: FontWeight.bold, color: Colors.white),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.green,
),
borderRadius: BorderRadius.circular(30.0),
),
),
),
);
}
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
DoseDropDown(
hintColor: Colors.brown,
)
],
),
),
);
}
}