Flutter : Divers

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://medium.com/flutter-community/how-to-show-download-progress-in-a-flutter-app-8810e294acbd

Initialisation :

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();
}

références :

https://stackoverflow.com/questions/61966810/flutter-save-file-to-download-folder-downloads-path-provider

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"
.......................

Références : https://fluttercorner.com/how-to-download-file-from-url-and-save-in-local-storage-in-flutter/#How_to_Download_file_From_URL_and_save_to_phone_storage_in_flutter

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:

Articles récents
Commentaires récents
fatima dans Bienvenue !
AdminDroid dans Bienvenue !
fatima dans Bienvenue !
Archives
Catégories
%d blogueurs aiment cette page :