我正在尝试将数据从包含文本字段的自定义小部件传递到计算器小部件。我面临的问题是我希望利用我的自定义小部件来创建可以进入计算器的多个输入（即身高和体重）。任何人都可以协助使用自定义小部件传递数据吗？
创建了自定义文本字段小部件
import 'package:auto_size_text/auto_size_text.dart';
enum Units { unit1, unit2 }
class InputRow extends StatefulWidget {
InputRow({this.inputParameter, this.unit1, this.unit2});
final String inputParameter;
final String unit1;
final String unit2;
@override
_InputRowState createState() => _InputRowState();
}
class _InputRowState extends State<InputRow> {
String newTaskTitle;
Units selectedUnit;
String unit;
@override
void initState() {
super.initState();
setState(() {
unit = widget.unit1;
});
}
@override
Widget build(BuildContext context) {
return Container(
constraints: BoxConstraints(maxWidth: 375, maxHeight: 50),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
child: AutoSizeText(
widget.inputParameter,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 20.0,
),
),
),
Expanded(
child: Container(
decoration: BoxDecoration(
border: Border.all(
color: Colors.red,
width: 3,
),
borderRadius: BorderRadius.only(
topLeft: Radius.circular(10),
bottomLeft: Radius.circular(10),
),
),
child: TextField(
autofocus: true,
textAlign: TextAlign.center,
onChanged: (newText) {
newTaskTitle = newText;
},
),
),
),
Container(
decoration: BoxDecoration(
color: Colors.red,
border: Border.all(
color: Colors.red,
width: 3,
),
borderRadius: BorderRadius.only(
topRight: Radius.circular(10),
bottomRight: Radius.circular(10),
),
),
child: Row(
children: <Widget>[
Container(
padding: EdgeInsets.all(5),
child: Center(
child: AutoSizeText(
unit,
style: TextStyle(fontSize: 20, fontWeight: FontWeight.w500),
)),
),
Container(
constraints: BoxConstraints(maxHeight: 50, maxWidth: 60),
child: FlatButton(
highlightColor: Colors.transparent,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(
Icons.loop,
size: 25,
),
],
),
onPressed: () {
setState(() {
selectedUnit = selectedUnit == Units.unit2
? Units.unit1
: Units.unit2;
if (selectedUnit == Units.unit1) {
unit = widget.unit1;
} else {
unit = widget.unit2;
}
});
},
)),
],
),
),
],
),
);
}
}
屏幕调用小部件，并希望将在文本字段中输入的身高和体重传递给计算器
class InputScreen extends StatefulWidget {
static const String id = 'adjustments';
@override
_InputScreenState createState() =>
_AdjustmentInputScreenState();
}
class AdjustmentInputScreenState
extends State<AdjustmentInputScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: kActiveButtonColor,
body: Column(
children: <Widget>[
AppBar(
leading: null,
actions: <Widget>[
IconButton(
icon: Icon(Icons.close),
onPressed: () {
Navigator.pop(context);
}),
],
title: Text('Dose Adjustment'),
backgroundColor: Colors.transparent,
elevation: 0.0,
),
InputRow(
unit1: 'cm',
unit2: 'inches',
inputParameter: 'height',
),
InputRow(unit1: 'lbs', unit2: 'kg', inputParameter: 'weight',),
RoundedButton(
title: 'Calculate',
onPressed: () {
//- code needed to pass the custom textfield widget data
},
),
],
),
);
}
}
计算器大脑
import 'dart:math';
class CalculatorTest {
CalculatorTest({this.height, this.weight, this.heightUnit, this.weightUnit});
double height;
double weight;
final String heightUnit;
final String weightUnit;
double _bmi;
String calculateBMI() {
if (weightUnit == 'lbs') {
weight = weight / 2.2;
} else {
weight = weight;
}
if (heightUnit == 'inches') {
height = height / 2.53;
} else {
height = height;
}
_bmi = weight / pow(height / 100, 2);
return _bmi.toStringAsFixed(1);
}
}
第三轮
目标：要能够选择三个按钮之一，选择的按钮将是不同的颜色（如下Button2），然后我可以在单击计算按钮时打印按钮的标题（即Button2）。
目前，除了打印的内容外，一切正常。我只能获取有关 Button1 的信息（如果使用 selected.option，我会得到“Option.one”，如果使用 selected.title，我会得到“Button1”），尽管实际选择了哪个按钮
我的按钮代码
class MyButton extends ValueNotifier<Option> {
final String _title1;
final String _title2;
final String _title3;
MyButton(
{Option option = Option.one,
String title1 = 'A',
String title2 = 'B',
String title3 = 'C'})
: _title1 = title1,
_title2 = title2,
_title3 = title3,
super(option);
//You can add a get method to retrieve the title based on the option selected with a switch
String get title {
switch (value) {
case Option.one:
return _title1;
case Option.two:
return _title2;
case Option.three:
return _title3;
default:
return _title1; //or a default String, but to be honest this will never be used
}
}
Option get option => value;
set option(Option newOption) => value = newOption;
}
三键码
enum Option {
one,
two,
three,
}
class TriButton extends StatefulWidget {
TriButton(
{this.title1, this.title2, this.title3, this.triWidth, this.myButton});
final String title1;
final String title2;
final String title3;
final Constraints triWidth;
final MyButton myButton;
@override
_TriButtonState createState() => _TriButtonState();
}
class _TriButtonState extends State<TriButton> {
Option selectedOption;
@override
Widget build(BuildContext context) {
return Center(
child: Container(
constraints: widget.triWidth,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: RectButton(
buttonChild: Text(
widget.title1,
style: TextStyle(color: Colors.white),
),
onPress: () {
setState(() {
selectedOption = Option.one;
});
},
bgColor: selectedOption == Option.one
? kActiveButtonColor
: kInactiveButtonColor,
),
),
Expanded(
child: RectButton(
buttonChild: Text(
widget.title2,
style: TextStyle(color: Colors.white),
),
onPress: () {
setState(() {
selectedOption = Option.two;
});
},
bgColor: selectedOption == Option.two
? kActiveButtonColor
: kInactiveButtonColor,
),
),
Expanded(
child: RectButton(
buttonChild: Text(
widget.title3,
style: TextStyle(color: Colors.white),
),
onPress: () {
setState(() {
selectedOption = Option.three;
});
},
bgColor: selectedOption == Option.three
? kActiveButtonColor
: kInactiveButtonColor,
),
),
],
),
),
);
}
}
输入画面
class InputScreen extends StatefulWidget {
static const String id = 'adjustments';
@override
_InputScreenState createState() =>
_InputScreenState();
}
class _InputScreenState
extends State<InputScreen> {
final TextEditingController weightController = TextEditingController();
final TextEditingController heightController = TextEditingController();
final TextEditingController creatController = TextEditingController();
final MyUnit heightUnit = MyUnit();
final MyUnit weightUnit = MyUnit(imperial: 'lbs', metric: 'kg');
final MyUnit creatUnit = MyUnit(imperial: 'mg/dL', metric: 'mg/dL');
final MyButton selected = MyButton();
@override
void dispose() {
super.dispose();
weightController.dispose();
heightController.dispose();
creatController.dispose();
heightUnit.dispose();
weightUnit.dispose();
selected.dispose();
}
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color(0xff142651),
body: Column(
children: <Widget>[
AppBar(
leading: null,
actions: <Widget>[
IconButton(
icon: Icon(Icons.close),
onPressed: () {
Navigator.pop(context);
}),
],
title: Text('Dose Adjustment'),
backgroundColor: Colors.transparent,
elevation: 0.0,
),
ValueListenableBuilder<Option>(
valueListenable: selectedAbx,
builder: (context, option, _) => TriButton(
title1: 'Button 1',
title2: 'Button 2',
title3: 'Button 3',
),
),
InputRow(
myUnit: heightUnit,
inputParameter: 'height',
textField: heightController,
colour: kOrangePantone,
),
InputRow(
myUnit: weightUnit,
inputParameter: 'weight',
textField: weightController,
colour: kRoyalPurple,
),
InputRow(
myUnit: creatUnit,
inputParameter: 'SCr',
textField: creatController,
colour: kDogwoodRose,
),
RoundedButton(
title: 'Calculate',
onPressed: () {
print(selected.option);
String inputHeight = heightController.text;
String inputWeight = weightController.text;
String inputCreat = creatController.text;
double imperialHeight = double.parse(inputHeight) * 2.54;
double metricHeight = double.parse(inputHeight);
double imperialWeight = double.parse(inputWeight) / 2.2;
double metricWeight = double.parse(inputWeight);
double creat = double.parse(inputCreat);
CalculatorTest calc;
if (heightUnit.unitType == 'cm' && weightUnit.unitType == 'kg') {
calc = CalculatorTest(
height: metricHeight,
weight: metricWeight,
creatinine: creat);
} else if (heightUnit.unitType == 'inches' &&
weightUnit.unitType == 'lbs') {
calc = CalculatorTest(
height: imperialHeight,
weight: imperialWeight,
creatinine: creat);
} else if (heightUnit.unitType == 'cm' &&
weightUnit.unitType == 'lbs') {
calc = CalculatorTest(
height: metricHeight,
weight: imperialWeight,
creatinine: creat);
} else {
heightUnit.unitType == 'inches' && weightUnit.unitType == 'kg';
calc = CalculatorTest(
height: imperialHeight,
weight: metricWeight,
creatinine: creat);
}
;
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => ResultsScreen(
bmiResult: calc.calculate(),
),
),
);
},
),
],
),
);
}
}
