Background : Animated Background In Flutter
Variables globales : https://pub.dev/packages/flutter_dotenv
Indicateur jauge :
Sur un bouton login :
isLoading ? new PrimaryButton(
key: new Key('login'),
text: 'Login',
height: 44.0,
onPressed: setState((){isLoading = true;}))
: Center(
child: CircularProgressIndicator(),
),
https://www.javatpoint.com/flutter-progress-bar
Maps : https://developer.here.com/blog/create-a-flutter-map-application-in-under-5-minutes
Gestion des permissions :
///////////////////// // Attention pour autorisation de lire et écrire des fichiers/répertoires : // android/build.gradle : // android { // compileSdkVersion 31 // .... // defaultConfig { // ... // minSdkVersion 19 // // Et android/app/src/AndroidManifest.xml : // <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> // <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> // <application // android:requestLegacyExternalStorage="true" ///////////////////////
Puis Inclure la permission dans le manifest android puis tester dans le code si la permission est « granted
« , « denied
« , « restricted
» ou « permanentlyDenied"
.
var status = await Permission.storage.status;
if (!status.isGranted) {
await Permission.storage.request();
}
Dans le cas où la permission a été refusée il es tpossible d’ouvrir les settings pour la redemander
if (await Permission.speech.isPermanentlyDenied) {
openAppSettings();
}
https://pub.dev/packages/permission_handler
Downloads : Téléchargement d’un fichier sous Android :
import 'package:flutter/material.dart';
import 'dart:io';
import 'package:dio/dio.dart';
import 'package:permission_handler/permission_handler.dart';
void main() {
runApp(DownloadFile());
}
class DownloadFile extends StatefulWidget {
@override
State createState() {
return _DownloadFileState();
}
}
class _DownloadFileState extends State {
var imageUrl =
"https://www.itl.cat/pngfile/big/10-100326_desktop-wallpaper-hd-full-screen-free-download-full.jpg";
bool downloading = true;
String downloadingStr = "No data";
String savePath = "";
@override
void initState() {
super.initState();
downloadFile();
}
Future downloadFile() async {
try {
Dio dio = Dio();
String fileName = imageUrl.substring(imageUrl.lastIndexOf("/") + 1);
savePath = await getFilePath(fileName);
await dio.download(imageUrl, savePath, onReceiveProgress: (rec, total) {
setState(() {
downloading = true;
// download = (rec / total) * 100;
downloadingStr =
"Downloading Image : $rec" ;
});
} );
setState(() {
downloading = false;
downloadingStr = "Completed";
});
} catch (e) {
print(e.toString());
}
}
Future<String> getFilePath(uniqueFileName) async {
String path = '';
String downloadDir='/storage/emulated/0/Download/';
////////////////////////////////////////////////
// storage permission ask
var status = await Permission.storage.status;
if (!status.isGranted) {
await Permission.storage.request();
}
///////////////////////////////////////////////////////////
path = '$downloadDir$uniqueFileName';
return path;
}
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(primaryColor: Colors.pink),
home: Scaffold(
appBar: AppBar(
title: Text("Download File"),
backgroundColor: Colors.pink,
),
body: Center(
child: downloading
? Container(
height: 250,
width: 250,
child: Card(
color: Colors.pink,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
CircularProgressIndicator(
backgroundColor: Colors.white,
),
SizedBox(
height: 20,
),
Text(
downloadingStr,
style: TextStyle(color: Colors.white),
)
],
),
),
)
: Container(
height: 250,
width: 250,
child: Center(
child: Image.file(
File(savePath),
height: 200,
),
),
),
),
),
);
}
}
Avec pubspec.yaml
dependencies:
flutter:
sdk: flutter
dio: ^4.0.0
path_provider: ^2.0.2
permission_handler: ^8.1.6
Et AndroidManifest :
<uses-permission android:name="android.permission.INTERNET"/> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> <application android:requestLegacyExternalStorage="true" .......................
https://rrtutors.com/tutorials/Download-Large-Files-Pdf-Json-Image-With-Progress-In-Flutter
Attention pour Android 10 : https://stackoverflow.com/questions/64221188/write-external-storage-when-targeting-android-10
Flutter Card, menu bouton, et bouton circulaires :
import 'package:flutter/material.dart';
import 'package:circular_menu/circular_menu.dart';
//import 'mainBis.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'InkWell',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
debugShowCheckedModeBanner: false,
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String inkwell = '';
late String _colorName ;
late Color _color ;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('GeeksforGeeks'),
backgroundColor: Colors.green,
),
body: Column(
//All elements are wrapped
children: [
//in this column
SizedBox(
height: 15,
),
SizedBox(
height: 20,
child: Text('Demonstration of Row'),
),
Row(
children: [
Card(
margin: EdgeInsets.all(10),
elevation: 8,
child: Container(
padding: EdgeInsets.all(25),
child: Text(
'Texte haut',
style: TextStyle(color: Colors.green),
),
),
),
SizedBox(
width: 2,
),
Card(
margin: EdgeInsets.all(10),
elevation: 8,
child: Container(
padding: EdgeInsets.all(25),
child: Text(
'GeeksforGeeks',
style: TextStyle(color: Colors.green),
),
),
),
],
),
SizedBox(
height: 30,
),
SizedBox(
height: 20,
child: Text(inkwell, style: TextStyle(
color: Colors.redAccent,
),),
),
/////////////////////////////////////
// MENU
/////////////////////////////////////
Column(
children: [
Card(
//-- Ombre card
margin: EdgeInsets.all(10),
elevation: 8,
//-- Card saisissable
child: new InkWell(
hoverColor: Colors.orange,
splashColor: Colors.red,
focusColor: Colors.yellow,
highlightColor: Colors.purple,
onTap: () {
print("tapped");
setState(() {
inkwell = 'Search and download...';
});
},
onLongPress: () {
setState(() {
inkwell = 'Long Pressed search...';
});
},
child: Container(
//color: Colors.green,
width: 120,
height: 70,
child: Center(
child: Text(
'Music search',
style: TextStyle(color: Colors.blueGrey),
//textScaleFactor: 2,
//style: TextStyle(fontWeight: FontWeight.bold),
))),
),
),
//////////////////////////////
// -- Espace entre les cartes
SizedBox(
width: 4,
),
///////////////////////////////
Card(
//-- Ombre card
margin: EdgeInsets.all(10),
elevation: 8,
//-- Card saisissable
child: new InkWell(
hoverColor: Colors.orange,
splashColor: Colors.red,
focusColor: Colors.yellow,
highlightColor: Colors.purple,
onTap: () {
print("tapped");
setState(() {
inkwell = 'Enter url or id...';
});
},
onLongPress: () {
setState(() {
inkwell = 'Long Pressed enter...';
});
},
child: Container(
//color: Colors.green,
width: 120,
height: 70,
child: Center(
child: Text(
'Music id or URL',
style: TextStyle(color: Colors.blueGrey),
//textScaleFactor: 2,
//style: TextStyle(fontWeight: FontWeight.bold),
))),
),
),
//////////////////////////////
// -- Espace entre les cartes
SizedBox(
width: 4,
),
///////////////////////////////
Card(
//-- Ombre card
margin: EdgeInsets.all(10),
elevation: 8,
//-- Card saisissable
child: new InkWell(
hoverColor: Colors.orange,
splashColor: Colors.red,
focusColor: Colors.yellow,
highlightColor: Colors.purple,
onTap: () {
print("tapped");
setState(() {
inkwell = 'Call Youtube...';
});
},
onLongPress: () {
setState(() {
inkwell = 'Long Pressed Youtube...';
});
},
child: Container(
//color: Colors.green,
width: 120,
height: 70,
child: Center(
child: Text(
'YouTube',
style: TextStyle(color: Colors.blueGrey),
//textScaleFactor: 2,
//style: TextStyle(fontWeight: FontWeight.bold),
))),
),
),
],
),
///////////////////////
//-- Circular MENU
CircularMenu(
alignment: Alignment.center,
backgroundWidget: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Center(
child: Padding(
padding: const EdgeInsets.all(100.0),
/*
child: RichText(
text: TextSpan(
style: TextStyle(color: Colors.black, fontSize: 20,fontWeight: FontWeight.bold),
children: <TextSpan>[
TextSpan(text: 'Press the menu button'),
],
),
),
*/
),
),
],
),
curve: Curves.bounceOut,
reverseCurve: Curves.bounceInOut,
toggleButtonColor: Colors.cyan[400],
items: [
CircularMenuItem(
icon: Icons.home,
color: Colors.brown,
onTap: () {
setState(() {
_color = Colors.brown;
_colorName = 'Brown';
inkwell='HOME';
});
}),
CircularMenuItem(
icon: Icons.search,
color: Colors.green,
onTap: () {
setState(() {
_color = Colors.green;
_colorName = 'Green';
inkwell='SEARCH';
});
}),
CircularMenuItem(
icon: Icons.settings,
color: Colors.red,
onTap: () {
setState(() {
_color = Colors.red;
_colorName = 'red';
inkwell='PARAMS';
});
}),
CircularMenuItem(
icon: Icons.chat,
color: Colors.orange,
onTap: () {
setState(() {
_color = Colors.orange;
_colorName = 'orange';
inkwell='CHAT';
});
}),
CircularMenuItem(
icon: Icons.notifications,
color: Colors.purple,
onTap: () {
setState(() {
_color = Colors.purple;
_colorName = 'purple';
inkwell='ALARM';
});
})
],
),
],
),
);
}
}
Références :
Quizz :
https://pub.dev/packages/quiz_view à exécuter via :
flutter run --no-sound-null-safety
A tester : https://github.com/JohannesMilke/quiz_app_example
Plusieurs widget dans un widget avec appel de fonction :
Container(
child:Column(
children:[
Text("blabla"), // widget text
Text(_storeValue()) // fonction
]
),
)
Et avec la fonction :
String _storeValue() {
String sDir=selectedDirectory!.path.toString();
globals.sPath=sDir;
_storePrefValue(sDir);
return(sDir);
}
_storePrefValue(String sDir) async {
final prefs = await SharedPreferences.getInstance();
prefs.setString('DirPath', sDir);
}
Gestion des préférences :
Sauvegarde des valeurs :
_storePrefValue(String sDir) async {
final prefs = await SharedPreferences.getInstance();
prefs.setString('DirPath', sDir);
}
Lire des valeurs :
_ReadValue() async {
final prefs = await SharedPreferences.getInstance();
String sDir = prefs.getString('DirPath') ?? '';
setState(() {
valeurRep = sDir;
});
}
https://flutter.dev/docs/cookbook/persistence/key-value
Appel d’une page avec rafraîchissement du widget qui a appelé la page après avoir quitté lé page appelée ;
Navigator.push( context, MaterialPageRoute( builder: (context) => SecondPage()), ).then((value) => setState(() {}));
Orientation de l’écran :
void main() async {
WidgetsFlutterBinding.ensureInitialized();
SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]).then((_){
runApp(MainMenu());
});
}
https://mightytechno.com/screen-orientation-in-flutter/
Suppression du clavier : How to Dismiss the Keyboard in Flutter the Right Way
Orientation de l’écran en portrait :
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
return new MaterialApp(...);
}
}
xample: