As a flutter beginner, adding two numbers program is important to practice multiple text field controls, button and label.
This program code is simple and more beginner friendly.
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
final appTitle = 'Add Two Numbers';
return MaterialApp(
title: appTitle,
home: Scaffold(
appBar: AppBar(
title: Text(appTitle),
),
body: AddTwoNumbers(),
),
);
}
}
class AddTwoNumbers extends StatefulWidget {
@override
_AddTwoNumbersState createState() => _AddTwoNumbersState();
}
class _AddTwoNumbersState extends State<AddTwoNumbers> {
TextEditingController num1controller = new TextEditingController();
TextEditingController num2controller = new TextEditingController();
String result = "0";
@override
Widget build(BuildContext context) {
return Container(
child: Column(
children: <Widget>[
Row(
children: <Widget>[
Text("Number 1:"),
new Flexible(
child: new TextField(
keyboardType: TextInputType.number,
controller: num1controller,
),
),
],
),
Row(
children: <Widget>[
Text("Number 2:"),
new Flexible(
child: new TextField(
keyboardType: TextInputType.number,
controller: num2controller,
),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text("Add"),
onPressed : () {
setState(() {
int sum = int.parse(num1controller.text) + int.parse(num2controller.text);
result = sum.toString();
});
},
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text("Result:",
style: TextStyle(
fontSize: 30,
),),
Text(result,
style: TextStyle(
fontSize: 30,
),),
],
),
],
),
);
}
}
Code Explanation:
Basics for a flutter application is explained here.
In this program, two TextFields, one RaisedButton and a Text control are designed using Rows and Columns.
TextEditingController num1controller = new TextEditingController();
TextEditingController num2controller = new TextEditingController();
Here two TextEditiongController named num1controller and num2controller are used to manage two number text fields’ contents.
keyboardType: TextInputType.number,
controller: num1controller,
keyboardType is selected as number type layout to type numbers on device keyboard.
num1controller is assigned for the first TextField, similarly num2contoller is assigned on second TextField.
RaisedButton(
child: Text("Add"),
onPressed : () {
setState(() {
int sum = int.parse(num1controller.text) + int.parse(num2controller.text);
result = sum.toString();
});
},
)
On RaisedButton Control, onPressed event adds texts on both text fields’ numbers after converting into interger(number) type using int.parse method.
The ‘result‘ is the common variable which is assigned as the text on result Text.
child: new Text(result),
Here text of the ‘Text‘ control is ‘result‘ which is dynamic and gets sum (result) of two numbers made by ‘Add’ button.
Sample Output:
THANK YOU !!! This simple code was very useful for me
You are welcome…
error coming
What error..? Give us the error list..
We have posted whole app code on above.. Try to replace entire app code with above code and run
I replaced the entire code, but these two errors are detected.
1) error: Expected to find ‘]’. (expected_token at [flutteryapp] lib\main.dart:78
2) error: Undefined name ‘child’. (undefined_identifier at [flutteryapp] lib\main.dart:78)
You will not get such an error if you replace entire code.
1. Error means you have missing a ‘]’ symbol
2. you need to declare variable child first.
There should be some missing on your code. Try replace whole code again
yes i replace whole code again, so i declared variable child but missing ‘]’ symbol error still coming?
i can give u any desk code so that you can handle my pc.
Send the screenshots into [email protected]
here at the end;
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(“Result:”,
style: TextStyle(
fontSize: 30,
),),
child: new Text(result,
style: TextStyle(
fontSize: 30,
),),
],
),
Just remove child: new
and let Text be a Widget…
And here you go
folks that has been posted Im anxious . really did it for me is all the interaction among posters at such good info you have.
I saw this blog through Facebook (one of my friends posted it). After reading, I clicked “Like” and also reshared it myseld. Anunturi Romania