Flutterサンプルアプリの作成と実行

by

Flutterのサンプルアプリのカウントアプリの作成と実行を行う

サンプルアプリの作成

作成コマンドの実行

ターミナルで以下のコマンドを実行することで、サンプルアプリのファイルなどが作成される.
今回はtest_appという名前のアプリを作成する.

Zsh
flutter create "アプリ名"

コマンドの実行が成功するとコマンドを実行した場所にアプリ名のフォルダができている.
このフォルダをVS codeにドラッグ&ドロップする.

これによりVS codeで開発ができるようになる.

よく使うファイルとフォルダの説明

android生成されたandroidアプリ本体とandroidアプリのための設定ファイルが置かれる 
ios生成されたiosアプリ本体とiosアプリのための設定ファイルが置かれる 
libdartファイルが置かれる。このdartファイルを編集してアプリを作成する 
test作成したアプリをテストするdartファイルが置かれる 
pubspec.yamlアプリで使用するパッケージを記述するファイル 

iOS(Xcode)の設定

ios/Runner.xcodeprojをxcodeで開き、Signingの設定をする.
Runner.xcodeprojをxcodeで開いたら、左の項目からRunnerを選択し、Signing&Capabilitiesタブを選択する.
その後、TeamとBundle Identifierを設定する.
(TeamはApple IDが必要で、Bundle Identifierは他のアプリと同じものは設定できないので注意する.)

サンプルアプリの実行

アプリの実行

VS codeのターミナルを開き以下のコマンドを実行する.

Zsh
flutter run

PCに複数デバイスを接続している場合は、どのデバイスで実行するか聞かれるので、対応するデバイスの数字を入力する.
(flutter runで実行するとデバッグモードで実行される.リリースモードで実行する場合には、flutter run –releaseで実行する.)
上手くいくと実行したデバイスにカウンタアプリが表示される.

アプリの停止

実行したアプリを停止する場合は実行中のターミナルに q を入力する.

補足:遭遇したエラー

iOS

  • iOSでアプリを実行しようとしてエラーが起こる場合、ios/Runner.xcodeprojをXcodeで開く.
    Signing&Capabilitiesのteamやbundle Identifierを確認し、Xcodeでエラーが出ないように修正することでエラーが解消されることがあった.
  • Signing&Capabilitiesのアカウントがフリーアカウントの場合には、iosにインストールできる自作アプリが3つまで(らしい)なのでインストールできなかった.解消法はインストール済みの自作アプリを削除すること.
  • アプリ起動時に「信用されていないデベロッパ」メッセージが表示され実行できない.解決法はiOSスマートフォンの 設定>一般>VPNとデバイス管理>デベロッパAPP で、デベロッパ名を選択し信用する設定に変更する.
  • 「Iproxyは検証できないため開けません」というメッセージが表示され、ターミナル(PC)とデバイス(スマートフォン)の通信ができなくなる.解決法はMACの設定画面を開き、iproxyを許可する.

コメントする