Flutter - Rédaction de code spécifique à Android

Flutter fournit un cadre général pour accéder aux fonctionnalités spécifiques de la plate-forme. Cela permet au développeur d'étendre les fonctionnalités du framework Flutter à l' aide d'un code spécifique à la plate-forme. Les fonctionnalités spécifiques à la plate-forme telles que la caméra, le niveau de la batterie, le navigateur, etc., sont facilement accessibles via le cadre.

L'idée générale d'accéder au code spécifique à la plate-forme est via un protocole de messagerie simple. Le code Flutter, le client et le code de la plate-forme et l'hôte se lient à un canal de message commun. Le client envoie un message à l'hôte via le canal de messages. L'hôte écoute sur le canal de message, reçoit le message et effectue les fonctionnalités nécessaires et, enfin, renvoie le résultat au client via le canal de message.

L'architecture du code spécifique à la plate-forme est illustrée dans le diagramme ci-dessous -

Le protocole de messagerie utilise un codec de message standard (classe StandardMessageCodec) qui prend en charge la sérialisation binaire de valeurs de type JSON telles que les nombres, les chaînes, les valeurs booléennes, etc., La sérialisation et la désérialisation fonctionnent de manière transparente entre le client et l'hôte.

Écrivons une application simple pour ouvrir un navigateur à l'aide du SDK Android et comprendre comment

Créez une nouvelle application Flutter dans le studio Android, flutter_browser_app
Remplacez le code main.dart par le code ci-dessous -

import 'package:flutter/material.dart'; 
void main() => runApp(MyApp()); 
class MyApp extends StatelessWidget { 
   @override 
   Widget build(BuildContext context) {
      return MaterialApp(
         title: 'Flutter Demo', 
         theme: ThemeData( 
            primarySwatch: Colors.blue, 
         ), 
         home: MyHomePage(title: 'Flutter Demo Home Page'),
      );
   }
}
class MyHomePage extends StatelessWidget { 
   MyHomePage({Key key, this.title}) : super(key: key); 
   final String title; 
   
   @override 
   Widget build(BuildContext context) {
      return Scaffold(
         appBar: AppBar(
            title: Text(this.title), 
         ), 
         body: Center(
            child: RaisedButton( 
               child: Text('Open Browser'), 
               onPressed: null, 
            ), 
         ), 
      ); 
   }
}

Ici, nous avons créé un nouveau bouton pour ouvrir le navigateur et définir sa méthode onPressed sur null.
Maintenant, importez les packages suivants -

import 'dart:async'; 
import 'package:flutter/services.dart';

Ici, services.dart inclut la fonctionnalité pour appeler du code spécifique à la plate-forme.
Créez un nouveau canal de message dans le widget MyHomePage.

static const platform = const 
MethodChannel('flutterapp.tutorialspoint.com/browser');

Ecrivez une méthode, _openBrowser pour appeler la méthode spécifique à la plate-forme, la méthode openBrowser via le canal de message.

Future<void> _openBrowser() async { 
   try {
      final int result = await platform.invokeMethod(
         'openBrowser', <String, String>{ 
            'url': "https://flutter.dev" 
         }
      ); 
   } 
   on PlatformException catch (e) { 
      // Unable to open the browser 
      print(e); 
   }
}

Ici, nous avons utilisé platform.invokeMethod pour appeler openBrowser (expliqué dans les étapes à venir). openBrowser a un argument, url pour ouvrir une URL spécifique.

Modifiez la valeur de la propriété onPressed du RaisedButton de null à _openBrowser.

onPressed: _openBrowser,

Ouvrez MainActivity.java (dans le dossier Android) et importez la bibliothèque requise -

import android.app.Activity; 
import android.content.Intent; 
import android.net.Uri; 
import android.os.Bundle; 

import io.flutter.app.FlutterActivity; 
import io.flutter.plugin.common.MethodCall; 
import io.flutter.plugin.common.MethodChannel; 
import io.flutter.plugin.common.MethodChannel.MethodCallHandler; 
import io.flutter.plugin.common.MethodChannel.Result; 
import io.flutter.plugins.GeneratedPluginRegistrant;

Ecrire une méthode, openBrowser pour ouvrir un navigateur

private void openBrowser(MethodCall call, Result result, String url) { 
   Activity activity = this; 
   if (activity == null) { 
      result.error("ACTIVITY_NOT_AVAILABLE", 
      "Browser cannot be opened without foreground 
      activity", null); 
      return; 
   } 
   Intent intent = new Intent(Intent.ACTION_VIEW); 
   intent.setData(Uri.parse(url)); 
   
   activity.startActivity(intent); 
   result.success((Object) true); 
}

Maintenant, définissez le nom du canal dans la classe MainActivity -

private static final String CHANNEL = "flutterapp.tutorialspoint.com/browser";

Écrivez un code spécifique à Android pour définir la gestion des messages dans la méthode onCreate -

new MethodChannel(getFlutterView(), CHANNEL).setMethodCallHandler( 
   new MethodCallHandler() { 
   @Override 
   public void onMethodCall(MethodCall call, Result result) { 
      String url = call.argument("url"); 
      if (call.method.equals("openBrowser")) {
         openBrowser(call, result, url); 
      } else { 
         result.notImplemented(); 
      } 
   } 
});

Ici, nous avons créé un canal de message à l'aide de la classe MethodChannel et utilisé la classe MethodCallHandler pour gérer le message. onMethodCall est la méthode réelle chargée d'appeler le bon code spécifique à la plate-forme en vérifiant le message. La méthode onMethodCall extrait l'url du message, puis appelle l'openBrowser uniquement lorsque l'appel de méthode est openBrowser. Sinon, il renvoie la méthode notImplemented.

Le code source complet de l'application est le suivant -

main.dart

MainActivity.java

package com.tutorialspoint.flutterapp.flutter_browser_app; 

import android.app.Activity; 
import android.content.Intent; 
import android.net.Uri; 
import android.os.Bundle; 
import io.flutter.app.FlutterActivity; 
import io.flutter.plugin.common.MethodCall; 
import io.flutter.plugin.common.MethodChannel.Result; 
import io.flutter.plugins.GeneratedPluginRegistrant; 

public class MainActivity extends FlutterActivity { 
   private static final String CHANNEL = "flutterapp.tutorialspoint.com/browser"; 
   @Override 
   protected void onCreate(Bundle savedInstanceState) { 
      super.onCreate(savedInstanceState); 
      GeneratedPluginRegistrant.registerWith(this); 
      new MethodChannel(getFlutterView(), CHANNEL).setMethodCallHandler(
         new MethodCallHandler() {
            @Override 
            public void onMethodCall(MethodCall call, Result result) {
               String url = call.argument("url"); 
               if (call.method.equals("openBrowser")) { 
                  openBrowser(call, result, url); 
               } else { 
                  result.notImplemented(); 
               }
            }
         }
      ); 
   }
   private void openBrowser(MethodCall call, Result result, String url) {
      Activity activity = this; if (activity == null) {
         result.error(
            "ACTIVITY_NOT_AVAILABLE", "Browser cannot be opened without foreground activity", null
         ); 
         return; 
      } 
      Intent intent = new Intent(Intent.ACTION_VIEW); 
      intent.setData(Uri.parse(url)); 
      activity.startActivity(intent); 
      result.success((Object) true); 
   }
}

main.dart

import 'package:flutter/material.dart'; 
import 'dart:async'; 
import 'package:flutter/services.dart'; 

void main() => runApp(MyApp()); 
class MyApp extends StatelessWidget {
   @override 
   Widget build(BuildContext context) {
      return MaterialApp(
         title: 'Flutter Demo', 
         theme: ThemeData( 
            primarySwatch: Colors.blue, 
         ), 
         home: MyHomePage(
            title: 'Flutter Demo Home Page'
         ), 
      ); 
   }
}
class MyHomePage extends StatelessWidget {
   MyHomePage({Key key, this.title}) : super(key: key); 
   final String title; 
   static const platform = const MethodChannel('flutterapp.tutorialspoint.com/browser'); 
   Future<void> _openBrowser() async {
      try {
         final int result = await platform.invokeMethod('openBrowser', <String, String>{ 
            'url': "https://flutter.dev" 
         });
      }
      on PlatformException catch (e) { 
         // Unable to open the browser print(e); 
      } 
   }
   @override 
   Widget build(BuildContext context) {
      return Scaffold( 
         appBar: AppBar( 
            title: Text(this.title), 
         ), 
         body: Center(
            child: RaisedButton( 
               child: Text('Open Browser'), 
               onPressed: _openBrowser, 
            ), 
         ),
      );
   }
}

Exécutez l'application et cliquez sur le bouton Ouvrir le navigateur et vous pouvez voir que le navigateur est lancé. L'application Navigateur - La page d'accueil est comme indiqué dans la capture d'écran ici -

↰ Previous page Next page ↱

Flutter - Rédaction de code spécifique à Android

Tutoriel Flutter