9
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?

新規作成と編集の切り替えがスムーズにできる画面の作り方

9
Last updated at Posted at 2025-11-21

ごきげんよう、百合宮桜(Miyu)です(*'▽')
初めて Power Apps でアプリを作る!というヒトに

入力フォームって新規作成と編集で分けて作るべきですか??

というご質問をよく頂きます。
今回はそれに対するアンサーを書いていこうと思います。

入力フォームは1つにまとめる

結論として入力フォームは1つにまとめてください。新規作成と編集で分けるのは NG です。
理由は2点あります。

  • メンテナンス性が悪い
  • アプリユーザーの作業効率が落ちる

1つずつ説明していきます。

メンテナンス性が悪い

新規作成と編集というモードによってフォームを分けるということはアプリ開発者のメンテナンス工数もフォームを分けた分だけかかるということです。
例えば入力項目を1つ増やした時に新規作成と編集でフォームが分かれていると、修正も2回行う必要があります。

image.png

image.png
image.png

フォームに1項目追加するという修正にかかる時間が5分だとしたら、5分×2回で10分かかることになります。これでは管理工数があがってしまい、本来の業務に注力する時間が少なくなってしまう可能性があるので避けるべきです。

アプリユーザーの作業効率が落ちる

新規作成用の入力フォーム画面と編集用の入力フォーム画面を分けた場合、アプリユーザーはどちらの業務を行うかを決めてからアプリを操作しなくてはなりません。

image.png

「本当は新規作成をしたかったけど、編集の画面に来ちゃった」という誤操作があった場合は本来やりたいコトの画面に移動する必要があります。これだとクリック数が多くて面倒に感じてしまうため、本末転倒です。

理想的な入力フォーム

1つの画面で新規作成と編集のモードを切り替えられるのが理想的です。
新規作成モードの場合は

  • 左側のギャラリーで何も選択されていない
  • 右側の入力フォームがすべて空白になっている
  • 右下のボタンが 登録 ボタンとなっている
  • 画面上部の Delete ボタンが無効化されている

image.png

編集モードの場合は

  • 左側のギャラリーで入力フォームに表示したデータが選択されている
  • 右側の入力フォームにギャラリーで選択したデータが表示されている
  • 右下のボタンが 更新 ボタンとなっている
  • 画面上部の Delete ボタンが有効化されている

image.png

まとめ

いかがでしたか? このような形で1つの画面でモードによって表現を少し変えてあげるとぐっと使いやすいアプリになります。
実はこの画面はすべてモダンコントロールで作っていて、特に画面上部の New や Delete のボタンはツールバーという新しくて便利なコントロールです。このツールバーの具体的な使い方もまた別の記事で取り上げたいと思います。それではごきげんよう(*'▽')

9
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
9
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?