クロスプラットフォーム開発計画調査

1 ユニアプリの紹介

uni-appこれは、 Vue.jsを使用してすべてのフロントエンド アプリケーションを開発するためのフレームワークです。開発者は、iOS、Android、Web (レスポンシブ)、およびさまざまな小さなプログラム (WeChat/Alipay/Baidu/Toutiao/Feishu) に公開できる一連のコードを記述します。 / QQ/KuiShou/DingTalk/Taobao)、Quick Apps およびその他のプラットフォーム。

  • DCloud同社には、900 万人の開発者、数百万のアプリケーション、12 億人のモバイル月間アクティブ ユーザー、数千のユニアプリ プラグイン、および 70 以上の WeChat/QQ グループがあります。アリ アプレット ツールには公式のuni-appが組み込まれており、Tencent Classroomは uni-app のトレーニング コースを公式に記録しているため、開発者は自信を持って選択できます。
  • uni-app手に、何も心配しないでください。クロスエンドでなくてuni-appも、より優れたアプレット開発フレームワークであり、より優れたアプリ クロスプラットフォーム フレームワークであり、より便利な H5 開発フレームワークです。リーダーがどのようなプロジェクトを手配しても、開発の考え方や開発の習慣を変えることなく、迅速に提供できます。

2 フラッターの紹介

Flutterは、iOS および Android で高品質のネイティブ ユーザー インターフェースを迅速に構築するための Google のモバイル UI フレームワークです。Flutter は既存のコードで動作します。世界中で、Flutter はますます多くの開発者や組織によって使用されており、Flutter は完全に無料でオープン ソースです。

2.1 主な特長

  • 急速な発展

    Flutter のホット リロードを使用すると、テスト、UI の構築、機能の追加、バグの修正を迅速に行うことができます。状態を失うことなく、iOS および Android エミュレーターまたは実際のデバイスで 1 秒未満のリロードが可能です。

  • 表現力豊かで美しいユーザー インターフェイス

    Flutter に組み込まれた美しいマテリアル デザインと Cupertino (iOS スタイル) ウィジェット、豊富なモーション API、スムーズで自然なスライド効果、プラットフォーム認識により、まったく新しいエクスペリエンスをユーザーにもたらします。

  • モダンでレスポンシブなフレームワーク

    Flutter の最新のレスポンシブ フレームワークとさまざまな基本的なウィジェットを使用して、ユーザー インターフェースを簡単に構築できます。2D、アニメーション、ジェスチャ、エフェクトなどの強力で柔軟な API を使用して、UI の難しい課題を解決します。

2.2 インストールと構成

2.2.1 ウィンドウ

(1) システム構成要件

  • OS: Windows 10 以降 (x86-64 ベースの 64 ビット OS)。
  • システム設定: 開発者モードを有効にします。
  • 依存関係ツール:

(2) Flutter SDK を入手する

  • flutter_windows_3.0.5-stable.zipをダウンロードします
  • 解凍後、flutter ディレクトリを D ドライブにコピーします (パスに特殊文字を含めないでください)。

(3) パス環境変数を更新する

  • コントロール パネル -> システムとセキュリティ -> システム -> システムの詳細設定 -> 環境変数 -> ユーザー変数。
  • パス エントリを検索し (そうでない場合は、新しいパス エントリを作成します)、flutter/binフル パスを追加します。

(4) フラッタードクターチェックを実行します(チェック結果に従って、依存関係の設定を完了します)。

2.2.2 Linux

(1) システム構成要件

  • オペレーティング システム: Linux 64 ビット。
  • コマンド ツール: bash、curl、file、git 2.x、mkdir、rm、unzip、which、xz-utils、zip。
  • 共通ライブラリ: libGLU.so.1。

(2) Flutter SDK を入手する

# 更新软件源
sudo apt-get update
# 安装snap工具
sudo apt-get install snap
# 安装flutter
sudo snap install flutter --classic

(3) フラッタードクターチェックを実行します(チェック結果に従って、依存関係の設定を完了します)。

2.3 実行と公開

フラッターの一般的なコマンド:

# 查看帮助
flutter -h
# 创建项目
flutter create Project_Name
# 运行项目
flutter run
	--v				# 查看日志输出
	--release		# 发布模式
	--debug			# 调试模式
	--hot			# 热重载启动
# 查看设备列表
# 设备名称	·	设备ID	·	系统架构	·	系统版本(API版本)
flutter devices
# 切换设备
flutter run -d 设备名称/设备ID
# 安装程序
flutter install
# 查看配置情况	加-v可查看详细情况
flutter doctor
# 升级flutter
flutter upgrade
# 打包apk
flutter build apk
# 添加平台支持
flutter create --platforms=windosw,macos,linux .

2.3.1 Windows プラットフォームへの実行

# 1.为已有的 Flutter 项目添加桌面支持
flutter create --platforms=windows .
# 2.确保开启开发者模式
start ms-settings:developers
# 3.基于Android Studio IDE开发的移动应用运行到Windows
flutter run -d windows

画像-20220903120557203

2.3.2 Windows プラットフォームへの公開

# 构建发布版本
flutter build windows --release
# 生成的发布版路径为 <Project_Dir>/build/windows/runner/release
# release目录结构如下
.
├── amc1600e.exe		// 可执行程序
├── data				// 包含应用资源文件,如字体和图片
└── flutter_windows.dll	// 必需的动态库文件

2.3.3 Linux プラットフォームでの実行

# 1.为已有的 Flutter 项目添加桌面支持
flutter create --platforms=linux .
# 2.基于Android Studio IDE开发的移动应用运行到Ubuntu
flutter run -d linux

画像-20220903141417063

2.3.4 Linux プラットフォームへの公開

# 构建发布版本
flutter build linux --release
# 生成的发布版路径为 <Project_Dir>/build/linux/x64/release/bundle
# bundle目录结构如下
.
├── amc1600e	// 可执行程序
├── data		// 包含应用资源文件,如字体和图片
└── lib			// 包含必需的动态库文件

2.3.5 Android プラットフォームへの実行

プロジェクト パスの下で、 を押しShiftながら右クリックし、[Powershell ウィンドウをここで開く] を選択します。

  • 入力してflutter devices、デバイスのリストを表示します。

  • を入力しflutter run -d emulator-5554ます。

画像-20220903111512498

2.3.6 Android プラットフォームへのリリース

(1) アプリマニフェストの確認

(2) ビルド構成を表示する

(3) 起動アイコンの追加

(4) アプリ署名

(5) 難読化圧縮を有効にする

(6) リリース apk をビルドする

# 构建apk
flutter build apk
# 安装apk
flutter install

3 比較分析

クロスプラットフォーム ソリューション アドバンテージ 欠点
ユニアプリ 1. クロスプラットフォームで使用するための vue の書き込み方法と内部的に互換性があります。
2. 同時に、iOS、Android、Web、多くの主流のアプレット、クイック アプリなどの複数のプラットフォームへの公開をサポートします。
1. 多くの Web ライブラリとサードパーティの Web ライブラリはサポートされていません。
2.機能やUIインターフェースのカスタマイズが難しい場合は、基本的にユニアプリの要件に合わせて行うしかありません。
3.デバッグやモバイルデバイスとの互換性にはあまり適していません。
フラッター 1.迅速な開発、ミリ秒レベルのホットリロードをサポート。
2. 豊富なコンポーネント サポート、表現力豊かで柔軟な UI を提供します。
3. 独自のレンダリング エンジンにより、プラットフォームに依存せず、ネイティブ アプリケーションと同等のパフォーマンスを実現できます。
4. オープン ソースは無料で、コミュニティ サポートを提供します。
5. 1 セットのコードを複数のプラットフォーム (モバイル、Web、デスクトップ、組み込み) 用のアプリケーションにコンパイルできます。
1.ダーツ言語を知っている必要があります。
2.ネイティブ開発を理解する必要があります。

おすすめ

転載: blog.csdn.net/qq_40531408/article/details/126689257