0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

①AndroidStudio+Flutter入門者が、センサ取得アプリを作る

0
Posted at

以前の記事の4章からを参考に、Androidアプリを作成する。

作りたいもの

・BLE送信される複数のセンサ情報を、表示・ログ保存するアプリ
・AndroidStudio + Flutter で作成

作業の順序

  1. BLE通信の確立。1つの値を表示
  2. 受信した複数の値を、数値でリアルタイム表示
  3. 複数の値をグラフなどで表示

1.BLE通信を確立して表示するまで

1)[New Flutter Project]を選択してプロジェクトを新規作成

環境変数にパスが入っていることを確認してNext
image.png

プロジェクト設定を次のように入力してCreate

項目 設定例
Project name sensor_monitor
Location 任意
Description BLE Sensor Monitor
Organization com.example

image.png

Platforms(プラットフォーム)は、目的のAndroidは必須。他は後々作りたい環境をあらかじめ入れた。

image.png
上記は「指定のディレクトリが無いので作るね」なのでCreate

プロジェクトが新規作成され、libディレクトリ内のmain.dartが自動で開く
image.png

2)デモ画面で動作確認

【方法A】スマホ実機で行う方法

① スマホをUSBケーブルでパソコンに接続

USBつないだ際に出てくる選択肢ではファイル転送 / Android Autoを選択

②スマホ側で「USBデバッグ」をONにする

【Androidスマホの操作】
:gear: 設定→デバイス情報(端末情報)
 ↓
ビルド番号を7回連打
 ↓
開発者モードを有効化のテキストが1秒ほど表示
 ↓
:gear: 設定→システム→詳細設定→開発者オプションを開く
 ↓
USBデバッグを ONにする
 ↓
AndroidStudioの上部で、PCとUSB接続したスマホを選択する
これでPCとスマホがBLE開発モードでつながる
image.png

【方法B】AndroidStudioのバーチャルスマホで行う方法

① 右端のDevice Managerアイコン > Medium Phone API 36を選択

image.png

② 2,30秒待つと、バーチャルスマホが起動する

image.png

  • AndroidStudioの上部バーでMedium Phone API 36(mobile)を選択し、:arrow_forward:を押すとmain.dartが実行される
③ 操作して動作確認
  • スマホ画面に配置している+を左クリックで中央の数字がカウントアップすることを確認
  • 下のConsole画面にも実行結果が表示される
  • :stop_button:を押すとデモ画面は終了しないが、下のConsole画面に実行結果が更新されなくなる

image.png

3)pubspec.yaml編集

pubspec.yamlを開き、下の方のdependancies:項目に

image.png

下の三行を追加して、プロジェクトを保存(ctrl+S)

dependencies:
  flutter:
    sdk: flutter

  flutter_blue_plus: ^1.32.0
  path_provider: ^2.1.2
  permission_handler: ^11.0.1

その後、右上のPub getを押してエラーが出なければOK
image.png

Messagesは次の通り

image.png

終了コード0で完了しているので問題はない、のか?
1回目は次のようなメッセージも出た。

Please enable Developer Mode in your system settings. Run
  start ms-settings:developers
to open settings.
Process finished with exit code 0

今回、バーチャルスマホを試しているからか、PCの開発者モードをONにせよ、と赤文字で示された。
PCの開発者モードONの手順は 参考サイト を参考に設定して再起動。
ただ、開発者モードをOFFにし忘れそうなので、実機スマホで動作確認することにした。

4)Android権限設定

詳しくは以前の記事-2.双方ともBLEスキャンができる設定にするを参照

①android/app/src/main/AndroidManifest.xml を開く

image.png

<application> タグより前(つまり <manifest> の直後あたり)に、下記を追加

<uses-permission android:name="android.permission.BLUETOOTH" android:maxSdkVersion="30"/>
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN" android:maxSdkVersion="30"/>

<uses-permission android:name="android.permission.BLUETOOTH_SCAN"/>
<uses-permission android:name="android.permission.BLUETOOTH_CONNECT"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>

<uses-feature android:name="android.hardware.bluetooth_le" android:required="true"/>

image.png
⚠ maxSdkVersion付きの旧BLE権限も必要(Android11以下対策)
そして保存(ctrl+S)

5)Android 12以上対策

android/app/build.gradledefaultConfig {内に、

minSdk = 21

と、確認条件を追加(flutter_blue_plusは21以上必要)

image.png

ここまでは、おおむね毎回行う操作

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?