PowerAppsカメラコントロールでハマった

PowerApps にはデバイスのカメラを利用して写真を撮影する機能が標準で提供されています。今回は、そのカメラコントロールでハマったポイントを紹介します。

#作りたかったモノ
作ったアプリとはチョッと違うのですが、説明用にシンプル化したイメージが下記になります。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/215892/c1b7d1f4-2927-47c3-86ef-a7dd5917065d.png)
カメラコントロールを配置して、撮影ボタンを押下することで撮影するようなアプリが作りたかったんです。ちなみに、トグルボタン（カメラコントロールの下にあるスイッチ）はカメラの向き（正面 or 背面）を切り替えるためです。このようなカメラ＋撮影ボタンで写真を撮影して次の処理へつなげたかったんですよね・・・。それが、あんなことになるなんて・・・。

#ハマったポイント
さて、ここからが実際に自分がハマったポイントです。上記の作りたかったモノではなく、ハマった後に現象を調査・確認するために作成したアプリ等を利用して説明します。

###その１：「カメラ.Photo」は「カメラ.OnSelect」以外ではうまく動作しない
以下の動画をご覧ください。
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr"><a href="https://twitter.com/hashtag/PowerApps?src=hash&amp;ref_src=twsrc%5Etfw">#PowerApps</a> のCameraコントロール。ボタンのOnSelectでCollectできない。 <a href="https://t.co/xsWySDNWEC">pic.twitter.com/xsWySDNWEC</a></p>&mdash; やま (@yamad365) <a href="https://twitter.com/yamad365/status/1114876708488744960?ref_src=twsrc%5Etfw">April 7, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

可能な限り、関数などをボタンのテキストなどにしてあるので概ね把握いただけるかと思いますが、念のため簡単な解説をしておきます。

```Camera.Onselect
Collect(Photo,Camera1.Photo)
```
”Photo”という配列にカメラに映っている対象を格納しています。その配列を画面右端にあるGallery1の[Items]へ指定しています。これにより、カメラコントロールをクリックするとGalleyに表示される画像が増えていきます。


```青色のボタン.OnSelect
ClearCollect(Photo,Camera1.Photo)
```
カメラコントロールの被写体をボタンで画像にしよう、と思ったら上記のような記述になるかな？と思うじゃないですか・・・。上記動画をご確認いただくとわかるように、そうはなりません。どうやら、カメラコントロール以外のコントロールから操作した場合は[.Photo]を更新できないようです。

###その２：Pixcel 3だと背面カメラが0でも1でもない
所謂、デバイス依存 というヤツですね。
カメラコントロールを正面カメラ←→背面カメラのように切り替える際[Camera]プロパティに0と1を設定することできます。冒頭に紹介した「作りたかったモノ」のようにトグルコントロールを置いて、その値（Toggle.Value）で制御することが多いかと思います。
このように実装したアプリをPixcel 3ユーザーに検証してもらったら、iPhoneやXperiaなどのスマートフォンと異なる動きをしたんです。それで不安になった当方。手元にあった各種デバイスで検証した結果を下記にまとめておきます。

| 機種             | Camera.Camera=0 | Camera.Camera=1 |
|:-----------------|:-----------------:|:------------------:|
| Pixcel 3         | インカメラ(ディスプレイ側)       |  インカメラ   |
| Xperia XZ        | 背面カメラ | インカメラ |
| iPhone Xs        | 背面カメラ | インカメラ |
| ASUS ZenPad 8    | 背面カメラ | インカメラ |
| Surface Pro4   | インカメラ | 背面カメラ |

###Pixcel 3 追加調査
カメラコントロールの[.Camera]へ渡す値をラジオボタンから選択するアプリを作って調査してみました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/215892/bf411562-7cc1-2625-77f3-23a02a2534b0.png)

これをPixcel 3で検証してみた結果。

| Camera.Camera    | 結果 |
|:-----------------|:-----------------:|
| = 0         | インカメラ |
| = 1         | インカメラ |
| = 2         | インカメラ |
| = 3         | 背面カメラ |
| = 4         | カメラ起動せず |

なるほど。Pixcel 3 はインカメラが2つあるので、おそらく両方、左だけ、右だけという設定で、4つ目の選択肢が背面カメラになるのでしょう。インカメラと背面カメラの２つ、ではないデバイスだと同じような結果になるのでは？という予想ができますね。
※手元に3つ以上のカメラを持ったデバイスが無いため、これ以上の調査ができませんでした・・・。

#おまけ
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">おわかりいただけるだろうか・・・。<a href="https://twitter.com/hashtag/PowerApps?src=hash&amp;ref_src=twsrc%5Etfw">#PowerApps</a> <a href="https://twitter.com/hashtag/Surface?src=hash&amp;ref_src=twsrc%5Etfw">#Surface</a> Camera Control。Surface Pro 4で、CameraＮ.Camera = 2 だと赤外線カメラっぽいモードになる！！ <a href="https://t.co/mhAMKed07p">pic.twitter.com/mhAMKed07p</a></p>&mdash; やま (@yamad365) <a href="https://twitter.com/yamad365/status/1115483920995213312?ref_src=twsrc%5Etfw">April 9, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
Surface で、.Camera=2 を設定するとオモシロいコトになります。

#まとめ
- カメラコントロール[.Photo]は他コントロールから更新できない 
- カメラが3つ以上の場合、0と1だけでは撮影方向を切り替えられない
    - Pixcel 3 はカメラが3つ（インｘ２、背面ｘ１）
    - 利用デバイスでの実機テスト重要！！

ハマったポイント２に関しては動作対象デバイスから除外すればよいので、業務では対策を割愛しました。どうしても使いたければインカメラ(ディスプレイ側)で頑張ってもらうことにしてあります。

ハマったポイント１のような「撮影ボタン」の実現方法~~は次回記載予定です。
TwitterのTLを追っかけてる方は答えをご存知かと思います。次回まで待てない方は、Twitterを検索してみましょう。~~
[解決編？を書きました。よろしければご確認ください。](https://qiita.com/yamad365/items/01b6dd19d1988718e3b0)

それでは、皆さま。素晴らしい Power Platform Life を！