2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

iOS アプリ開発用メモ: Mac上で中途半端になっていた Flutter の開発環境の構築の続き

Posted at

はじめに

自分が持っている Mac・Windows で、以下の記事にも書いている Flutterアプリの開発環境を作っていました。

それについて、以下の記事で扱っていたものは Androidアプリを Android Studio で開発するという内容で、iOSアプリを扱う準備は行っていませんでした。

それで今回、上記の準備(+過去の別件の開発)で途中までは(意図せず)できあがっていた「iOS アプリ開発のための Flutter の開発環境の構築」が完了するまで進めてみました。

今回のゴール

今回のゴールは、Flutter プロジェクトを Xcode を使って実機ビルドすることです。

先に結果を掲載すると、最終的には以下のように iPhone で Flutterアプリを動作させることができました。

スタート時点の確認

まずはスタート時点の確認です。

Flutter用の環境は fvm を使って作っていため、以下のコマンドで現状を確認しました(※ エイリアスなど作ってないので、fvm をつけて flutterコマンドを実行する形です)。

fvm flutter doctor

Flutter2025-02-17_18-02-39.jpg

準備関連では、古いバージョンが入っている CocoaPods を新しくすれば良さそうな状況でした。
(セットアップを全く行ってない状態だと、公式のドキュメントにあるような手順をあれこれ進める必要があるところでしたが)

スタート時点までで行っていたこと

上記で fvm flutter doctor を実行した結果、 CocoaPods を新しくするだけとなっていた背景を軽く補足します。

Flutter関連のセットアップ

まず Flutterまわりは、上記の Android Studio での開発が行える状態になっていたので、SDK は導入済みとなっていました。

Xcode関連のセットアップ

また Xcode関連は、自分が持っている iPhone で実機ビルドをしてアプリを動かしていた状況だったため、セットアップ済みとなっています(※ その関連で iPhone側の開発者モード設定なども対応済みになっています)。

CocoaPods のインストール

CocoaPods の古いバージョンが入っていたのは、確かかなり前に以下のお試しをした際に利用したものだと思われます(← 当時の TensorFlow Lite、現LiteRT を使うために使った覚えが)。

上記の状態でのスタートになるため、クリーンな環境でのセットアップ手順と比較すると、以下の手順は本来のものより実施すべき内容がかなり少ないものとなります

環境を作っていく

それでは環境構築を進めていきます。

CocoaPods を新しくする

まずは CocoaPods を新しくします。

当時は gem を使って導入した覚えがあるのですが、Homebrew で導入すると個人的には管理しやすい状況です。

●cocoapods — Homebrew Formulae
 https://formulae.brew.sh/formula/cocoapods

そのため、古いバージョンを消して上記での再導入をします。

古いバージョンの削除と新しいバージョンのインストール

まずは、以下のコマンドで古い CocoaPods を削除しました。

sudo gem uninstall cocoapods

2025-02-17_18-07-04.jpg

そして、Homebrew で CocoaPods をインストールします。

brew install cocoapods

少しエラーがでたりしましたが、エラーとともに提示された解決方法(具体的なコマンド)を実行して、事なきを得ました。

状況の再確認

fvm flutter doctor で、再度状況を確認してみたところ、以下のように下準備が整った状態になりました。

プロジェクトの作成やアプリのビルドなど

それでは、プロジェクトの作成やアプリのビルドなどを行っていきます。

公式の情報で手順を確認

公式ドキュメントの以下などを見て、プロジェクトの作成方法などを確認します。

●iOS | Flutter
https://docs.flutter.dev/deployment/ios

実際に進めていく

ここから、プロジェクト作成などを実際に進めていきます。

プロジェクトの作成

自分の試している環境では、 ~/XcodeProjects が Xcode のプロジェクトの保存先になっていました。

その中で以下を実行して、プロジェクトを作成します。

fvm flutter create --platforms=ios 【プロジェクト名】

これで【プロジェクト名】で指定した名称のフォルダができるので、その中へ移動します。

補足:プラットフォームの指定について

上記のコマンドについて、当初は fvm flutter create 【プロジェクト名】 としていたのですが、複数のプラットフォーム用の準備がされたようだったので、iOS用のもののみとなるような指定方法を調べて上記としました。

Xcode でのビルド

その後、以下を実行して Xcode でプロジェクトを開きます。

open ios/Runner.xcworkspace

Xcode を開いてからは、サンプルプロジェクトをそのままビルドしました。
(記事の最初のほうに書いていたとおり、Xcode を使った実機ビルドはできる状態だったので、その設定をそのまま使った形です)

これで無事、冒頭に動画を掲載していたように Xcode でビルドした Flutterアプリを iPhone上で動かすことができました。

この後に試したいこと

どうやら今回のゴールの状態だとホットリロードが適用できない状態っぽいので、次は以下などを見つつそのあたりを試したいです。

●Hot reload | Flutter
 https://docs.flutter.dev/tools/hot-reload
●Set up an editor | Flutter
 https://docs.flutter.dev/get-started/editor

●FlutterのHot reloadで変更が反映されない時に確認すべき2つのこと【VSCode版】
 https://zenn.dev/masarufuruya/articles/flutter-hot-reload-act

2
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?