I’m trying to build an app that is like a calculator but it has some additional buttons that automaticly sets a number to displayedNumber
. I tried the setState()
for setting the number but the Text()
widget is not updating.
This is what I tried:
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
home: Home(),
));
}
class Home extends StatefulWidget {
@override
State<Home> createState() => _HomeState();
}
class _HomeState extends State<Home> {
@override
Widget build(BuildContext context) {
String name = 'Amir Mahdi Abravesh';
String phoneNumber = '+989920250829';
double input = 0.00;
double displayedNumber = 0.0;
String inputST = '$' + '$displayedNumber';
void displayingDigits(){
if(displayedNumber == 0.0){
displayedNumber += input;
} else {
displayedNumber = displayedNumber * 10;
displayedNumber += input;
}
}
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
title: Center(
child: Text(
'Send Money to',
style: TextStyle(
color: Colors.black,
// fontFamily: 'SF Pro',
fontWeight: FontWeight.bold,
),
),
),
centerTitle: true,
backgroundColor: Colors.white,
// shadowColor: Color.fromARGB(197, 192, 192, 192),
elevation: 0,
),
body: Column(
children: <Widget>[
SizedBox(height: 10,),
Expanded(
child: Center(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
CircleAvatar(
backgroundImage: AssetImage('assets/AMA25 trs.png'),
backgroundColor: Colors.black,
radius: 30,
),
SizedBox(height: 5,),
Text(
'$name',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20,
),
),
SizedBox(height: 5,),
Text(
'$phoneNumber',
style: TextStyle(
color: Colors.grey,
),
),
],
),
),
),
Expanded(
child: Container(
padding: EdgeInsets.all(30),
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Text(
'$displayedNumber',
style: TextStyle(
fontSize: 30,
fontWeight: FontWeight.bold,
),
),
Divider(
height: 30,
color: Colors.grey[700],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextButton(
onPressed: () {
setState(() {
displayedNumber = 50.0;
// inputST = '$' + '$displayedNumber';
});
},
child: Container(
padding: EdgeInsets.symmetric(vertical: 10, horizontal: 15),
decoration: BoxDecoration(
border: Border.all(color: Colors.grey),
borderRadius: BorderRadius.circular(15),
),
child: Text(
'$50',
style: TextStyle(
color: Colors.grey,
// fontSize: 18,
),
),
),
),
],
),
),
),
],
),
);
}
}
You can ignore the inputST
that I commented. That’s just for showing a $
before the displayedNumber
.
I want this button to set 50
to the displayedNumber
and update the number on the screen.
2
Answers
Because you have define
double displayedNumber = 0.0;
insidebuild()
.Define
double displayedNumber = 0.0;
outside thebuild()
.Here you go . You just needed to move variables after State