キャンバス アプリのラベル コントロール

テキスト、数値、日付、または通貨などのデータを表示するボックスです。

内容

ラベルには、入力した内容がそのまま表示されるリテラル文字列として、またはテキスト文字列に評価される数式として指定したデータが表示されます。 ラベルは通常、他のコントロール (画面を識別するためのバナーなど) の外側に、別のコントロール (評価コントロール、オーディオ コントロールなど) を識別するラベルとして、またはギャラリー内の項目に関する特定の種類の情報を示すために表示されます。

主要なプロパティ

AutoHeight – ラベルにすべてのテキストが表示されるように高さを自動的に調整する場合は true に設定します。 割り当てた高さでテキストを一部削除する場合は false に設定します。

– コントロールのテキストの色。

フォント – テキストを表示するフォントのファミリーの名前。

テキスト – コントロールに表示されるテキスト、またはユーザーがコントロールに入力するテキスト。

DelayOutput – テキスト入力時に操作を遅延させる場合は true に設定します。

追加のプロパティ

配置 – コントロールの水平方向の中心に対するテキストの位置。

AutoHeightText プロパティの内容がコントロールで一度に表示できる文字数を超えている場合に、自動的に Height プロパティを大きくするかどうかを指定します。

BorderColor – コントロールの境界線の色。

BorderStyle – コントロールの境界線が 実線破線点線 、または なし かどうか。

BorderThickness – コントロールの境界線の太さ。

DisplayMode – コントロールがユーザー入力を許可するか ( 編集 )、データのみを表示するか ( 表示 )、または無効にするか ( 無効 ) どうか。

DisabledBorderColor – コントロールの DisplayMode プロパティが 無効 に設定されている場合のコントロールの境界線の色。

DisabledColor – コントロールの DisplayMode プロパティが 無効 に設定されている場合のコントロール内のテキストの色。

DisabledFill – コントロールの DisplayMode プロパティが 無効 に設定されている場合のコントロールの背景色。

塗りつぶし – コントロールの背景色。

FocusedBorderColor – コントロールがフォーカスされているときのコントロールの境界線の色。

FocusedBorderThickness – コントロールがフォーカスされているときのコントロールの境界線の太さ。

FontWeight – コントロール内のテキストの太さ: 太字中太標準 、または 細字

高さ – コントロールの上端と下端間の距離。

HoverBorderColor – ユーザーがコントロール上にマウス ポインターを重ねているときのコントロールの境界線の色。

HoverColor – ユーザーがコントロールにマウス ポインターを重ねているときのコントロール内のテキストの色。

HoverFill – ユーザーがコントロールにマウス ポインターを重ねているときのコントロールの背景色。

斜体 – コントロール内のテキストを斜体にするかどうか。

LineHeight – たとえば、テキストの行間またはリスト内の項目間などの距離です。

Live – スクリーン リーダーがラベルの テキスト プロパティの値の変更を知らせる方法。

  • オフ に設定した場合、スクリーン リーダーは変更を知らせません。
  • Polite に設定した場合、スクリーン リーダーは、スクリーン リーダーが話している間に生じた変更を知らせる前に話し終えます。
  • Assertive に設定した場合、スクリーン リーダーは、スクリーン リーダーが話している間に生じた変更すべてを知らせるために中断します。

OnSelect – ユーザーがコントロールをタップまたはクリックする場合のアプリの反応方法。

Overflow – ラベルの Wrap プロパティが true に設定され、 テキスト プロパティの値がコントロールで一度に表示できる文字数を超えている場合に、ラベルにスクロール バーを表示するかどうかを指定します。

PaddingBottom – コントロール内のテキストとそのコントロールの下端間の距離。

PaddingLeft – コントロール内のテキストとそのコントロールの左端間の距離。

PaddingRight – コントロール内のテキストとそのコントロールの右端間の距離。

PaddingTop – コントロール内のテキストとそのコントロールの上端間の距離。

PressedBorderColor – ユーザーがコントロールをタップまたはクリックしたときのコントロールの境界線の色。

PressedColor – ユーザーがコントロールをタップまたはクリックしたときのコントロール内のテキストの色。

PressedFill – ユーザーがコントロールをタップまたはクリックしたときのコントロールの背景色。

Role - 見出し 1 など、ラベル テキストのセマンティック ロール。 ラベルのスタイルは変更しませんが、出力をスクリーン リーダーの解釈のために意味的に修整します。

サイズ – コントロールに表示されるテキストのフォント サイズ。

Strikethrough – コントロールに表示されるテキストに取り消し線を付けるかどうか。

TabIndex – 他のコントロールに関連するキーボード ナビゲーションの順序。

ツールヒント – ユーザーがコントロールにカーソルを置くときに表示される説明テキスト。

下線 – コントロールに表示されるテキストの下に線を引くかどうか。

VerticalAlign – コントロールの垂直方向の中心に対するコントロール上でのテキストの位置。

表示 – コントロールが表示されるか非表示になるか。

– コントロールの左端と右端間の距離。

Wrap – 長すぎてラベルに収まらないテキストを次の行に折り返すかどうかを指定します。

X – コントロールの左端とその親コンテナー (親コンテナーがない場合は画面) の左端間の距離。

Y – コントロールの上端とその親コンテナー (親コンテナーがない場合は画面) の上端間の距離。

Text ( Number , " FormatCodes " )

リテラル文字列を表示する

数式の結果を表示する

  • ラベルを追加し、その テキスト プロパティを次のような数式に設定します。
    Today()

    注意

    数式を指定する場合、その数式の引数がリテラル文字列でない限り、引用符は使用しないでください。 この場合、数式ではなく、引数を二重引用符で囲みます。

    Today 関数または その他の関数 については各関連記事を参照してください。

この手順では、 CityPopulations というコレクションを作成し、ヨーロッパのさまざまな都市の人口に関するデータを格納します。 次に、そのデータを 3 つのラベルを含むギャラリーに表示し、各ラベルに表示するデータの種類を指定します。

  1. ボタンを追加し、 OnSelect プロパティを次の数式に設定します。
    ClearCollect(CityPopulations, {City:"London", Country:"United Kingdom", Population:8615000}, {City:"Berlin", Country:"Germany", Population:3562000}, {City:"Madrid", Country:"Spain", Population:3165000}, {City:"Rome", Country:"Italy", Population:2874000}, {City:"Paris", Country:"France", Population:2273000}, {City:"Hamburg", Country:"Germany", Population:1760000}, {City:"Barcelona", Country:"Spain", Population:1602000}, {City:"Munich", Country:"Germany", Population:1494000}, {City:"Milan", Country:"Italy", Population:1344000})

  2. F5 キーを押し、ボタンを選択して Esc キーを押します。

  3. テキスト ギャラリーを追加し、その Items プロパティを CityPopulations に設定します。

    ギャラリーを選択すると、右側のウィンドウにそのギャラリー用のオプションが表示されます。

  4. Gallery1 ウィンドウで、上部の一覧を Population に、中央の一覧を City に、下部の一覧を Country にそれぞれ設定します。

アクセシビリティ ガイドライン

名前とは異なり、 ラベル コントロールを別のコントロールのラベルとして使用する必要はありません。 任意のテキストを表示するために使用できます。

ラベル は、 OnSelect 動作を指定することにより、ボタンまたはリンクとして使用できます。 この方法で使用する場合、ボタンと同様にアクセシビリティの考慮事項があります。

色のコントラスト

次の間には適切な色のコントラストが必要です:

スクリーン リーダーのサポート

  • テキスト を指定する必要があります。

  • スクリーン リーダーが テキスト プロパティの値への変更を知らせる必要がある場合、 LivePolite または Assertive に設定する必要があります。

    注意

    TabIndex が 0 以上の場合、スクリーン リーダーは ラベル をボタンとして扱います。

弱視のサポート

  • ラベル をリンクとして使用する場合、リンクのように見えるようにします。

キーボードのサポート

  • テキストをボタンまたはリンクとして使用する場合は、 TabIndex を 0 以上にする必要があります。 こうすることで、キーボード ユーザーがそこに移動できるようになります。
  • テキストをボタンまたはリンクとして使用する場合は、フォーカス インジケーターを明確に表示する必要があります。 これを実現するには FocusedBorderColor および FocusedBorderThickness を使用します。