ISTIC Prog Mobile
$
Algo & Programmation
TP N° 5: Packages
Rappel :
La manière dont Dart organise et partage un ensemble de fonctionnalités se fait via
Package. Dart Package est simplement des bibliothèques ou des modules partageables.
En général, le package Dart est le même que celui de l'application Dart, sauf que le
package Dart n'a pas de point d'entrée d'application, principal.
La structure générale de Package (considérez un package de démonstration,
my_demo_package) estla suivante :
lib/src/* : Private Dart code files.
lib/my_demo_package.dart: Main Dart code file. It can be imported into an
application as:
Other private code file may be exported into the main code file
(my_demo_package.dart), if necessary, as shown below:
lib/* : Any number of Dart code files arranged in any custom folder structure. The
code can be accessed as:
[Link]: Project specification, same as that of application.
Tous les fichiers de code Dart dans le package sont simplement des classes Dart et il n'a
pas despécial exigence d'un code Dart pour l'inclure dans un package.
types de Packages:
Étant donné que les packages Dart sont essentiellement une petite collection de
fonctionnalités similaires, ils peuvent être classés en fonction de leurs fonctionnalités.
Dart Package: Code Dart générique, qui peut être utilisé à la fois dans un
environnement Web et mobile. Par exemple, english_words est un tel package qui
contient environ 5000 mots et a une utilitéde base fonctions comme les noms
(énumérer les noms en anglais), les syllabes (préciser le nombrede syllabes dans un
mot.
Flutter Package: Code Dart générique, qui dépend du framework Flutter et ne peut
être utilisé quedans un environnement mobile. Par exemple, fluro est un routeur
personnalisé pour le flutter. Cela dépend du framework Flutter.
Flutter Plugin: Code Dart générique, qui dépend du framework Flutter ainsi que du code de
la plate-forme sous-jacente (Android SDK ou iOS SDK). Par exemple, la caméra est un plugin
pour interagir avec la caméra de l'appareil. Cela dépend du framework Flutter ainsi que du
framework sous-jacent pour accéder à la caméra.
Afef SLIMANI 1
ISTIC Prog Mobile
$
Algo & Programmation
Pratique:
Utiliser le Package Dart: Les packages Dart sont hébergés et publiés sur le serveur en
direct, [Link] De plus, Flutter fournit un outil simple, pub pour gérer les
packages Dart dans l'application. Les étapes nécessaires pour utiliser comme package
sont les suivantes :
Incluez le nom du package et la version nécessaire dans le [Link] comme indiqué
dessous:
Le dernier numéro de version peut être trouvé en vérifiant le serveur en ligne.
Installez le package dans l'application à l'aide de la commande suivante :
Les packages Dart peuvent être installés ou mis à jour dans Android Studio à l'aide des
options de menu.
Importez le fichier nécessaire à l'aide de la commande ci-dessous et commencez à
travailler :
Utilisez n'importe quelle méthode disponible dans le package,
Ici, nous avons utilisé la fonction des noms pour obtenir et imprimer les
50 premiers mots.
Développer un package de plug-in Flutter
Le développement d'un plug-in Flutter est similaire au développement d'une application
Dart ou d'unpackage Dart. La seule exception est que le plug-in va utiliser l'API système
(Android ou iOS) pour obtenir la fonctionnalité spécifique à la plate-forme requise.
la fonctionnalité du plugin my_browser est de permettre à l'application d'ouvrir le
site Web donnédans le navigateur spécifique à la plate-forme.
Start Android Studio.
Click File -> New Flutter Project and select Flutter Plugin option.
You can see a Flutter plugin selection window as shown here:
Afef SLIMANI 2
ISTIC Prog Mobile
$
Algo & Programmation
Enter my_browser as project name and click Next.
Enter the plugin name and other details in the window as shown here:
Open my_browser.dart file and write a method, openBrowser to invoke platform
specific openBrowser method.
Afef SLIMANI 3
ISTIC Prog Mobile
$
Algo & Programmation
Open [Link] file and import the following classes:
Here, we have to import library required for opening a browser from Android.
Add new private variable mRegistrar of type Registrar in MyBrowserPlugin class.
Here, Registrar is used to get context information of the invoking code.
Add a constructor to set Registrar in MyBrowserPlugin class.
Change registerWith to include our new constructor in MyBrowserPlugin class.
Change the onMethodCall to include openBrowser method in MyBrowserPlugin
class.
Afef SLIMANI 4
ISTIC Prog Mobile
$
Algo & Programmation
Write the platform specific openBrowser method to access browser in MyBrowserPlugin
class:
The complete source code of the my_browser plugin is as follows: my_browser.dart
[Link]
Afef SLIMANI 5
ISTIC Prog Mobile
$
Algo & Programmation
Create a new project, my_browser_plugin_test to test our newly created plugin.
Open [Link] and set my_browser as a plugin dependency:
Afef SLIMANI 6
ISTIC Prog Mobile
$
Algo & Programmation
Click Get dependencies option. Android studio will get the package from
Internet and properly configure it for the application.
Open [Link] and include my_browser plugin as below:
Call the openBrowser function from my_browser plugin as shown below:
The complete code of the [Link] is as follows:
import 'package:flutter/[Link]';
import'package:my_browser/my_browser.dart';
void main() => runApp(MyApp());
class MyApp extends
StatelessWidget {@override
Widget build(BuildContext context)
{ return MaterialApp( title: 'Flutter
Demo',
theme: ThemeData( primarySwatch:
[Link], ), home: MyHomePage(title:
'Flutter Demo Home Page'),
);
}}
class MyHomePage extends StatelessWidget {
MyHomePage({Key key, [Link]}) :
super(key: key); final String title;
@override
Widget build(BuildContext context) {
return Scaffold( appBar: AppBar( title:
Text([Link]), ),body: Center(
child: RaisedButton(
child: Text('Open Browser'),
onPressed: () => MyBrowser().openBrowser("[Link] ), ), );
}}
Run the application and click the Open Browser button and see that the browser is
launched. You can
see a Browser app - Home page as shown in the screenshot shown below:
You can see a Browser app – Browser screen as shown in the screenshot shown
below:
Afef SLIMANI 7
ISTIC Prog Mobile
$
Algo & Programmation
Afef SLIMANI 8