LoginSignup
4
0

More than 3 years have passed since last update.

#PowerApps ペン入力コントロールのEmptyを判定する

Last updated at Posted at 2019-07-29

はじめに

入力フォームなどをPowerAppsで作成し、「すべて入力されたら次に遷移」みたいな動作って、PowerAppsに限らずよくありますよね。
PowerAppsで実現する場合には、各種コントロールに関して IsBlankや、IsEmptyを使って、入力があるか(空でないか)を判定することができます。
しかし、例えば署名をペン入力コントロールで行う場合、残念ながらペン入力にはIsEmpty、IsBlankは有効ではありません。(空なのにIsEmpty, IsBlankがfalseになる)
また、単純にPenInput.Imageを変数に入れて比較しただけだと、画像のパスがコントロールを触るたびに変化するので、よろしくありません。

Screen Shot 2019-07-30 at 12.11.17 AM.png
今回はこのような場合に、どうやってペン入力の"空"を判定するかを紹介します。

セットアップ

状況を簡単化して、画面にペン入力コントロールを1つ、タイマーを1つ、判定結果を表示するラベルを1つ設置します。
タイマーは、ペン入力コントロールの入力された結果の画像を監視するような役割で、10msおきに画像をある変数に格納しています。

Screen Shot 2019-07-30 at 12.17.21 AM.png

いざ判定

方法は単純です。ScreenのOnVisibleプロパティに以下の数式をセットします。

Screen2.OnVisible
Reset(PenInput3);
Set(defaultImage, JSON(PenInput3.Image, IncludeBinaryData) );

Resetはペン入力コントロールの初期化を行なっています。その後、ペン入力コントロールの画像PenInput3.ImageをJSON関数を用いてdata uriに変換して変数に格納しています。
※ここがポイント!data uriにすると、空の画像に対して一意性を持たせることができます。
※JSON関数の利用については 前の記事を参考にしてください。

ペン入力された画像の検出ですが、これにはタイマーのOnTimerEndに以下の数式を設定しています。なお、タイマーは間隔を10ms、リピート有効、自動スタートにしています。

Timer1.OnTimerEnd
Set(currentImage, JSON(PenInput3.Image, IncludeBinaryData) );

初回表示時と同様に、一定間隔で別の変数(ここではcurrentImage)にペン入力の画像のdata uriを格納しています。
あとはこれらの二つを比較することで、入力が空かどうかを判定できます。

この方法は、例えば入力をXボタンでリセットした場合や、消しゴムで全部綺麗に消した場合にも有効です。
詳細は以下のTweetをご覧ください。

4
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
4
0