次の方法で共有


Power Apps でのイメージ コントロール

ローカル ファイルやデータ ソースなどのイメージを示すコントロール。

Description

アプリに 1 つ以上の イメージ コントロールを追加する場合は、データ セットに含まれていない個々の画像を表示したり、データ ソースのレコードから画像を組み込んだりできます。

重要なプロパティ

Image – イメージ、オーディオ、またはマイク コントロールに表示されるイメージの名前または URL。

  • 最新のブラウザーとの互換性を確保するために、すべての外部イメージに HTTPS を使用します。
  • 外部イメージには匿名でアクセスできる必要があります (認証は必要ありません)。

追加のプロパティ

AccessibleLabel – スクリーン リーダーのラベル。

ApplyEXIFOrientation – 画像に埋め込まれた EXIF データで指定された向きを自動的に適用するかどうかを指定します。

AutoDisableOnSelect – OnSelect 動作の実行中にコントロールを自動的に無効にします。

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

BorderStyle – コントロールの境界線が SolidDashedDoted、None のいずれであるか。

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

CalculateOriginalDimensionsOriginalHeight プロパティと OriginalWidth プロパティを有効にします。

DisplayMode – コントロールでユーザー入力 (編集) を許可するか、データのみを表示するか (表示)、無効 (無効) にするかを指定します。

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

DisabledFillDisplayMode プロパティが Disabled に設定されている場合のコントロールの背景色。

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

FlipHorizontal – 画像を表示する前に水平方向に反転するかどうかを指定します。

FlipVertical – 画像を表示する前に垂直方向に反転するかどうかを指定します。

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

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

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

HoverBorderColor – ユーザーがそのコントロールにマウス ポインターを置いたままにしたときのコントロールの境界線の色。

HoverFill – ユーザーがマウス ポインターをその上に置いたままにしたときのコントロールの背景色。

ImagePosition – 画面内のイメージの位置 (FillFitStretchTile、または Center) またはコントロールが画像と同じサイズでない場合。

ImageRotation – 画像を表示する前に回転させる方法。 値には、なし、時計回り (CW) 90 度、反時計回り (CCW) 90 度、時計回り 180 度を指定できます。

OnSelect – ユーザーがコントロールをタップまたはクリックしたときに実行するアクション。

OriginalHeightCalculateOriginalDimensions プロパティで有効になっているイメージの元の高さ。

OriginalWidthCalculateOriginalDimensions プロパティで有効になっているイメージの元の幅。

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

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

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

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

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

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

RadiusBottomLeft – コントロールの左下隅を丸める角度。

RadiusBottomRight – コントロールの右下隅を丸める角度。

RadiusTopLeft – コントロールの左上隅を丸める角度。

RadiusTopRight – コントロールの右上隅を丸める角度。

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

ヒント – ユーザーがコントロールの上にマウス ポインターを置いたときに表示される説明テキスト。

透明度 – 画像の背後にあるコントロールが表示されたままになる度合い。 10 進値の範囲は 0 から 1 です。 0 が不透明な場合、0.5 は半透明で、1 は透明です。

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

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

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

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

Remove( DataSource, ThisItem )

例示

ローカル ファイルからの画像を表示する

  1. [ ファイル ] メニューの [ メディア] をクリックまたはタップし、[ 参照] をクリックまたはタップします。

  2. 追加する画像ファイルをクリックまたはタップし、[ 開く] をクリックまたはタップし、Esc キーを押して既定のワークスペースに戻ります。

  3. Image コントロールを追加し、その Image プロパティを追加したファイルの名前に設定します。

    コントロールを追加して構成する方法がわからない場合

    Image コントロールには、指定したイメージが表示されます。

データ ソースからの画像のセットを表示する

  1. この Excel ファイルをダウンロードし、ローカル デバイスに保存します。

  2. Power Apps Studio でアプリを作成または開き、右側のウィンドウで [ データ ソースの追加 ] をクリックまたはタップします。

    [ データ ソースの追加] が右側のウィンドウに表示されない場合は、左側のナビゲーション バーの画面をクリックまたはタップします。

  3. [ アプリに静的データを追加する] をクリックまたはタップし、ダウンロードした Excel ファイルをクリックまたはタップして、[ 開く] をクリックまたはタップします。

  4. [ 床材の見積もり ]チェック ボックスをオンにし、[ 接続]をクリックまたはタップします。

  5. イメージを含む ギャラリー コントロールを追加し、その Items プロパティを FlooringEstimates に設定します。

    コントロールを追加して構成する方法がわからない場合

    ギャラリー コントロールには、ダウンロードした Excel ファイル内のリンクに基づいて、カーペット、ハードウッド、タイル製品の画像が表示されます。

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

色のコントラスト

  • グラフィックがボタンとして使用されている場合は、標準のカラー コントラスト要件が適用されます。
  • 純粋に装飾的でない場合は、画像内のコントラストの問題を確認することを検討してください。

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

  • 重要なグラフィックスには AccessibleLabel を設定する必要があります。

  • グラフィックが装飾用の場合、または冗長な情報を提供する場合は、 AccessibleLabel を空のままにするか、空の文字列 "" に設定します。 スクリーン リーダーはこれらのグラフィックスを無視します。

たとえば、このフォームを変更できないというラベルの横に南京錠の画像を配置できます。 ラベルは既にその意味を説明しているため、イメージに AccessibleLabel は必要ありません。

Important

TabIndex が 0 以上の場合、イメージはボタンになります。 外観は変わりませんが、スクリーン リーダーはそれをボタンとして扱います。 AccessibleLabel が空の場合でも、コントロールは無視されません。

キーボードのサポート

  • グラフィックをボタンとして使用する場合、TabIndex は 0 以上にする必要があります。 その後、キーボード ユーザーはそれに移動できます。

  • グラフィックがボタンとして使用されている場合は、フォーカス インジケーターを明確に表示する必要があります。 この結果を得るには、 FocusedBorderColorFocusedBorderThickness を使用します。