【Flutter】Android Studioで開発環境を用意する方法（Mac編）
この記事では Android Studio で Flutter の開発環境を用意する手順を紹介しています。
公式サイトで紹介されている手順に従って
- Flutter SDK
- Android Studio
- Flutter プラグイン
を用意します。
また正しく動作することを確認するために、プロジェクトを作成から Android エミュレータ＆ iPhone シミュレータでの実行方法も紹介しています。
① Flutter SDK のインストール
SDK のダウンロード
https://docs.flutter.dev/install/manual を開いて、macOS を選択します。
Install and set up Flutter 部分まで画面をスクロールして、zip ファイルをダウンロードします。
お使いのMacのプロセッサに合わせて Apple Silicon または Intel を選択してください。
プロセッサはツールバー左上の「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 フォルダへのパスが正しいかをご確認ください。
② Android Studio のインストール
Android Studio は Jellyfish 以降のバージョンが必要になります。
インストールしていない場合は、以下の記事で手順を紹介しているので、最新版をインストールしてから先にお進みください。
③ Flutterプラグインの追加
Android Studio で Flutter プロジェクトを作成するために、Flutter プラグインを追加します。
Android Studio スタート画面にある Plugins をクリックします（既にプロジェクトを開いている方は、画面右上の アイコン→ Plugins をクリックします）。
Flutter をインストールします。
Restart IDE をクリックします。
Restart をクリックして、Android Studio を再起動します。
再起動後のスタート画面には、Flutter プロジェクトの作成ボタンが追加されます。
Plugins 画面を開くと Flutter と一緒に Dart もインストールされたことを確認できます。
プロジェクトの作成
New Flutter Project をクリックします。
左側のメニューから Flutter を選択 → flutter のパスを確認 → Next をクリックします。
このパスはダウンロードした flutter フォルダを置いた場所です。入力されていない場合は直接入力するか、… をクリックして選択します。
今回は動作を確認するだけなので、適当なプロジェクト名を入力して、それ以外はデフォルトのまま進めます。
アプリを実行する方法
Android エミュレータの場合
画面右側にある Deveice Manager アイコンをクリックして、エミュレータを起動します。
エミュレータがない場合は Android Studioエミュレータの作成方法 をお読みください。
エミュレータが起動できると、画面上部にエミュレータ名が表示されます。
▶︎ ボタンを押してアプリを実行します。
このようなアプリ画面が表示されたら成功です！
iPhone シミュレータの場合
Xcode で用意されている iPhone シミュレータでもアプリを実行することができます。
Xcode をインストールしていない方は Xcodeのインストール方法 からご用意ください。
Xcode をインストールしたら以下のページを開いて、コマンドをコピーします。
https://docs.flutter.dev/platform-integration/ios/setup#set-up-tooling
ターミナルを開いて、コピーしたコマンドを貼り付けてEnter キーを押します。
続けてパスワードの入力が求められるので、パソコンにログインするときに使用しているパスワードを入力して Enter キーを押します。
ターミナルの処理が終わったら、Xcode のメニューから Open Developer Tool → Simulator を開きます。
iPhone シミュレータが起動できたら Android Studio に戻ります。
デバイスリストに iPhone シミュレータが追加されるので、選択して ▶︎ を押します。
iPhone シミュレータで Flutter プロジェクトが実行されました。
このサイトでは「わかりやすく・シンプル」をモットーに、プログラミングの基礎からアプリ開発まで紹介します。
独学でプログラミングを勉強をしている方、基礎は勉強したけれど次に何をすれば良いか分からない...という方のお役に立てるサイトを目指しています。
主な使用言語：Kotlin / Java / PHP
>> 詳しいプロフィール
>> お問い合わせ
>> 書籍
>> note も更新中！
