Power AppsとPower Automateの連携ミニマム版


Power Appsから入力したデータをPower Automateに送り何か処理をしてPower Appsに返す的なことのミニマムを考えてみます。

## 作るもの: ボタンを押すと文字を加工して返してくれる

> ![](https://i.gyazo.com/da0da82946b3adaba5feafeb3d81bd72.gif)

## 1. Power Apps側: 最低限のパーツを追加

まずは画面を作ってみます。

- `テキスト入力`のパーツを追加

> ![スクリーンショット 2024-06-03 12.46.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/c69e3589-bdee-b89b-c16c-415199f571e0.png "スクリーンショット 2024-06-03 12.46.05.png")

- `ボタン`のパーツを追加

> ![スクリーンショット 2024-06-03 12.46.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/8de70555-2814-5715-c14f-48395c1b718c.png "スクリーンショット 2024-06-03 12.46.51.png")

- `テキストラベル`のパーツを追加

> ![スクリーンショット 2024-06-03 12.47.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/184a36a7-c9d0-8392-9fb6-d0c696030e72.png "スクリーンショット 2024-06-03 12.47.06.png")

### 一旦設置後のイメージ

こんな感じです。ツリービューをみると以下のような状態です。

> ![スクリーンショット 2024-06-03 12.48.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/9a0454b4-c1e5-f307-71f6-a3d1490f9a7b.png "スクリーンショット 2024-06-03 12.48.52.png")

参考程度ですが、ツリービューからコード出力をすると以下のような出力でした。

```yaml
- Screen1:
    Control: Screen
    Children:
    - Label1:
        Control: Label
        Properties:
          X: =28
          Y: =88
    - Button1:
        Control: Classic/Button
        Properties:
          X: =156
          Y: =478
    - TextInput1:
        Control: Classic/TextInput
        Properties:
          X: =28
          Y: =326
```

## 2. Power Automate側: Power Appsから情報を受け取って処理して返すフロー

次に、Power Automateで処理を作ってみます。

`自動化したクラウドフロー`を構築するからスタートします。

### 2-1. トリガー: Power Appsトリガーを追加（入力）

トリガーにPower Apps (V2)を選びます。

> ![スクリーンショット 2024-06-03 13.14.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/e045110f-5ef0-3be2-cfb5-ce33843a9fc9.png "スクリーンショット 2024-06-03 13.14.46.png")

`入力の追加` => `テキスト`で進みます。

> ![スクリーンショット 2024-06-03 13.24.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/4d90c834-4dc2-edec-cec5-154d36bb4a8b.png "スクリーンショット 2024-06-03 13.24.40.png")

`入力`となっている部分を`otameshi`などの何か名前を設定しておきます。

### 2-2. アクション: 変数の初期化

送られてきたデータを少し処理したいので、`"Power Appsから送られてきた情報（otameshi）"+"って送られてきたよ！！"`という文字列にしてみます。

`変数を初期化する`のアクションを検索して追加します。

- Name: `responseMsg`
- Type: `String`
- Value: `(otameshiの動的コンテンツ)+"って送られてきたよ！！"`

> ![スクリーンショット 2024-06-03 13.31.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/8081dcd6-ce46-0931-20a3-5bd36e66b535.png "スクリーンショット 2024-06-03 13.31.29.png")


### 2-3. アクション: Power Appsまたはフローに追加（出力）

Power Automate側のラストです。出力になります。

`Power Appsまたはフローに追加`のアクションを検索して追加します。

`出力を追加` => `テキスト`で進みます。

> ![スクリーンショット 2024-06-03 13.36.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/d1201878-9a7d-aa07-7cd1-f68c0a308219.png "スクリーンショット 2024-06-03 13.36.40.png")

キー名を`paResponse`、値は動的コンテンツで`変数を初期化する`の項目内の`responseMsg`にしましょう。

### 2-4. 保存&名前をつける

保存をして、フローの名前を分かりやすいものにしましょう。ここでは`PA連携TEST0603`としました。

> ![スクリーンショット 2024-06-03 13.37.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/1d47cd32-7226-974d-d659-4bbc5dcec41f.png "スクリーンショット 2024-06-03 13.37.20.png")

## 3. Power Apps側で呼び出しと連携

連携手順を紹介します。

### 3-1. Power Automateとの連携

まずはPower AppsからPower Automateのフローを呼び出せるように読み込みをします。

Power Appsの画面に戻り、サイドバーのPower Automateのアイコンを選択します。

> ![スクリーンショット 2024-06-03 13.45.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/f3956254-e4d8-dd00-0d05-740c4029e44e.png "スクリーンショット 2024-06-03 13.45.06.png")

`フローの追加`を押すと先ほど作成したPower Automateのフローを連携させます。
`PA連携TEST0603`など先ほど付けた名前を見つけて選択します。

> ![スクリーンショット 2024-06-03 13.44.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/dce87fbd-236d-6863-66b8-8a8e532ce078.png "スクリーンショット 2024-06-03 13.44.29.png")

連携できると以下のような表示になります。

> ![スクリーンショット 2024-06-03 13.48.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/16c96e4a-22f1-f9d9-0d4e-9ae5f97ab064.png "スクリーンショット 2024-06-03 13.48.12.png")

### 3-2. ボタンに機能を付ける

ボタンを選択し、関数の入力箇所(fx)の部分に以下をコピペして設定します。

```
UpdateContext(
    {newLabelText: 'PA連携TEST0603'.Run(
        TextInput1.Text
    ).pa_response}
)
```

> ![スクリーンショット 2024-06-03 13.52.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/e7567a7e-b64b-dcd3-196c-60fb8ebdebb2.png "スクリーンショット 2024-06-03 13.52.42.png")

簡単に解説
- 'PA連携TEST0603'の部分: これはPower Automateのフロー名です。
- `pa_response`の部分: これはPower Automate側で出力に設定したキー名です。
- `newLabelText`の部分: ここはPower Apps内で利用する変数です。
- `TextInput1.Text`の部分: ここはテキストを入力してPower Automateの入力に値を渡す際の変数になります。`TextInput1`はパーツを追加したときに自動的に設定されるIDのようなものです。

> ![スクリーンショット 2024-06-03 13.56.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/bd4a83ac-aefb-c564-012c-838f90320c90.png "スクリーンショット 2024-06-03 13.56.04.png")

### 3-3. ラベルに表示を連携する

テキストラベルに処理をした内容を表示させたいです。元々"テキスト"と入っている文字列を削除して`newLabelText`を入れましょう。これでPower Automate側で処理をして返ってきた値がここに入ります。

> ![スクリーンショット 2024-06-03 13.57.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/0550dece-a85d-57ac-8e64-080b110f1118.png "スクリーンショット 2024-06-03 13.57.42.png")


## 完成: 試してみる

試してみます。ちゃんと動いてそうですね。

> ![](https://i.gyazo.com/da0da82946b3adaba5feafeb3d81bd72.gif)

### 応用

裏側でHTTPやエクセルのアクションに繋げば、可能性は広がりそうですね。

> ![スクリーンショット 2024-06-03 14.02.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/7bc4a533-bf34-aa59-aa5d-6284dfd231bc.png "スクリーンショット 2024-06-03 14.02.01.png")

## まとめ

`Power Apps => Power Automate => Power Apps`という連携を試してみました。

同じようなことをやりたい人は試してみて下さい。