はじめに
こんにちは!
このシリーズでは、Power Appsで使用するコントロールを1つずつ取り上げ、基本的な使い方から各プロパティまで詳しく解説していきます。
クラシックコントロールとモダンコントロールの両方を扱い、
- どんなコントロールなのか
- どんな場面で使うのか
- どんなプロパティがあるのか
- クラシックとモダンで何が違うのか
- 実務ではどのように使えるのか
まで、実際の設定例やPower Fxを交えながら紹介します。
「このプロパティ、何に使うんだっけ?」
そんなときにも振り返れる、Power Appsのコントロール辞典のようなシリーズを目指していきます。
それでは、今回のコントロールを見ていきましょう!
🏷️ 今回のコントロール:テキストラベル
今回取り上げるのは、ラベルコントロールです。
ラベルは、アプリ上に文字や値を表示するために使用する基本的なコントロールです。
例えば、
- 項目名
- ユーザー名
- 日付
- ステータス
- 件数
- 計算結果
- エラーメッセージ
- ユーザーへの案内
など、さまざまな情報の表示に使用できます。
一見すると「文字を表示するだけ」のシンプルなコントロールですが、Power Fxと組み合わせることで、アプリの状態に応じた動的な表示もできます。
例えば、ログインしているユーザー名を表示する場合は、
User().FullName
件数を表示する場合は、
"登録件数:" & CountRows(Gallery1.AllItems) & "件"
条件によって表示内容を変更することもできます。
If(
glbIsEdit,
"編集中",
"参照中"
)
このようにラベルは、アプリが持っている情報をユーザーに伝えるための重要なコントロールです。
💡 まずはこれだけ覚えよう
ラベルには多くのプロパティがあります。
最初からすべて覚える必要はありません。
まずは、次のプロパティを押さえておくとラベルの基本的な操作ができます。
| プロパティ | 役割 |
|---|---|
Text |
表示する文字や値を指定する |
Visible |
表示・非表示を制御する |
Color |
文字色を指定する |
Fill |
背景色を指定する |
Size |
文字サイズを指定する |
Width |
横幅を指定する |
Height |
高さを指定する |
💡 POINT
特に重要なのが
TextとVisibleです。「何を表示するか」と「いつ表示するか」。
この2つをPower Fxで制御できるようになると、ラベルの活用範囲が大きく広がります。
🎨 クラシックとモダン
Power Appsには、従来から存在するクラシックコントロールと、新しいデザインシステムを採用したモダンコントロールがあります。
文字を表示するコントロールについても、それぞれ用意されています。
| クラシック | モダン | |
|---|---|---|
| コントロール名 | Label | Text |
| 主な用途 | テキストの表示 | テキストの表示 |
| Power Fx | 使用可能 | 使用可能 |
| デザイン | プロパティを細かく設定 | テーマとの統合を重視 |
名前は異なりますが、基本的な役割はどちらも同じです。
ユーザーに文字や値を表示する
ここからは、クラシック → モダンの順番で、それぞれのプロパティを見ていきます。
🧱 クラシック:Label
基本的な使い方
Labelに表示する内容は、Textプロパティで指定します。
固定文字を表示する場合は、
"こんにちは!"
と設定します。
Power Fxを使って動的な値を表示することもできます。
"こんにちは、" & User().FullName & "さん"
例えば、次のように表示されます。
こんにちは、山田 太郎さん
「文字を書くためのコントロール」
というより、
「Power Fxの結果をユーザーに見せるためのコントロール」
と考えてみるとイメージしやすくなります。
User().FullName で取得される表示名は、Microsoft 365に登録されているユーザー情報に依存します。
そのため、環境やユーザーの設定によって表示内容が異なる場合があります。
📚 クラシック:プロパティ一覧
クラシックのLabelコントロールで使用できるプロパティを紹介します。
プロパティの掲載順は、Power Apps Studioの「詳細設定」に表示される順番に準拠しています。
また、それぞれのプロパティについて、一般的なアプリ開発でどの程度使用するかを5段階で表しています。
使用頻度の見方
| アイコン | 使用頻度 |
|---|---|
| 🤩 | 非常によく使う |
| 😊 | よく使う |
| 🙂 | 使用することがある |
| 😐 | 使用する機会は少ない |
| 😴 | 使用する機会はかなり限定的 |
使用頻度はMicrosoft公式による評価ではありません。
一般的なPower Appsのアプリ開発を想定した、本記事独自の目安です。
⚙️ アクション
| プロパティ | 内容 | 使用頻度 |
|---|---|---|
OnSelect |
コントロールがクリックされたときに実行する処理を指定する | 🙂 |
🗃️ データ
| プロパティ | 内容 | 使用頻度 |
|---|---|---|
ContentLanguage |
コントロールのコンテンツに使用する言語を指定する | 😴 |
Live |
内容が変更された際のスクリーンリーダーへの通知方法を指定する | 😴 |
Role |
テキストの役割を指定する | 😴 |
Text |
表示する文字や値を指定する | 🤩 |
Tooltip |
マウスポインターを合わせた際に表示する補足情報を指定する | 😊 |
🎨 デザイン
| プロパティ | 内容 | 使用頻度 |
|---|---|---|
Align |
テキストの水平方向の配置を指定する | 🙂 |
AutoHeight |
テキスト量に応じて高さを自動調整する | 🙂 |
BorderColor |
枠線の色を指定する | 🙂 |
BorderStyle |
枠線の種類を指定する | 🙂 |
BorderThickness |
枠線の太さを指定する | 😊 |
Color |
テキストの色を指定する | 🤩 |
DisabledBorderColor |
無効状態の枠線の色を指定する | 😴 |
DisabledColor |
無効状態のテキストの色を指定する | 😴 |
DisabledFill |
無効状態の背景色を指定する | 😴 |
DisplayMode |
コントロールの表示モードを指定する | 😐 |
Fill |
背景色を指定する | 😊 |
FocusedBorderColor |
フォーカス時の枠線の色を指定する | 😴 |
FocusedBorderThickness |
フォーカス時の枠線の太さを指定する | 😴 |
Font |
フォントを指定する | 😐 |
FontWeight |
テキストの太さを指定する | 🙂 |
Height |
コントロールの高さを指定する | 🤩 |
HoverBorderColor |
マウスオーバー時の枠線の色を指定する | 😴 |
HoverColor |
マウスオーバー時のテキストの色を指定する | 😴 |
HoverFill |
マウスオーバー時の背景色を指定する | 😴 |
Italic |
テキストを斜体にするか指定する | 😴 |
LineHeight |
テキストの行間を指定する | 😐 |
Overflow |
コントロールからはみ出した内容の表示方法を指定する | 😐 |
PaddingBottom |
下側の内側余白を指定する | 🙂 |
PaddingLeft |
左側の内側余白を指定する | 🙂 |
PaddingRight |
右側の内側余白を指定する | 🙂 |
PaddingTop |
上側の内側余白を指定する | 🙂 |
PressedBorderColor |
選択時の枠線の色を指定する | 😴 |
PressedColor |
選択時のテキストの色を指定する | 😴 |
PressedFill |
選択時の背景色を指定する | 😴 |
Size |
テキストのサイズを指定する | 🤩 |
Strikethrough |
テキストに取り消し線を付けるか指定する | 😴 |
TabIndex |
Tabキーによるフォーカス順序を指定する | 😐 |
Underline |
テキストに下線を付けるか指定する | 😴 |
VerticalAlign |
テキストの垂直方向の配置を指定する | 😐 |
Visible |
コントロールの表示・非表示を指定する | 🤩 |
Width |
コントロールの横幅を指定する | 🤩 |
Wrap |
テキストを折り返して表示するか指定する | 🙂 |
X |
コントロールの横方向の位置を指定する | 🤩 |
Y |
コントロールの縦方向の位置を指定する | 🤩 |
🔍 クラシック:主要プロパティを詳しく見てみよう
ここからは、クラシックのLabelコントロールの中でも、使用頻度が 🤩「非常によく使う」または 😊「よく使う」 プロパティに絞って詳しく見ていきます。
Text
Textは、Labelに表示する内容を指定するプロパティです。
ラベルを使用するうえで最も基本となるプロパティです。
基本例
"ユーザー情報"
動的な値を表示
User().FullName
文字列と値を組み合わせる
"ユーザー名:" & User().FullName
条件によって内容を変更する
If(
glbIsEdit,
"編集中",
"参照中"
)
💡 POINT
Textには固定文字だけでなく、関数・変数・データソースの値・計算結果など、さまざまなPower Fxを設定できます。
Tooltip
Tooltipは、マウスポインターをコントロールに合わせたときに表示する補足説明を指定するプロパティです。
画面上に常時表示する必要はないものの、ユーザーに補足情報を伝えたい場合に利用できます。
基本例
"ログインしているユーザーの名前を表示しています"
データソースの値をそのまま表示することもできます。
ThisItem.Title
BorderThickness
BorderThicknessは、Labelの枠線の太さを指定するプロパティです。
例えば、
1
と設定すると、太さ1の枠線が表示されます。
0
と設定すると、枠線は表示されません。
数値を大きくするほど枠線が太くなります。
Color
Colorは、文字の色を指定するプロパティです。
例えば赤色にする場合は、
Color.Red
と設定します。
条件によって文字色を変更することもできます。
If(
glbError,
Color.Red,
Color.Black
)
例えば、エラー時だけ文字を赤くするといった表現ができます。
💡 POINT
ColorにPower Fxを設定することで、アプリの状態に応じて文字色を動的に変更できます。
Fill
Fillは、コントロールの背景色を指定するプロパティです。
例えば、
Color.White
と設定すると、背景色を白色にできます。
透明にする場合は、
RGBA(0, 0, 0, 0)
と設定できます。
条件によって背景色を変更することもできます。
If(
glbError,
Color.LightPink,
Color.White
)
Colorと組み合わせることで、ステータスやエラーなどを視覚的に分かりやすく表現できます。
Height
Heightは、コントロールの高さを指定するプロパティです。
例えば、
40
と設定すると、高さを40にできます。
固定値だけでなく、他のコントロールを基準に設定することもできます。
Button1.Height
複数のコントロールで高さを揃えたい場合などにも利用できます。
Size
Sizeは、文字サイズを指定するプロパティです。
例えば、
16
と設定します。
タイトル・見出し・本文・補足説明など、用途に応じて文字サイズを変更します。
例えば、画面タイトルを大きく表示する場合は、
24
項目名などでは、
14
といったように使い分けることができます。
Visible
Visibleは、コントロールを表示するかどうかを制御するプロパティです。
trueの場合は表示され、
true
falseの場合は非表示になります。
false
条件による表示制御
例えば、グローバル変数を使う場合は、
glbShowMessage
と設定できます。
glbShowMessageがtrueの場合だけラベルが表示されます。
エラーメッセージが存在するときだけ表示する場合は、
!IsBlank(glbErrorMessage)
のような設定もできます。
💡 POINT
Visibleはラベルだけでなく、多くのコントロールで使用する重要なプロパティです。Power Appsでは、条件によってコントロールを表示・非表示にする場面が多いため、実務でも頻繁に使用します。
Width
Widthは、コントロールの横幅を指定するプロパティです。
例えば、
300
と設定すると、横幅を300にできます。
固定値だけでなく、親コントロールを基準にすることもできます。
Parent.Width
とすることで、親コントロールと同じ横幅にできます。
左右に20ずつ余白を設ける場合は、
Parent.Width - 40
のような計算も可能です。
X
Xは、コントロールの横方向の位置を指定するプロパティです。
例えば、
20
と設定すると、親要素の左端を基準として横方向の位置を指定できます。
固定値だけでなく、他のコントロールを基準にすることもできます。
LabelTitle.X + LabelTitle.Width + 10
この場合、LabelTitleの右側に10の間隔を空けて配置できます。
Y
Yは、コントロールの縦方向の位置を指定するプロパティです。
例えば、
100
と設定すると、親要素の上端を基準として縦方向の位置を指定できます。
固定値だけでなく、他のコントロールを基準にすることもできます。
LabelTitle.Y + LabelTitle.Height + 10
この場合、LabelTitleの下に10の間隔を空けて配置できます。
✨ モダン:Text
続いて、モダンコントロールです。

モダンコントロールでは、クラシックのLabelに相当する文字表示用コントロールとしてTextコントロールがあります。
基本的な役割は同じですが、モダンコントロールではテーマとの統合など、新しいデザインシステムを前提とした設計になっています。
📚 モダン:プロパティ一覧
モダンTextについても、用途ごとにプロパティを見ていきます。
⚙️ アクション
| プロパティ | 内容 | 使用頻度 |
|---|---|---|
OnSelect |
コントロールがクリックされたときに実行する処理を指定する | 🙂 |
🗃️ データ
| プロパティ | 内容 | 使用頻度 |
|---|---|---|
AccessibleLabel |
スクリーンリーダーなどの支援技術向けの説明を指定する | 😐 |
ContentLanguage |
コントロールのコンテンツに使用する言語を指定する | 😴 |
Text |
表示する文字や値を指定する | 🤩 |
🎨 デザイン
| プロパティ | 内容 | 使用頻度 |
|---|---|---|
Align |
テキストの水平方向の配置を指定する | 🙂 |
AutoHeight |
テキスト量に応じて高さを自動調整する | 🙂 |
BorderColor |
枠線の色を指定する | 🙂 |
BorderStyle |
枠線の種類を指定する | 🙂 |
BorderThickness |
枠線の太さを指定する | 😊 |
Color |
テキストの色を指定する | 🤩 |
DisplayMode |
コントロールの表示モードを指定する | 😐 |
Fill |
背景色を指定する | 😊 |
Font |
フォントを指定する | 😐 |
FontWeight |
テキストの太さを指定する | 🙂 |
Height |
コントロールの高さを指定する | 🤩 |
Italic |
テキストを斜体にするか指定する | 😴 |
PaddingBottom |
下側の内側余白を指定する | 🙂 |
PaddingLeft |
左側の内側余白を指定する | 🙂 |
PaddingRight |
右側の内側余白を指定する | 🙂 |
PaddingTop |
上側の内側余白を指定する | 🙂 |
RadiusBottomLeft |
左下の角丸の大きさを指定する | 🙂 |
RadiusBottomRight |
右下の角丸の大きさを指定する | 🙂 |
RadiusTopLeft |
左上の角丸の大きさを指定する | 🙂 |
RadiusTopRight |
右上の角丸の大きさを指定する | 🙂 |
Size |
テキストのサイズを指定する | 🤩 |
Strikethrough |
テキストに取り消し線を付けるか指定する | 😴 |
Underline |
テキストに下線を付けるか指定する | 😴 |
VerticalAlign |
テキストの垂直方向の配置を指定する | 😐 |
Visible |
コントロールの表示・非表示を指定する | 🤩 |
Width |
コントロールの横幅を指定する | 🤩 |
Wrap |
テキストを折り返して表示するか指定する | 🙂 |
X |
コントロールの横方向の位置を指定する | 🤩 |
Y |
コントロールの縦方向の位置を指定する | 🤩 |
モダンTextのDisplayModeについては、Microsoft Learnでは更新版のコントロールからプロパティパネルから削除され、後方互換性のために残っているものの効果はないとされています。
Power Appsのバージョンや環境によって、表示されるプロパティが異なる可能性があります。
🔍 モダン:主要プロパティを詳しく見てみよう
モダンのTextコントロールで使用頻度が 🤩「非常によく使う」または 😊「よく使う」 としたプロパティについては、基本的な使い方はクラシックのLabelコントロールと同様です。
そのため、ここでは個別の説明は省略します。
各プロパティの使い方については、前述の「クラシック:主要プロパティを詳しく見てみよう」を参照してください。
モダンとクラシックでは使用できるプロパティの種類に違いがありますが、今回取り上げた主要プロパティについては基本的な使い方は同様です。
⚖️ クラシックとモダンの違い
最後に、クラシックLabelとモダンTextを比較してみます。
| 項目 | クラシック Label | モダン Text |
|---|---|---|
| 基本用途 | テキスト表示 | テキスト表示 |
| Power Fx | ○ | ○ |
| 動的な表示 | ○ | ○ |
| 表示・非表示 | ○ | ○ |
| スタイル設定 | 個別に細かく指定しやすい | テーマとの統合を重視 |
| デザイン | 従来のPower Apps | モダンなデザイン |
どちらも「テキストを表示する」という基本的な役割は共通しています。
ただし、利用できるプロパティやデザインの考え方には違いがあります。
クラシックとモダンを混在させる場合は、それぞれの特徴を理解したうえで使用することが重要です。
🛠️ 実務で使えるラベル活用例
ここからは、実際のアプリで使いやすい設定をいくつか紹介します。
👤 ログインユーザーを表示
"ログインユーザー:" & User().FullName
ログインしているユーザーの名前を画面上に表示できます。
📅 今日の日付を表示
Text(
Today(),
"yyyy/mm/dd"
)
アプリを開いた日の日付を表示できます。
🔢 登録件数を表示
"登録件数:" & CountRows(Gallery1.AllItems) & "件"
ギャラリーに表示されているデータの件数をユーザーに伝えることができます。
🚨 エラーメッセージを表示
Text
glbErrorMessage
Visible
!IsBlank(glbErrorMessage)
Color
Color.Red
これで、glbErrorMessageに値が入っている場合だけ、赤文字でエラーメッセージを表示できます。
🔄 状態によって表示を変更
If(
glbIsEdit,
"✏️ 編集中",
"👀 参照中"
)
Power Appsでは、このようにコントロールのプロパティそのものにPower Fxを設定することで、アプリの状態に応じたUIを作ることができます。
⚠️ ラベルを使うときのポイント
ラベルは、ユーザーに文字や値などの情報を表示することを目的としたコントロールです。
ラベルにはOnSelectプロパティがあるため、クリックしたときに画面遷移や処理を実行することもできます。
例えば、
Navigate(Screen2)
と設定すれば、ラベルをクリックして別の画面へ遷移させることができます。
しかし、ラベルは見た目上「文字を表示するためのコントロール」であるため、ユーザーから見るとクリックできることが分かりにくい場合があります。
そのため、
- 画面遷移させたい
- 処理を実行させたい
- ユーザーにクリックしてもらいたい
といった用途では、基本的にButtonなど、クリックできることがUI上で分かりやすいコントロールを使用しましょう。
💡 POINT
OnSelectが設定できるからといって、必ずしもクリック操作に適したコントロールとは限りません。ラベルは基本的に**「ユーザーに情報を見せる」**ために使用し、クリック操作にはその役割がユーザーに伝わりやすいコントロールを使用することが大切です。
📝 まとめ
今回は、Power Appsのラベルコントロールについて解説しました。
ラベルはシンプルなコントロールですが、
- 固定文字の表示
- データの表示
- ユーザー情報の表示
- 計算結果の表示
- ステータスの表示
- エラーメッセージの表示
など、実際のアプリではさまざまな場面で使用します。
特に、
TextVisibleColorFillSizeWidthHeight
あたりは使用する機会が多いため、まず押さえておきたいプロパティです。
そしてラベルを使いこなすポイントは、
「文字を表示するコントロール」ではなく、「Power Fxの結果をユーザーに伝えるコントロール」と考えること。
Power Fxと組み合わせることで、シンプルなラベルでもさまざまな表現ができるようになります。
今後も、Power Appsで使用するコントロールを1つずつ取り上げ、「このプロパティ何だっけ?」というときに振り返れる記事としてまとめていきます。
最後まで読んでいただき、ありがとうございました!
この記事が、Power Apps開発者の皆様に少しでもお役に立てていれば幸いです。
