Flutter - Pakete Giriş

Dart'ın bir dizi işlevi organize etme ve paylaşma yolu Paket yoluyla yapılır. Dart Paketi, paylaşılabilir kitaplıklar veya modüllerdir. Genel olarak, Dart Paketi, Dart Paketi'nin ana uygulama giriş noktasına sahip olmaması dışında Dart Uygulaması ile aynıdır.

Paketin genel yapısı (bir demo paketi düşünün, my_demo_package) aşağıdaki gibidir -

  • lib/src/* - Özel Dart kodu dosyaları.

  • lib/my_demo_package.dart- Ana Dart kod dosyası. Bir uygulamaya şu şekilde aktarılabilir:

import 'package:my_demo_package/my_demo_package.dart'
  • Diğer özel kod dosyası, gerekirse aşağıda gösterildiği gibi ana kod dosyasına (my_demo_package.dart) aktarılabilir -

export src/my_private_code.dart
  • lib/*- Herhangi bir özel klasör yapısında düzenlenmiş herhangi bir sayıda Dart kodu dosyası. Koda şu şekilde erişilebilir:

import 'package:my_demo_package/custom_folder/custom_file.dart'
  • pubspec.yaml - Uygulama ile aynı proje spesifikasyonu,

Paketteki tüm Dart kodu dosyaları basitçe Dart sınıflarıdır ve bir Dart kodunun onu bir Pakete dahil etmesi için herhangi bir özel gereksinimi yoktur.

Paket Türleri

Dart Paketleri temelde benzer işlevselliklerin küçük bir koleksiyonu olduğundan, işlevselliğine göre kategorize edilebilir.

Dart Paketi

Hem web hem de mobil ortamda kullanılabilen genel Dart kodu. Örneğin, english_words, yaklaşık 5000 kelime içeren ve isimler (İngilizce isimleri listeleme), heceler (bir kelimedeki hece sayısını belirtin) gibi temel yardımcı fonksiyonlara sahip böyle bir pakettir.

Flutter Paketi

Flutter çerçevesine bağlı olan ve yalnızca mobil ortamda kullanılabilen genel Dart kodu. Örneğin fluro, flutter için özel bir yönlendiricidir. Flutter çerçevesine bağlıdır.

Flutter Eklentisi

Flutter çerçevesine ve temel platform koduna (Android SDK veya iOS SDK) bağlı olan genel Dart kodu. Örneğin, kamera, cihaz kamerasıyla etkileşim kurmak için bir eklentidir. Kameraya erişim sağlamak için Flutter çerçevesine ve temel çerçeveye bağlıdır.

Dart Paketi Kullanmak

Dart Paketleri, canlı sunucuda barındırılır ve yayınlanır, https://pub.dartlang.org.Ayrıca Flutter, uygulamadaki Dart Paketlerini yönetmek için basit bir araç, pub sağlar. Paket olarak kullanmak için gereken adımlar aşağıdaki gibidir -

  • Paket adını ve gereken sürümü pubspec.yaml'ye aşağıda gösterildiği gibi ekleyin -

dependencies: english_words: ^3.1.5
  • En son sürüm numarası çevrimiçi sunucuyu kontrol ederek bulunabilir.

  • Aşağıdaki komutu kullanarak paketi uygulamaya yükleyin -

flutter packages get
  • Android Studio, Android stüdyosunda geliştirme yaparken, pubspec.yaml'deki herhangi bir değişikliği tespit eder ve aşağıda gösterildiği gibi geliştiriciye bir Android stüdyo paketi uyarısı görüntüler -

  • Dart Paketleri, menü seçenekleri kullanılarak Android Studio'da yüklenebilir veya güncellenebilir.

  • Aşağıda gösterilen komutu kullanarak gerekli dosyayı içe aktarın ve çalışmaya başlayın -

import 'package:english_words/english_words.dart';
  • Pakette bulunan herhangi bir yöntemi kullanın,

nouns.take(50).forEach(print);
  • Burada, ilk 50 kelimeyi almak ve yazdırmak için isimler işlevini kullandık.

Flutter Eklenti Paketi Geliştirin

Flutter Eklentisi geliştirmek, bir Dart uygulaması veya Dart Paketi geliştirmeye benzer. Bunun tek istisnası, eklentinin platforma özel işlevselliği elde etmek için Sistem API'sini (Android veya iOS) kullanmasıdır.

Önceki bölümlerde platform koduna nasıl erişeceğimizi zaten öğrendiğimiz gibi, eklenti geliştirme sürecini anlamak için my_browser adlı basit bir eklenti geliştirelim. My_browser eklentisinin işlevselliği, uygulamanın belirli web sitesini platforma özel tarayıcıda açmasına izin vermektir.

  • Android Studio'yu başlatın.

  • Tıklayın File → New Flutter Project ve Flutter Plugin seçeneğini seçin.

  • Burada gösterildiği gibi bir Flutter eklenti seçim penceresi görebilirsiniz -

  • My_browser proje adı olarak girin ve İleri'ye tıklayın.

  • Eklenti adını ve diğer ayrıntıları burada gösterildiği gibi pencereye girin -

  • Aşağıda gösterilen pencerede şirket etki alanını, flutterplugins.tutorialspoint.com adresini girin ve ardından Finish. Yeni eklentimizi geliştirmek için bir başlangıç ​​kodu oluşturacaktır.

  • My_browser.dart dosyasını açın ve platforma özel openBrowser yöntemini çağırmak için bir yöntem olan openBrowser yazın.

Future<void> openBrowser(String urlString) async { 
   try {
      final int result = await _channel.invokeMethod(
         'openBrowser', <String, String>{ 'url': urlString }
      );
   }
   on PlatformException catch (e) { 
      // Unable to open the browser print(e); 
   } 
}
  • MyBrowserPlugin.java dosyasını açın ve aşağıdaki sınıfları içe aktarın -

import android.app.Activity; 
import android.content.Intent; 
import android.net.Uri; 
import android.os.Bundle;
  • Burada, Android'den bir tarayıcı açmak için gerekli kitaplığı içe aktarmamız gerekiyor.

  • MyBrowserPlugin sınıfına Registrar türünde yeni özel değişken mRegistrar ekleyin.

private final Registrar mRegistrar;
  • Burada Registrar, çağıran kodun bağlam bilgisini almak için kullanılır.

  • MyBrowserPlugin sınıfında Registrar'ı ayarlamak için bir yapıcı ekleyin.

private MyBrowserPlugin(Registrar registrar) { 
   this.mRegistrar = registrar; 
}
  • Yeni yapıcımızı MyBrowserPlugin sınıfına dahil etmek için registerWith öğesini değiştirin.

public static void registerWith(Registrar registrar) { 
   final MethodChannel channel = new MethodChannel(registrar.messenger(), "my_browser"); 
   MyBrowserPlugin instance = new MyBrowserPlugin(registrar); 
   channel.setMethodCallHandler(instance); 
}
  • MyBrowserPlugin sınıfına openBrowser yöntemini dahil etmek için onMethodCall öğesini değiştirin.

@Override 
public void onMethodCall(MethodCall call, Result result) { 
   String url = call.argument("url");
   if (call.method.equals("getPlatformVersion")) { 
      result.success("Android " + android.os.Build.VERSION.RELEASE); 
   } 
   else if (call.method.equals("openBrowser")) { 
      openBrowser(call, result, url); 
   } else { 
      result.notImplemented(); 
   } 
}
  • MyBrowserPlugin sınıfında tarayıcıya erişmek için platforma özel openBrowser yöntemini yazın.

private void openBrowser(MethodCall call, Result result, String url) { 
   Activity activity = mRegistrar.activity(); 
   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); 
}
  • My_browser eklentisinin tam kaynak kodu aşağıdaki gibidir -

my_browser.dart

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

class MyBrowser {
   static const MethodChannel _channel = const MethodChannel('my_browser'); 
   static Future<String> get platformVersion async { 
      final String version = await _channel.invokeMethod('getPlatformVersion'); return version; 
   } 
   Future<void> openBrowser(String urlString) async { 
      try {
         final int result = await _channel.invokeMethod(
            'openBrowser', <String, String>{'url': urlString}); 
      } 
      on PlatformException catch (e) { 
         // Unable to open the browser print(e); 
      }
   }
}

MyBrowserPlugin.java

package com.tutorialspoint.flutterplugins.my_browser; 

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.plugin.common.PluginRegistry.Registrar; 
import android.app.Activity; 
import android.content.Intent; 
import android.net.Uri; 
import android.os.Bundle; 

/** MyBrowserPlugin */ 
public class MyBrowserPlugin implements MethodCallHandler {
   private final Registrar mRegistrar; 
   private MyBrowserPlugin(Registrar registrar) { 
      this.mRegistrar = registrar; 
   } 
   /** Plugin registration. */
   public static void registerWith(Registrar registrar) {
      final MethodChannel channel = new MethodChannel(
         registrar.messenger(), "my_browser"); 
      MyBrowserPlugin instance = new MyBrowserPlugin(registrar); 
      channel.setMethodCallHandler(instance); 
   } 
   @Override 
   public void onMethodCall(MethodCall call, Result result) { 
      String url = call.argument("url"); 
      if (call.method.equals("getPlatformVersion")) { 
         result.success("Android " + android.os.Build.VERSION.RELEASE); 
      } 
      else if (call.method.equals("openBrowser")) { 
         openBrowser(call, result, url); 
      } else { 
         result.notImplemented(); 
      } 
   } 
   private void openBrowser(MethodCall call, Result result, String url) { 
      Activity activity = mRegistrar.activity(); 
      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); 
   } 
}
  • Yeni oluşturulan eklentimizi test etmek için yeni bir proje, my_browser_plugin_test oluşturun.

  • Pubspec.yaml dosyasını açın ve my_browser'ı eklenti bağımlılığı olarak ayarlayın.

dependencies: 
   flutter: 
      sdk: flutter 
   my_browser: 
      path: ../my_browser
  • Android studio, pubspec.yaml dosyasının aşağıda verilen Android stüdyo paketi uyarısında gösterildiği gibi güncellendiğini bildirir -

  • Bağımlılıkları al seçeneğini tıklayın. Android stüdyosu paketi İnternet'ten alacak ve uygulama için uygun şekilde yapılandıracaktır.

  • Main.dart'ı açın ve my_browser eklentisini aşağıdaki gibi ekleyin -

import 'package:my_browser/my_browser.dart';
  • My_browser eklentisinden aşağıda gösterildiği gibi openBrowser işlevini çağırın -

onPressed: () => MyBrowser().openBrowser("https://flutter.dev"),
  • Main.dart'ın tam kodu aşağıdaki gibidir -

import 'package:flutter/material.dart'; 
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: 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: () => MyBrowser().openBrowser("https://flutter.dev"), 
            ),
         ), 
      ); 
   }
}
  • Uygulamayı çalıştırın ve Tarayıcıyı Aç düğmesine tıklayın ve tarayıcının başlatıldığını görün. Aşağıda gösterilen ekran görüntüsünde gösterildiği gibi bir Tarayıcı uygulaması - Ana sayfa görebilirsiniz -

Aşağıda gösterilen ekran görüntüsünde gösterildiği gibi bir Tarayıcı uygulaması - Tarayıcı ekranı görebilirsiniz -