【Flutter】Android Studioで開発環境を用意する方法（Mac編）
この記事では Android Studio で Flutter の開発環境を用意する手順を紹介しています。
公式サイトで紹介されている手順に従って
- Git
- Android Studio
- Flutter SDK
をインストールして、その後 Android Studio に Flutter プラグインを追加します。
正しく動作することを確認するために、Flutter プロジェクトを作成して Android エミュレータ と iPhone シミュレータで実行するところまで紹介します。
必要なソフトウェアの用意
https://docs.flutter.dev/get-started/install を開いて macOS をクリックします。
Android をクリックします。
Git と Android Studio の用意から始めましょう。
① Git
まずは Git がインストールされているかを確認します。
ターミナルを開いて git --version と入力して Enter キーを押します。
Git のバージョンが表示された場合は ② Android Studio にお進みください。
Git のバージョンが表示されなかった場合は Homebrew を使って Git をインストールします。
ターミナルを開いて brew --version と入力して Enter キーを押します。
Homebrew のバージョンが表示された場合は
brew install gitを実行します。
Homebrew のバージョンが表示されなかった場合は
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"をターミナルで実行してから
brew install gitを実行します。
インストール出来ているか確認するには、一度ターミナルを閉じて、再度 git --version を実行してください。
② Android Studio
Android Studio は Jellyfish 以降のバージョンが必要になります。
インストールしていない場合は、以下の記事で手順を紹介しているので、最新版をインストールしてから先にお進みください。
③ Flutter SDK
ダウンロード
Install the Flutter SDK まで画面をスクロールします。
Download and install タブを選択して、flutter_macos_XXX-stable.zip をクリックします。
お使いのMacのプロセッサに合わせて Intel Processor または Apple Silicon を選択してください。プロセッサは画面左上にある「Apple メニュー → このMacについて」から確認できます。
zip ファイルの展開
ダウンロードした zip ファイルをダブルクリックします。
flutter フォルダを任意の場所に置きます。
ここでは \Users\ユーザ名\development に置きました。
パスの設定
ターミナルを開いて vim ~/.zshrc と入力して Enter キーを押します。
i キーを押すと入力モードになるので、export PATH=$HOME/development/flutter/bin:$PATH と入力します。
* 先ほど flutter フォルダを置いた場所を書いてください。
esc キーを押して入力モードを終了し、:wq と入力して Enter キーを押します。
インストールの確認
コマンドプロンプトを開いて、flutter --version と入力して Enter キーを押します。
バージョンが表示されたら完了です。
バージョン名が表示されない場合は、bin フォルダへのパスが正しいかをご確認ください。
Flutterプラグインの追加
Android Studio で Flutter プロジェクトを作成するために、Flutter プラグインを追加します。
Android Studio スタート画面にある Plugins をクリックします（既にプロジェクトを開いている方は、画面右上の アイコン→ Plugins をクリックします）。
Flutter をインストールします。
Restart IDE をクリックします。
Restart をクリックして、Android Studio を再起動します。
再起動後のスタート画面には、Flutter プロジェクトの作成ボタンが追加されます。
Plugins 画面を開くと Flutter と一緒に Dart もインストールされたことを確認できます。
プロジェクトの作成と動作確認
最後に、Flutter プロジェクトを作成してエミュレータとシミュレータ（パソコン上で動くスマートフォン）で確認しておきます。
プロジェクトの作成
New Flutter Project をクリックします。
左側のメニューから Flutter を選択 → flutter のパスを確認 → Next をクリックします。
このパスはダウンロードした flutter フォルダを置いた場所です。入力されていない場合は直接入力するか、… をクリックして選択します。
今回は動作を確認するだけなので、適当なプロジェクト名を入力して、それ以外はデフォルトのまま進めます。
エミュレータでアプリを実行
画面右側にある Deveice Manager アイコンをクリックして、エミュレータを起動します。
エミュレータがない場合は 【2024年版】Android Studioエミュレータの作成方法 をお読みください。
エミュレータが起動できると、画面上部にエミュレータ名が表示されます。
▶︎ ボタンを押してアプリを実行します。
このようなアプリ画面が表示されたら成功です！
iPhone シミュレータで確認する
Xcode で用意されている iPhone シミュレータでもアプリを実行することができます。
Xcode をインストールしていない方は Xcode16のインストール方法 からご用意ください。
Xcode をインストールしたら以下のページを開いて、コマンドをコピーします。
https://docs.flutter.dev/get-started/install/macos/mobile-ios#configure-ios-development
ターミナルを開いて、コピーしたコマンドを貼り付けてEnter キーを押します。
続けてパスワードの入力が求められるので、パソコンにログインするときに使用しているパスワードを入力して Enter キーを押します。
Xcode のメニューから Open Developer Tool → Simulator を開きます。
iPhone シミュレータが起動できたら Android Studio に戻ります。
デバイスリストに iPhone シミュレータが追加されるので、選択して ▶︎ を押します。
iPhone シミュレータで Flutter プロジェクトが実行されました。
このサイトでは「わかりやすく・シンプル」をモットーに、プログラミングの基礎からアプリ開発まで紹介します。
独学でプログラミングを勉強をしている方、基礎は勉強したけれど次に何をすれば良いか分からない...という方のお役に立てるサイトを目指しています。
主な使用言語：Java / Kotlin / PHP
>> 詳しいプロフィール
>> お問い合わせ
>> 書籍を出版しました！
