アプリケーション開発ポータルサイト
ServerNote.NET
カテゴリー【FlutterMacOSiPhone/iPad
【Mac OS版】Flutterインストールメモ
POSTED BY
2023-10-19

【Windows版】Flutterインストールメモ

前回、まずAndroidアプリ開発を目的にWindows版を入れましたが、iOS/iPhoneアプリ開発を行うには、MacOSを用意してそこに入れなくてはいけないです。FlutterはGoogle社のものなのでAndroid Studio + Android実機ならすぐできますが、iOS版はトラップが多く割とハードルが高いです。

Android Studioのインストール

https://developer.android.com/studio?hl=ja

からインストーラdmgをダウンロードして、実行。他のmacソフトと同様、Android StudioをドラッグしてApplicationsに入れて完了。完了したらアプリケーションから起動して、Welcome→Next→Standardを選択→Next→テーマ選択→Finish。
初期セットアップ(Download Compornents)が始まるので、終わったらFinish→Welcome→More Actions→SDK Managerを起動。

自分がテストで使う実機のAndroidバージョンのSDKにチェックを入れ、OK→Next→Agreeでインストールしておく。
更に、SDK Tools→Android SDK Command-line Toolsにチェックを入れ、同じようにインストールしておく。

Flutterのインストール

https://flutter.dev/docs/get-started/install/macos

を参考にする。Google Chromeのブラウザ翻訳をするとよい。

FlutterSDKの入手

https://storage.googleapis.com/flutter_infra_release/releases/stable/macos/flutter_macos_2.5.3-stable.zip

をダウンロードし、Downloadsフォルダにflutterディレクトリができるので、どこかに設置するが、ここでは単純に自分のホーム「/Users/hogeuser/flutter」に置いた。

環境変数PATHを通す

ログインシェルスクリプト(bashなら.bash_profile, zshなら.zshrc)に、flutterコマンドパスを通す。

export PATH="$PATH:$HOME/flutter/bin"

パスが通っているか確認

which flutter dart

/Users/hogeuser/flutter/bin/flutter
/Users/hogeuser/flutter/bin/dart

Xcodeのインストール

Windows版と異なり、実機での実行はXcodeプロジェクトを開きRunすることになるので、App Storeから最新版をインストールしておく。バージョン12以上でないとFlutterは動かずエラーになります。

最新版選択と初回セットアップ ターミナルから

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch

Google Chromeのインストール

インストールしておかないとflutter doctorでエラーになるので、使わなくても一応入れておく。

https://www.google.com/intl/ja/chrome/

からダウンロード、Applicationsフォルダへコピー。

CocoaPodsのインストール

Flutter pub getパッケージ追加は裏でcocoapodsを使って管理しているのでインストールする。必須ツール。

sudo gem install cocoapods

iPhone/iPad実機を接続する

MacOSにiPhone実機をつなぐ。VMwareからなら、ゲストOSに接続、を選んで接続。このコンピュータを信頼しますか?で信頼。

Androidライセンスに同意する

flutter doctor --android-licenses

と走らせ、出るライセンス同意にすべて「Accept」とすれば、All SDK package licenses acceptedとなる。

flutter doctorの実行

ターミナルから、flutter doctorとする。

flutter doctor

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.5.3, on macOS 11.6 20G165 darwin-x64, locale
    ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[✓] Android Studio (version 2020.3)
[✓] Connected device (2 available)

• No issues found!

これまでのセットアップが正しく行われていれば、No issues found=成功となるはずである。

既存プロジェクトのiOS用セットアップ

基本的に開発はAndroid Studio + Android実機で行って、安定したらiosフォルダをビルドする。ここでの例はuntitled2とする。

ターゲットiOSバージョンの設定

たとえば、音声認識を行えるパッケージflutter_speechは、iOS9以下ではサポートされずエラーになる。iOS10以上、と設定する必要がある。これには、ios/Podfileを編集する。

# Uncomment this line to define a global platform for your project
# platform :ios, '9.0'
platform :ios, '10.0'

などとして、明示的に10以上のサポートを指定しておく。

ios/Runner/Info.plistの編集

パーミッションの指定はAndroidのAndroidManifest.xmlと同様、手動でInfo.plistを編集する。
たとえば、音声認識を行えるパッケージflutter_speechは、マイクと録音の許可を申請するので、以下のように加える。

vi ios/Runner/Info.plist

<key>NSMicrophoneUsageDescription</key>
<string>This application needs to access your microphone</string>
<key>NSSpeechRecognitionUsageDescription</key>
<string>This application needs the speech recognition permission</string>

リビルド

プロジェクトルートディレクトリに戻り、

flutter clean
flutter packages get
flutter build ios

としてビルドする。iOSバージョンが低い・高いなどでパッケージエラーが出た場合、Podfileを修正して、

cd ios
vi Podfile
...修正
pod install

などとして解決を図る。

Xcodeの起動とコードサイン、実機テスト実行

プロジェクトルートディレクトリから

open ios/Runner.xcworkspace

とし、Xcodeを起動して、左ペインの「Runner」クリック→右ペイン「Signing & Capabilities」を選択。
なんらかのデベロッパチームを指定しなくてはいけないので、Apple Developperで無料登録した自分のアカウントで「Add Account」とする。

ログイン成功したら、メニューのXcode→Preferences→Accountsで、Download Manual Profilesとし、その右のManage Certificates...で、左下「+」ボタンから「Apple Development」を選択して証明書を追加、Doneする。

もとのSigningペインに戻るとTeamは解決しているが、Bundle Identifierでエラーが出ている場合、com.example.untitled2などから、jp.co.hogehoge.untitled2など、自分として正しいドメインパッケージ名に変えてみる。

ここまで問題なければ、上ウインドウバーで自分の実機を選択して、左の再生アイコンをクリックすれば、実機へのインストールが始まる。

最初は未承認のエラーが出るので、iPhone実機側→設定→一般→プロファイルとデバイス管理→で、今入れたアプリを「承認」する。

この状態でもう一度Runすれば、今度はちゃんと実行できるはずである。

※本記事は当サイト管理人の個人的な備忘録です。本記事の参照又は付随ソースコード利用後にいかなる損害が発生しても当サイト及び管理人は一切責任を負いません。
※本記事内容の無断転載を禁じます。
【WEBMASTER/管理人】
自営業プログラマーです。お仕事ください!
ご連絡は以下アドレスまでお願いします★

【キーワード検索】