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?

モダンコントロールのNumberInputの値が確定されていない

Last updated at Posted at 2025-09-17

セカンドファクトリーの鈴木です。

元々UX/UIデザイナーとして活動してきましたが、今年の春よりPower Appsのアプリ開発も行っています。詳しい経緯は今回横において、知りたい方はこちら

今回、上限・下限を設定し、ボタンを押すとその値が反映されるような機能を作っていて、引っかかったことがあったのでまとめ。

数値を入力させる場合

Power Appsで数値を入力させる場合には、色々方法はありますが、「数値」を前提とした入力のできるコントロールを使うのが楽そうです。通常のTextInputのOnChangeでゴニョゴニョする場合もありそうですが、選択肢としては以下の2つ。

クラシックコントロールの場合

TextInputのプロパティで「数値」を選ぶことで、数値のみを受け付けることができます。

モダンコントロールの場合

数値入力に特化したNumberInputを利用して、さらにステップ値プロパティで「0」を指定すると、ステッパー表示が非表示になり、数値を入力する形のコントロールに設定できます。

入力した数値を取得して処理する

Frame 1.png

よくありそうなフォーム処理で、ボタンを押すと2つの入力値を収集して何か処理するみたいなパターンです。
通常一連の動作は立て続けに起きます。

Frame 2.png

クラシックコントロールでは特に問題ありません。

Frame 3.png

モダンコントロールでの値取得

モダンコントロールのNumberInputだと、ボタンを押す直前にフォーカスしていた値が取れていません。
もし、この後値をそのまま処理したりすると、データが欠落してしまいます。

Frame 4.png

うまくいく場合

ボタンを押す前に、コントロールエリア外をクリックして、明示的にFocusOutさせると、値が取得できます。

Frame 5.png

普通に使いづらい

本来は、入力、入力、ボタン押下→反映!とリズムよく行きたいところが、
値がきちんと参照できなくて、表示に反映できないとバグになってしまいます。

そもそも、「一度欄外をクリックしないといけない」などがあると、ユーザーとして非常に使いづらいですし、何より値が取れないリスクは抱えないほうが良さそうだと考えています。

改善するとしたら

一旦NumberInputの採用を見送ってクラシックコントロールを使うが1つ。

もし、このまま対策するとしたら、ボタンを押した際に一度明示的にフォーカスアウトさせて、値を明示的に確定させるかなと。

Select(NumberInput_1);

// ↓以降ボタン押下時の処理

※社内のエンジニアメンバーから指摘もらいましたが、フォーカスアウトしてからも確定までに僅かな時間差があるようで、だとすると完全ではないのかも。

現状のまとめ

どうやら、モダンコントロールのNumberInputでは、値の確定タイミングが入力時即時でもなく、ディレイして反映しているわけでもないようです。

少し調べてみましたが、このNumberInputの値の挙動については、勝手にリセットされたり、まだ不安定だという情報もちらほら見かけました。

この後バージョンアップで改善されるかもしれませんが、今のところは様子見でしょうか。

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?