即使在分配了默认值后,凸起的按钮也不会显示答案,直到我 select 一个下拉项
raised button does not shows answer until I select a drop down item even after assigning a default value
我正在制作一个简单的 S.I 计算器,其中有一个用于计算本金金额的字段,以及时间以及 select 货币的下拉菜单。
问题是当我按下 'calculate' RaisedButton(查看图像可能有帮助)时屏幕上没有任何显示(最初我认为按钮有问题但后来)我发现按下 RaisedButton 后如果我 select从下拉列表中输入任何项目然后出现答案为什么会这样,我将初始值设置为_selected = 'Rupee'
我做错了什么吗?
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,
title: 'Simple Intrest Calculator',
home: MyHomePage(),
theme: ThemeData(
brightness: Brightness.dark,
primaryColor: Colors.indigo,
accentColor: Colors.indigoAccent,
),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var _currencies = ['Rupee', 'Dollar', 'Pound'];
final _minPadding = 5.0;
var _selected = 'Rupee';
TextEditingController principalCntr = TextEditingController();
TextEditingController roiCntr = TextEditingController();
TextEditingController termCntr = TextEditingController();
String _amount = '0';
@override
Widget build(BuildContext context) {
TextStyle styles = Theme.of(context).textTheme.headline6;
return Scaffold(
//resizeToAvoidBottomPadding: false,
appBar: AppBar(
title: Text('S.I Calculator'),
centerTitle: true,
),
body: Container(
margin: EdgeInsets.symmetric(vertical: 0, horizontal: _minPadding * 2),
child: ListView(
children: [
getImg(),
Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: TextField(
controller: principalCntr,
keyboardType: TextInputType.number,
style: styles,
decoration: InputDecoration(
labelText: 'Principal',
hintText: 'Enter principal amount',
labelStyle: styles,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
),
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: TextField(
controller: roiCntr,
keyboardType: TextInputType.number,
style: styles,
decoration: InputDecoration(
labelText: 'Intrest',
hintText: 'Enter intrest rate',
labelStyle: styles,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
Expanded(
child: TextField(
controller: termCntr,
keyboardType: TextInputType.number,
style: styles,
decoration: InputDecoration(
labelText: 'Time',
hintText: 'Time in years',
labelStyle: styles,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
),
),
SizedBox(width: 50,),
Expanded(
child: DropdownButton(
value: _selected,
onChanged: (newVal) {
setState(() {
_selected = newVal;
});
},
items: _currencies.map((selectedVal) {
return DropdownMenuItem(
value: selectedVal,
child: Text(selectedVal),
);
}).toList(),
),
),
],
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
Expanded(
child: RaisedButton(
color: Theme.of(context).accentColor,
textColor: Theme.of(context).primaryColor,
child: Text('Calculate'),
onPressed: (){
_amount = _calculateReturns();
},
),
),
SizedBox(width: 20),
Expanded(
child: RaisedButton(
color: Theme.of(context).primaryColorDark,
textColor: Theme.of(context).primaryColorLight,
child: Text('Clear', style: TextStyle(fontSize: 20,),),
onPressed: (){
debugPrint('pressed');
},
),
),
],
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(_amount, style: styles,),
),
],
),
),
);
}
String _calculateReturns(){
double principal = double.parse(principalCntr.text);
double roi = double.parse(roiCntr.text);
double year = double.parse(termCntr.text);
double sI = principal + (principal*roi*year)/100;
String res = 'After $year years, you get $sI';
return res;
}
Widget getImg() {
AssetImage img = AssetImage('images/money.jpg');
Image image = Image(image: img, width: 125, height: 125);
return Container(
child: image,
margin: EdgeInsets.all(_minPadding * 10),
);
}
}
这是在我点击 Raised Button 之后
这是在我 select 下拉列表中的一个项目之后,但不要再次单击该按钮:
代码演练:
- 列出了 _currencies。
- 添加了文本输入字段下拉按钮和两个凸起按钮。
- 按下计算按钮时
_calculateReturns()
被调用,其中 returns 一个值并将其存储在 _amount
中
- 输出只是一个文本小部件。
您在按下按钮时忘记更新屏幕,请记住每次您需要更改页面内容或更新它时都必须调用该方法:
setState(() {
// code here for values to be updated
});
所以在你的 Raised 按钮的 onPressed 函数中你必须这样添加它:
onPressed: (){
_amount = _calculateReturns();
setState(() { });
}
我正在制作一个简单的 S.I 计算器,其中有一个用于计算本金金额的字段,以及时间以及 select 货币的下拉菜单。
问题是当我按下 'calculate' RaisedButton(查看图像可能有帮助)时屏幕上没有任何显示(最初我认为按钮有问题但后来)我发现按下 RaisedButton 后如果我 select从下拉列表中输入任何项目然后出现答案为什么会这样,我将初始值设置为_selected = 'Rupee'
我做错了什么吗?
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,
title: 'Simple Intrest Calculator',
home: MyHomePage(),
theme: ThemeData(
brightness: Brightness.dark,
primaryColor: Colors.indigo,
accentColor: Colors.indigoAccent,
),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var _currencies = ['Rupee', 'Dollar', 'Pound'];
final _minPadding = 5.0;
var _selected = 'Rupee';
TextEditingController principalCntr = TextEditingController();
TextEditingController roiCntr = TextEditingController();
TextEditingController termCntr = TextEditingController();
String _amount = '0';
@override
Widget build(BuildContext context) {
TextStyle styles = Theme.of(context).textTheme.headline6;
return Scaffold(
//resizeToAvoidBottomPadding: false,
appBar: AppBar(
title: Text('S.I Calculator'),
centerTitle: true,
),
body: Container(
margin: EdgeInsets.symmetric(vertical: 0, horizontal: _minPadding * 2),
child: ListView(
children: [
getImg(),
Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: TextField(
controller: principalCntr,
keyboardType: TextInputType.number,
style: styles,
decoration: InputDecoration(
labelText: 'Principal',
hintText: 'Enter principal amount',
labelStyle: styles,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
),
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: TextField(
controller: roiCntr,
keyboardType: TextInputType.number,
style: styles,
decoration: InputDecoration(
labelText: 'Intrest',
hintText: 'Enter intrest rate',
labelStyle: styles,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
Expanded(
child: TextField(
controller: termCntr,
keyboardType: TextInputType.number,
style: styles,
decoration: InputDecoration(
labelText: 'Time',
hintText: 'Time in years',
labelStyle: styles,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
),
),
SizedBox(width: 50,),
Expanded(
child: DropdownButton(
value: _selected,
onChanged: (newVal) {
setState(() {
_selected = newVal;
});
},
items: _currencies.map((selectedVal) {
return DropdownMenuItem(
value: selectedVal,
child: Text(selectedVal),
);
}).toList(),
),
),
],
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
Expanded(
child: RaisedButton(
color: Theme.of(context).accentColor,
textColor: Theme.of(context).primaryColor,
child: Text('Calculate'),
onPressed: (){
_amount = _calculateReturns();
},
),
),
SizedBox(width: 20),
Expanded(
child: RaisedButton(
color: Theme.of(context).primaryColorDark,
textColor: Theme.of(context).primaryColorLight,
child: Text('Clear', style: TextStyle(fontSize: 20,),),
onPressed: (){
debugPrint('pressed');
},
),
),
],
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(_amount, style: styles,),
),
],
),
),
);
}
String _calculateReturns(){
double principal = double.parse(principalCntr.text);
double roi = double.parse(roiCntr.text);
double year = double.parse(termCntr.text);
double sI = principal + (principal*roi*year)/100;
String res = 'After $year years, you get $sI';
return res;
}
Widget getImg() {
AssetImage img = AssetImage('images/money.jpg');
Image image = Image(image: img, width: 125, height: 125);
return Container(
child: image,
margin: EdgeInsets.all(_minPadding * 10),
);
}
}
这是在我点击 Raised Button 之后
这是在我 select 下拉列表中的一个项目之后,但不要再次单击该按钮:
代码演练:
- 列出了 _currencies。
- 添加了文本输入字段下拉按钮和两个凸起按钮。
- 按下计算按钮时
_calculateReturns()
被调用,其中 returns 一个值并将其存储在_amount
中
- 输出只是一个文本小部件。
您在按下按钮时忘记更新屏幕,请记住每次您需要更改页面内容或更新它时都必须调用该方法:
setState(() {
// code here for values to be updated
});
所以在你的 Raised 按钮的 onPressed 函数中你必须这样添加它:
onPressed: (){
_amount = _calculateReturns();
setState(() { });
}