フラッタ複数の画面のプレビューを5分


導入


FlutterによるAndroid開発は、ソフトウェア開発の面白い分野です.より多くのユーザーとモビリティとの長年のモバイルデバイスの最近の暴動、フラッタ、2017年にGoogleによって作成されたオープンソースのユーザーインターフェイスソフトウェア開発キット(SDK)は、Android、IOS、Linux、Mac、Windows、Google Fuchsia、およびWebのためのアプリケーションを開発するために使用される単一のコードベースからのWebは、次の理由で簡単に生活をする:
  • あなたがAndroid、IOS、Linux、Mac、Windows、Google Fuchsia、および単一のコードベースからWebアプリケーションを構築するようにフラッターのクロスプラットフォーム機能は興味をそそる.
  • フラッターアプリは予算フレンドリーです
  • パフォーマンス
  • 開発が速くなる
  • ホットリロード機能
  • Read more!
  • フラッタアプリの構築時に発生する問題


    フラッターアプリの開発で遭遇した主な問題は以下の通りです.
  • ライブラリはフラッタに豊富ですが、それは限られているとはるかに多くのニーズにそれを追加する必要があります.
  • ダートの人気
  • フラッタを使用して作成されたアプリは、平均サイズ以上.
  • ほとんどの開発者は、高い処理速度のマシンを必要とし、低処理マシンや初心者のために困難になるAndroid Studioを使用します.
  • Read more!
  • このポストの目的


    このポストは、フラッタコードをテストするための複数のデバイスを持っていない開発者を支援しようとしています.

    要件

  • コンピューター
  • インストールされているvscode

  • 本当のAndroidデバイス:

  • 機能USBケーブル:

  • 手順


    1 .フラッターコードに依存関係をインポートする

  • それに依存します:あなたのパッケージのPubSpecにこれを加えてください.YAMLファイル:
  • dependencies:
      device_preview: ^0.4.8
    
  • インストール
  • flutter pub get
    
  • インポートは、今あなたのDARTコードでは、次のように使用できます
  • import 'package:device_preview/device_preview.dart';
    
    import 'package:flutter/foundation.dart';
    

    お使いのコンピュータにデバイスを接続し、USBのデバッグを有効にする


    次のコードをメインに含めます.アプリを実行する前にダートファイル.
    Future<void> main() async {
      WidgetsFlutterBinding.ensureInitialized();
    
    
      runApp(
        DevicePreview(
          enabled: !kReleaseMode,
          builder: (context) => MyApp(),
        ),
      );
    }
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          locale: DevicePreview.of(context).locale,
          builder: DevicePreview.appBuilder, 
    
          home: HomePage(),
        );
      }
    }
    

    お使いのコンピュータにデバイスを接続し、USBのデバッグを有効にする




    3 .デバイスが接続されていることを確認します。


    お使いのデバイスがvscodeの下のナビゲーションバーに接続されているかどうかを確認します.デバイスが下のバーに表示されない場合は、手動でAVDデバイスを有効にします.Read more

    3 .モバイルデバイスのプレビュー

  • 下のバーでは、いくつかのデバイス上でアプリケーションを表示し、任意のオーバーフローやエラーをデバッグできます.
  • また、オリエンテーションを変更することもできます

  • あなたは、デバイスの範囲を削除することができます小さなAndroid/IOSの携帯電話、ミディアムアンドロイド/IOSの携帯電話、大規模なAndroid/IOSの電話、計算されたとタブレット、SmartWatchesなどのデバイスの範囲でプレビューを選択し、はるかに行う.


  • 最後に、あなたのデバイス上の小さなカメラのアイコンをクリックしてプレビューのスクリーンショットを保存することができます.これはあなたのVSCodeコンソールのスクリーンショットをダウンロードするリンクを提供します.

  • 詳細

  • この動画にはまだ動画レスポンスがありません.
  • 結論


    結論として、Android Studioはフラッターとスムーズに開発経験のための良いプロセッサを必要と考えても、それはまだ開発のための素晴らしいツール(ベストの一つ)残っている.Android Studioとバグの最新機能を使用できないかもしれませんが、Android Studioの以前のバージョンのインストールはスピードアップすることがあります.
    このポストは、大部分の年下の開発者のためのゲームチェンジャーである.そして、発展途上国では、高処理コンピュータにアクセスしないで、フラッタ開発者として彼らの経歴を追求するために落胆させられました.
    どのようにデバイスをカスタマイズするにはClick here! .