Flutter3.0 + Android Studio + Xcode + Mac(Intel CPU) の環境構築の備忘録

Mac(Intel CPU)に、Flutter3.0をインストール。Android StudioとXcodeでの環境構築の記録です。

ほぼ、【2022年度】MacでFlutter開発環境構築 (M1 Mac/Android Studio対応) の内容を参考にさせていただきました。 MacのCPUがIntelの違いくらいです。

目次

Macの環境

  • macOS Monterey バージョン 12.3.1
  • MacBook Air (Retina, 13-inch, 2019)
  • メモリ 8GB

Flutte3.0のインストール

公式サイトより flutter_macos_3.0.0-stable.zip をダウンロードします。

flutter_macos_3.0.0-stable.zip を解凍して、その中にある「flutter」を任意のフォルダに配置します。 「flutter」 内の「bin」にパスを通します。

//zshを使っているので
$ vim ~/.zshrc

//起動したvimで、下記を追記
$ export PATH="$PATH:$HOME/Developer/flutter/bin"

//保存して終了
$ :wq

flutter doctorで環境構築が出来ているかの確認

ターミナルにて、下記のコマンドで、Flutterの環境構築が出来ているかを確認します。

> flutter docker

WindowsでのFlutterの環境構築では、ここで結構、手間取りましたが、Macの場合は、すんなり確認OKが出来ました。

Android Studio のインストール

公式サイトより、 android-studio-2021.2.1.14-mac.dmg をダウンロードします。

android-studio-2021.2.1.14-mac.dmg をダブルクリックして、イメージを作成します。 android-studio のアプリをアプリケーションフォルダにインストールします。

Android Studioのセットアップのウィザードがはじまります。初めての利用なので、インポートする設定はありません。

「Next」をクリック。

Googleに情報を送信するかどうかは、お好みで。

Install Type に「Standard」を選択。

Select UI Themeで、お好みのUIを選択。

インストールする内容を確認して。

各種ライセンスの承認をします。

インストール開始。

インストール完了。

インストール後、 Android Studio が起動します。

Android Studio の設定

Android Studio の設定をします。Plunginの設定をします。

FlutterのPluginをインストールします。

Flutterのプラグインをインストール。

同時にDartのプラグインもインストールされます。

Xcodeのインストール

Xcodeは既にインストールしていました。但し、バージョンが古かったので、最新にアップデートして起動しておきます。

Flutterプロジェクトの作成

Android Studioのメインメニューより「New Flutter Project」をクリックします。

Flutter SDKのパスを指定します。

プロジェクトの情報を設定します。

プロジェクトが起動します。Device Selectorから「Open iOS Simulator」を選びます。

iOS Simulator が起動しました。Flutter プロジェクトを起動します。

デフォルトのサンプルアプリが起動しました。

アプリは正常に動作しているようです。

ソースの文字列を変更して保存すると、ホットリロードにて、プレビュー画面に反映されます。

よかったらシェアしてね!

この記事を書いた人

次男が高校ラグビー部での活動を終え、卒部を迎えました。これで、長男、次男ともに中学での野球部、高校でのラグビー部の活動が全て終わりました。9年間怪我をしながらも無事にやり切りました。小学校のソフトボールも入れると15年にもなりました。息子たちも大変でしたが、親も休日は部活動の送迎、応援、動画撮影、編集にと忙しくも楽しい時間を過ごすことができました。

目次
閉じる