[Flutter]実機で検証する方法(iOS編)

Flutterのアプリを自分のiphoneでも動きを見てみたいと思い、実機検証をしてみました♪

[Flutter]実機でデバッグしてみる(Android編)

検証環境

  • MacBook (ver. 10.15.5)
  • iPhone8 plus (iOS ver.13.5.1)
  • Xcode 11.6 beta

※Xcodeは最新バージョンをインストールしないとエラーが起きたりすることもあります。

※iPhoneとMacは予めUSBで接続しておきます。

Xcode開く

  1. MacのアプリフォルダにあるXcodeを開く。
  2. 左側にある「Runner」タブを開き、「Signing&Capabilities」>「Team」でチームを選択。
  3. 「Bundle Identifer」の名称を変更。同じものが使えないみたいなので日付を後ろにつけたりして追加します。(e.x. flutter.app.example20200601
  4. Xcodeの画面一番上のデバイス選択を検証したいデバイスに変更し、「▶︎」を押下し実行。

※ハマりポイント

Xcodeがアップデートされていると、エラーが起きてしまう。エラーの表示が出てバージョンがサポートされてないという表記が出た場合、Appleから最新バージョンのXcodeをダウンロードしてインストールする必要があります。

https://developer.apple.com/jp/

 

iPhone側の設定

上記の通りXcodeで実行を押下するとiPhone側で許可してくださいという表示が出てきます。

iPhone側で「設定」>「一般」>「プロファイルとデバイス管理」>デベロッパAPPに表示されてるFlutterアプリを選択し「許可」します。

すると、iPhoneホーム画面にFlutterアプリがインストールされて完了です!

まとめ

Xcode上の設定で結構てこずりました><

ポイントは「チーム選択する」「Bunndle名変更する」「Xcodeバージョン最新にする」の3つがうまく設定できてないとエラーが起きるのでご注意ください。

[Flutter]実機でデバッグしてみる(Android編)

34歳から始めるオンライン学習

【Web開発初心者向け!】Web開発入門完全攻略 充実の18時間コース

未経験からプロのWebデザイナーになる! 400レッスン以上の完全マスターコース

関連記事

[Flutter]とりあえずHello Flutterコピペ

[Dialogflow]ダイアログフローでハローワールド

Progate(プロゲート)完了したら何したらいい?

[flutter]実機でデバッグする方法

[Flutter]シンプルな折れ線グラフ

[Flutter]縦棒&横棒グラフ(チャート)