Power Apps 環境: アプリ要素を適切にセットアップする

このチュートリアルでは、Power Apps 環境を適切にレイアウトする方法を説明します。

Power Appsを使用する最大の利点の 1 つは、すべてをどのようにレイアウトするかを決定できるカスタマイズ オプションの多さです。ここでの目標は、Power Apps 環境のあらゆる部分に詳しくなり、アプリを最大限に活用できるようにすることです。

Power Apps 開発環境は次のようになります。

各部分がどのように機能するかを詳しく説明し、デモンストレーションする別のチュートリアルを作成します。しかし今のところ、これらのさまざまな部分が何を行うのか、そしてそれらが何を担当するのかに焦点を当てたいと思います。

目次

• Power Apps 環境の中央ペイン
• 画面、要素、およびサブ要素
• Power Apps 環境で使用されるリボン
• アプリ要素のプロパティの変更
• 結論

Power Apps 環境の中央ペイン

真ん中のエリアから始めましょう。ここで、構築しているアプリを確認できます。

下部にはズーム スライダーがあり、これを使用してビューを変更したり、アプリをズームインまたはズームアウトしたりできます。

ズーム スライダーのすぐ横にある両方向矢印を使用すると、ウィンドウ全体に収まるようにアプリ画面を拡大できます。

画面、要素、およびサブ要素

左側のペインには、作業中のアプリ内のさまざまな画面が表示されます。現時点では最もよく使われる「ツリービュー」で配置しています。各画面がどのように小さな要素に分岐するかを示します。

したがって、左側のリストの一部を折りたたむと、現在作業しているアプリに BrowseScreen1、DetailScreen1、EditScreen1 という 3 つの画面があることがわかります。

左側のペインの最初の画面をクリックすると、アプリの参照画面が表示されます。この画面には、データ テーブルからのエントリのリストが表示されているだけです。

2 つ目は詳細画面用です。これは、ブラウズ画面のリストの各エントリの詳細を示しています。

最後の画面は編集画面で、特定のレコードを編集したり、新しいレコードを作成したりできます。

これら 3 つの画面では不十分な場合は、新しい画面を追加することができます。後で詳しく説明します。

ブラウズ画面に戻りましょう。ドロップダウンをクリックすると、ブラウズ画面に存在するすべての要素のリストが表示されます。

ここの最初の要素はギャラリーを表示します。これは基本的に単なるレコードのリストです。中央のペインでアプリを見ると、スクロール可能なレコードのリストをギャラリーがカバーしていることがわかります。

ここには Rectangle11 というタグが付いたオブジェクトがあります。これは、検索バーとギャラリーの間にある単純な長方形です。

虫眼鏡の画像だけの検索アイコンもあります。

アイテムを検索するときにテキスト ボックスにテキストを入力できます。

その下にはさらに多くのものがあり、構築しているアプリの各部分を表す要素の長いリストが含まれています。Microsoft は通常、直観的に使用できるようにツールを構築しているため、各要素はその内容や機能を示す記号で表されています。

たとえば、ギャラリーは長方形とは異なります。ギャラリーはレコードのリストであるため、さまざまなウィンドウを表示するアイコンで表されます。長方形は形状であるため、それを表すアイコンは形状のコレクションを示します。テキスト ボックスではテキストを書き込むことができるため、アイコンにはペンが表示されます。

要素にはサブ要素を含めることもできます。たとえば、BrowseGallery1 には、その下に他の要素がリストされています。ギャラリーではアプリ内でさまざまな処理が行われていることを考えると、これは当然のことです。

たとえば、ギャラリーには Title1 という要素があり、これはギャラリー レコードの先頭にある名前です。

Title1 の他に、ギャラリー レコードにはサブタイトルと本文、さらに次の矢印とレコード間に入る区切り文字もあります。これらはすべて、左側のペインのサブ要素で表されます。

さらに左に進むと、3 本の線をクリックして新しいオプションのセットにアクセスできます。

ご覧のとおり、メニューの最初のエントリは、これまで見てきたツリー ビューです。他の要素を挿入することもできます。

プロジェクトで使用されるデータ ソースも表示されます。この場合、現在のアプリに統合されているデータ ソースは 1 つだけです。これは OneDrive からのものです。

データ ソースでさまざまなエンティティとコネクタを統合することもできますが、これはより高度なトピックであり、他のチュートリアルで説明します。

メニューには、アプリで使用されるメディアも表示されます。ここで画像、ビデオ、オーディオ ファイルをアップロードできます。

そのメニューを折りたたむには、3 本の線をもう一度クリックします。

Power Apps 環境で使用されるリボン

他の Microsoft プログラムと同様に、上部は通常リボンで構成されます。これらのリボンでは、さまざまなメニューに分類されたさまざまなアクションが提供されます。

ホームリボンから始めましょう。

ホーム リボンで使用できるアクションの 1 つは、新しい画面の作成です。Powerpoint と同様に、テンプレートが用意されています。これらのテンプレートが作成中のアプリに適用できないと思われる場合は、空白の画面から開始できます。

新しい画面のテンプレートを選択すると、ツリー ビューの下部にテンプレートが追加されます。

最近のチュートリアルで説明したテーマもあります。

アプリ上のテキストを選択して、フォント、フォント サイズ、フォントの色を変更したり、太字、斜体、または下線を引いたりすることもできます。

テキストの配置方法を選択することもできます。左揃え、右揃え、または中央揃えにすることができます。

挿入リボンを使用すると、Power Apps 環境に何かを追加または挿入できます。

たとえば、ラベル要素を挿入したい場合は、「ラベル」というボタンをクリックするだけで、その要素が挿入されます。

ボタンを挿入することもできます。

ここで使用できるさまざまなタイプのテキスト ボックスがあります。[テキスト] の下のドロップダウンをクリックするだけで、テキスト入力、HTML テキスト、ペン入力などを挿入できるようになります。

コンボ ボックス、日付ピッカー、リスト、ボックス、チェック ボックス、スライダーなど、さまざまな種類の入力もあります。

さまざまなタイプのギャラリーを選択できます。現在、アプリに垂直ギャラリーを使用しています。ただし、水平方向のギャラリーを作成したり、画面上に画像を挿入したりすることもできます。

[挿入] リボンを使用すると、データ テーブルを追加することもできます。これについては、別のチュートリアルで詳しく説明します。

ここにフォームを挿入することもできます。私たちが作成しているアプリの編集画面を覚えていると思いますが、この画面には、ユーザーがアプリにデータを手動で追加できるフォームが用意されています。したがって、「挿入」リボンの下にある「フォーム」をクリックするだけで、画面の下に別のフォームを追加できます。

メディアとしては、画像、バーコード スキャナー、ビデオ、オーディオを挿入できます。ここで、ユーザーのカメラ、マイク、その他の機能をアクティブにする機能をアプリに与えることもできます。

[挿入] リボンを使用して追加できるその他の項目には、グラフ、アイコン、カスタム オブジェクトがあります。

[表示] リボンに移動しましょう。これにより、変数、データ ソース、および Power Apps 環境に関連するその他のものを表示できます。

最後に、アクション リボンを使用すると、さまざまな自動化を行うことができます。これはトピックのより高度な部分であるため、別のチュートリアルで説明します。

アプリ要素のプロパティの変更

最後に説明したいのは、画面の右側で、[プロパティ] ペインが表示されていることです。

アプリで使用される各要素には、対応するプロパティがあります。Table1 というアプリの見出しを変更したいとします。LblAppName1 の左側のペインで特定の要素をクリックするか、アプリ上の要素自体をクリックして強調表示することができます。

要素が強調表示されると、その項目のプロパティが右側に自動的に表示されます。

各要素には異なるプロパティのセットがあります。LblAppName1 を見ると、要素名の上に記載されているように、ラベルとして分類されます。これには、アプリに表示されるテキストを変更できる text プロパティがあります。このスペースでテキストを直接編集することもできます。

フォントサイズ、フォントの太さ、フォントスタイルなどを選択できます。

要素のタイプが異なれば、プロパティのセットも異なります。ここでアプリの更新アイコンを見てみましょう。Tree ビューを見ると、これは IconRefresh1 という要素です。

プロパティ ペインを見ると、アイコンとして分類されていることがわかります。また、使用されるアイコン、回転、表示モードなどのさまざまなプロパティのセットもあります。

Microsoft Power Appsの優れた点は、これらのプロパティを実際に 2 つの方法で編集できることです。これらは静的に設定することも、動的に設定することもできます。

Table1 要素に戻って Text プロパティに移動すると、それを直接編集して Hello World などに変更できます。これにより、アプリ上の実際のラベルに表示される内容が自動的に変更されます。

私がやったことは、プロパティを静的に変更することでした。

上部の数式バーを見ると、左側のドロップダウン メニューからさまざまなプロパティを選択できることがわかります。

したがって、text プロパティを選択して「Hello World」と入力すると、同じことが行われます。

ここで動的に変更できます。動的な変更を作成する方法はたくさんありますが、ここではIF関数を使用した簡単な例を紹介します。

数式バーに、「IF(1=1), "Hello World", "Table 1") と入力します。これは基本的に、ステートメントが true の場合、ラベルにHello Worldが表示されることを意味します。そうでない場合は、 Table1を表示させます。

これは動的に設定されるため、この条件を false にすることもできます。したがって、これを変更して 1=0 と書き込むと、ラベルが自動的に Table1 に変更されます。

プロパティを動的にするということは、ユーザーが特定のパラメーターに基づいてこれらのプロパティを変更できることを意味します。たとえば、ユーザーが自分でタイトルを編集できるようにし、その変更を変数に保存することができます。次に、この式はその変数を呼び出して、このテキストのタイトルを設定します。

他の項目も変更できます。たとえば、ギャラリーで Andy Chapman の一番上のエントリをクリックすると、先に進み、このエントリの高さがどのように測定されるかを確認できます。

このギャラリーの高さは、親の高さから実際のギャラリーの Y 位置を引いた値に動的に設定されていることがわかります。これは、このエントリのサイズが、アプリケーションの上から下までの高さから実際の要素自体の Y 座標を引いたものに等しいことを意味します。したがって、上から下までの高さが 100 で、Y 点が 10 にある場合、高さは動的に 90 に設定されます。

プロパティに移動して手動でサイズを変更するだけなので、この概念は重要です。

ただし、アプリによってサイズは異なります。要素が異なれば、座標も異なります。静的な高さを設定すると、何かを変更した瞬間にアプリ全体が台無しになってしまいます。

Power Apps: この革新的なツールの使用を開始する
Power Apps アカウントを作成する方法 | LuckyTemplates チュートリアル
Power Apps の概要: 定義、特徴、機能、重要性

結論

Power Apps 環境ですべてがどのように配置されているかを見ると、このツールが実際にいかに直観的でユーザー フレンドリーであるかがさらにわかります。各要素と画面の表示方法から、各要素のすべてのプロパティの変更の容易さまで、これらの Power Apps 環境により、誰もが独自のアプリを作成し、独自のプロセスをより効率的にできるようになります。

もちろん、Power Apps は、自分の分野でアプリがいかに役立つかを発見し始めたばかりの初心者だけを対象としたものではありません。上級者向けの先進的な機能も多数搭載しています。これらについては他のチュートリアルで説明します。

ではごきげんよう、

ヘンリー