PowerAppsでマイクの音声を録音・保存・再生する

Rev. 0, Y. Nishimura, 2021/6/11

PowerAppsでマイクの音声を録音し、SharePointにJSON形式で保存、それをPowerAppsで再生することができます。

ここではPower Automateを使わずに、PowerAppsのJSON関数を用いてこれらの機能を実現します。

SharePointのリストを作成する

ここではSharePointのリストを使って、音声データを保存します。

「ホーム」ー「＋新規」ー「リスト」をクリックします。

「リストを作成」ー「空白のリスト」を選択します。

ここでは「名前」を「AudioJSON」として、「作成」をクリックします。

以下のように、リストに列を追加します。

列	種類	説明
Name	一行テキスト	音声ファイルの名前
JSON	複数行テキスト	音声データ（JSON形式）

「ID」列を表示します。

「タイトル」列を「必須でない」ようにして、非表示に設定します。

キャンバスアプリを立ち上げる

データを追加する

先ほど作成したSharePointのデータベース「AudioJSON」を接続します。

「データ」ー「データの追加」をクリックして、「SharePoint」の該当のサイトを選び、リスト「AudioJSON」を選択します。

アプリの画面を作成する

画面に「AudioScreen1」と名前をつけて、以下のように、コントロールを配置します。

以下のように、プロパティとその関数を設定します。

コントロール種別	名前	プロパティ	fx
ラベル	Label1	Text	“マイクから録音した音声をJSON形式で保存・再生”
マイク	Microphone1
オーディオ	Audio1	Media	Microphone1.Audio
ボタン	Button1	OnSelect	（詳細＊）
ラベル	Label2	Text	“SharePointのリストから再生”
オーディオ	Label2	Media	Substitute(Last(AudioJSON).JSON,””””,””)

（詳細＊）
Button1.OnSelect =

Set(AudioJson1,JSON(Microphone1.Audio,JSONFormat.IncludeBinaryData));
Collect(
AudioJSON,
{
Name: “TestAudio” & Text(Now(),”yyyymmdd-hhmmss”),
JSON: AudioJson1
}
);

解説します。

• マイク「Microphone1」をクリックして、音声の録音を開始します。もう一度クリックして、録音を停止します。
• オーディオ「Audio1」で、録音した音声を再生することができます。
• ボタン「Button1」をクリックすると、「Microphone1.Audio」を、Binaryデータを含んだJSONフォーマットに変換して、グローバル変数「AudioJson1」に格納します。「Name」列を「TestAudio{yyyymmdd-hhmmss}」、「JSON」列を「AudioJson1」と設定し、SharePointのリスト「AudioJSON」にこのアイテムを追加します。
• オーディオ「Audio2」で、SharePointに最後に保存した音声を再生することができます。「JSON」列は、複数行テキストですから、ダブルコーテーションがついています。Substitute関数を用いて、それを取り除きます。

アプリの動作を確認する

ブラウザで動作を確認してみましょう。

• 録音・再生が可能なことを確認します。
• 保存ボタンを押すと、SharePointにJSON形式で保存されていることが確認できます。
• 保存された音声が再生できることも確認できます。

また、スマホでも動作を確認してみましょう。

SharePointのデータの例です。

参考文献

• Power Apps の JSON 関数
• Power Apps でのマイク コントロール
• PowerApps JSONの使い道

以上