Looping statements are used to execute a particular task for number of times according to given condition. Loop are a type of controlled statement execution system where developer can define a condition and the given statements will only executes according to condition. There are basically 3 types of looping methods available in dart. For Loop, While Loop and Do-While Loop. We’ll learn all 3 of them in current tutorial with live example. So in this tutorial we would For Loop While Loop Do-While Looping Statement in Dart Flutter Android iOS Example Tutorial. Looping statements are controlled flow statements for number of iterations of code.
Looping Methods:
1. For Loop :- For loop is one of the famous looping methods used by million of developer. In for loop we would repeat a particular statement for fixed number of times. In for loop we we would first initialize the int variable value. Then we would put the condition(For how much times the statement executes) and finally we would put the increment and decrement of integer variable. See the below example for more understanding.
Example:
|
1 2 3 4 5 6 7 |
for (initialization ; condition ; increment / decrement) { // This is the Body of the For loop. // put your Code here. } |
2. While Loop :- While loop is a little bit different from For Loop. In While the initialization of integer variable is declared before while loop. Now we would use the While syntax and put the condition first. In body part we would write our statements and then use the increment and decrement operator with variable.
Example:
|
1 2 3 4 5 6 7 8 9 |
initialization ; while (condition) { // Statements ; Increment / Decrement Operator. } |
3. Do-While Loop :- In Do-While loop it executes single time always even if the given condition is false. After executing first time it will check the condition and executes the statement.
Example:
|
1 2 3 4 5 6 7 |
initialization ; do { // Statements; Increment / Decrement Operator; } while (condition); |
Contents in this project For Loop While Loop Do-While Looping Statement in Dart Flutter Android iOS Example Tutorial:
1. Import material.dart package in your app’s main.dart file.
|
1 |
import 'package:flutter/material.dart'; |
2. Create void main runApp() method and here we would call our main MyApp class.
|
1 |
void main() => runApp(MyApp()); |
3. Create our main MyApp class extends with State less widget. This is our main Root widget.
|
1 2 3 4 5 |
class MyApp extends StatelessWidget { } |
4. Creating a function named as callForLoop(). In this function we would call the For Loop and and print a message on terminal screen for 11 number of times. We would call this function on Button click event.
|
1 2 3 4 5 6 7 8 |
void callForLoop(){ for(int i = 0; i <= 10; i++){ print('For Loop Called $i Times'); } } |
5. Creating another function named as callWhileLoop(). In this function we would call the While loop and print the message in terminal screen for 6 times.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
void callWhileLoop(){ int i = 0 ; while( i <= 5 ){ print('While Loop Called $i Times'); i++ ; } } |
6. Creating another function named as callDoWhileLoop(). In this function we would call the Do-While loop and print the message on screen for 5 times.
|
1 2 3 4 5 6 7 8 9 10 11 |
void callDoWhileLoop(){ int i = 0 ; do{ print('Do While Loop Called $i Times'); i++; }while ( i < 5 ); } |
7. Now we would create Widget Build area and make 3 Raised Button widgets. We would call all above 3 functions on button click event.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 |
Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Container( margin: const EdgeInsets.fromLTRB(20, 0, 20, 0), child: RaisedButton( onPressed: () => callForLoop(), child: Text('Call For Loop'), textColor: Colors.white, color: Colors.lightBlue, padding: EdgeInsets.fromLTRB(12, 12, 12, 12), ) ), Container( margin: const EdgeInsets.fromLTRB(20, 0, 20, 0), child: RaisedButton( onPressed: () => callWhileLoop(), child: Text('Call While Loop'), textColor: Colors.white, color: Colors.lightBlue, padding: EdgeInsets.fromLTRB(12, 12, 12, 12), ) ), Container( margin: const EdgeInsets.fromLTRB(20, 0, 20, 0), child: RaisedButton( onPressed: () => callDoWhileLoop(), child: Text('Call Do-While Loop'), textColor: Colors.white, color: Colors.lightBlue, padding: EdgeInsets.fromLTRB(12, 12, 12, 12), ) ), ]) ) ) ); } |
8. Complete source code for main.dart file:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 |
import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { void callForLoop(){ for(int i = 0; i <= 10; i++){ print('For Loop Called $i Times'); } } void callWhileLoop(){ int i = 0 ; while( i <= 5 ){ print('While Loop Called $i Times'); i++ ; } } void callDoWhileLoop(){ int i = 0 ; do{ print('Do While Loop Called $i Times'); i++; }while ( i < 5 ); } @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Container( margin: const EdgeInsets.fromLTRB(20, 0, 20, 0), child: RaisedButton( onPressed: () => callForLoop(), child: Text('Call For Loop'), textColor: Colors.white, color: Colors.lightBlue, padding: EdgeInsets.fromLTRB(12, 12, 12, 12), ) ), Container( margin: const EdgeInsets.fromLTRB(20, 0, 20, 0), child: RaisedButton( onPressed: () => callWhileLoop(), child: Text('Call While Loop'), textColor: Colors.white, color: Colors.lightBlue, padding: EdgeInsets.fromLTRB(12, 12, 12, 12), ) ), Container( margin: const EdgeInsets.fromLTRB(20, 0, 20, 0), child: RaisedButton( onPressed: () => callDoWhileLoop(), child: Text('Call Do-While Loop'), textColor: Colors.white, color: Colors.lightBlue, padding: EdgeInsets.fromLTRB(12, 12, 12, 12), ) ), ]) ) ) ); } } |
Screenshots:
