Activité 1 : Afficher Bonjour à l’écran

Code dart :

import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Bonjour App',
home:Scaffold(
appBar: AppBar(title: Text('Bonjour'),
),
body : Center(child:
Text(
'Bonjour',
style: TextStyle(fontSize: 12,
fontWeight: FontWeight.bold),
)
)
)
);
}
}
Activité 2 : Afficher un champ de Texte avec un bouton à l’écran.
L’action sur le bouton affiche le texte qui a été saisi dans le champ de texte.

import 'package:flutter/material.dart';

void main() {
runApp(BonjourApp());
}

class BonjourApp extends StatelessWidget {

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Bonjour App',
home: Scaffold(
appBar: AppBar(
title: Text('Bonjour'),
),
body: Center(
child: BonjourWidget(),
),
),
);
}
}

class BonjourWidget extends StatefulWidget {

@override
_BonjourWidgetState createState() => _BonjourWidgetState();
}

class _BonjourWidgetState extends State<BonjourWidget> {

TextEditingController _controller = TextEditingController();
String _message = '';
 @override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
TextField(
controller: _controller,
decoration: InputDecoration(
hintText: 'Entrez votre texte ici',
),
),
SizedBox(height: 20),
ElevatedButton(
onPressed: () {
setState(() {
_message = 'Bonjour ${_controller.text}';
});
},
child: Text('Dire Bonjour'),
),
SizedBox(height: 20),
Text(_message),
],
);
}

@override
void dispose() {
_controller.dispose();
super.dispose();
}
}
Activité 3 : Afficher deux champs de Texte avec un bouton à l’écran.
L’action sur le bouton affiche « Bonjour nom prénom ».

import 'package:flutter/material.dart';

void main() {
runApp(BonjourApp());
}

class BonjourApp extends StatelessWidget {

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Bonjour App',
home: Scaffold(
appBar: AppBar(
title: Text('Bonjour'),
),
body: Center(
child: BonjourWidget(),
),
),
);
}
}

class BonjourWidget extends StatefulWidget {

@override
_BonjourWidgetState createState() => _BonjourWidgetState();
}

class _BonjourWidgetState extends State<BonjourWidget> {

TextEditingController _controllerNom = TextEditingController();
 TextEditingController _controllerPrenom = TextEditingController();
String _message = '';

@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
TextField(
controller: _controllerNom,
decoration: InputDecoration(
hintText: 'Entrez votre nom!',
),
),
SizedBox(height: 20),
TextField(
controller: _controllerPrenom,
decoration: InputDecoration(
hintText: 'Entrez votre prénom!',
),
),
SizedBox(height: 20),
ElevatedButton(
onPressed: () {
setState(() {
_message = 'Bonjour ${_controllerNom.text}
${_controllerPrenom.text} ';
});
},
child: Text('Dire Bonjour'),
),
SizedBox(height: 20),
Text(_message),
],
);
}

@override
void dispose() {
_controllerNom.dispose();
_controllerPrenom.dispose();
super.dispose();
}
}
Activité 4 : Calculer la somme de deux valeurs réelles et afficher le résultat à l’écran.

import 'package:flutter/material.dart';

void main() {
runApp(SommeApp());
}

class SommeApp extends StatelessWidget {

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Somme',
home: Scaffold(
appBar: AppBar(
title: Text('Somme'),
),
body: Center(
child: CalculSomme(),
),
),
);
}
}

class CalculSomme extends StatefulWidget {

@override
_CalculSommeState createState() => _CalculSommeState();
}

class _CalculSommeState extends State<CalculSomme> {

TextEditingController cX = TextEditingController();
TextEditingController cY = TextEditingController();
String _message = '';
 @override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
TextField(
controller: cX,
decoration: InputDecoration(
hintText: 'Entrez X!',
),
),
SizedBox(height: 20),
TextField(
controller: cY,
decoration: InputDecoration(
hintText: 'Entrez Y!',
),
),
SizedBox(height: 20),
ElevatedButton(
onPressed: () {
setState(() {
double s = double.parse(cX.text) +
double.parse(cY.text);
_message = 'La somme de ${cX.text} + ${cY.text}
est $s';
});
},
child: Text('Calculer'),
),
SizedBox(height: 20),
Text(_message),
],
);
}

@override
void dispose() {
cX.dispose();
cY.dispose();
super.dispose();
}
}
Activité 5 : On souhaite créer une calculatrice simple comportant les opérations de base +, -, * et /.

import 'package:flutter/material.dart';
void main() {
runApp(SommeApp());
}

class SommeApp extends StatelessWidget {

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Calculatrice',
home: Scaffold(
appBar: AppBar(
title: Text('Calculatrice'),
),
body: Center(
child: Calculatrice(),
),
),
);
}
}

class Calculatrice extends StatefulWidget {

@override
_CalculatriceState createState() => _CalculatriceState();
}

class _CalculatriceState extends State<Calculatrice> {

TextEditingController cX = TextEditingController();
TextEditingController cY = TextEditingController();
String _message = '';
 @override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
TextField(
controller: cX,
decoration: InputDecoration(
hintText: 'Entrez X!',
),
),
SizedBox(height: 20),
TextField(
controller: cY,
decoration: InputDecoration(
hintText: 'Entrez Y!',
),
),
SizedBox(height: 20),
Row(
children: [
ElevatedButton(
onPressed: () {
setState(() {
double s = double.parse(cX.text) +
double.parse(cY.text);
_message = 'La somme de ${cX.text} +
${cY.text} est $s';
});
},
child: Text('Somme'),
),
SizedBox(width: 10),
ElevatedButton(
onPressed: () {
setState(() {
double s = double.parse(cX.text) -
double.parse(cY.text);
_message = 'La différence de ${cX.text} –
${cY.text} est $s';
});
},
child: Text('Soustraction'),
),
SizedBox(width: 10),
ElevatedButton(
 onPressed: () {
setState(() {
double p = double.parse(cX.text) *
double.parse(cY.text);
_message = 'Le produit de ${cX.text} x ${cY.text}
est $p';
});
},
child: Text('Multiplication'),
),
SizedBox(width: 10),
ElevatedButton(
onPressed: () {
setState(() {
double d = double.parse(cX.text) /
double.parse(cY.text);
_message = 'La division de ${cX.text} / ${cY.text}
est $d';
});
},
child: Text('Division'),
)
]
),
SizedBox(height: 20),
Text(_message),
],
);
}

@override
void dispose() {
cX.dispose();
cY.dispose();
super.dispose();
}
}