バージョン

向きと方向の構成 (XamLinearGauge)

トピックの概要

目的

このトピックは、垂直スケールと反転したスケール方向の両方またはいずれか一方により XamLinearGauge コントロールを構成する方法を説明します。

前提条件

本トピックの理解を深めるために、以下のトピックを参照することをお勧めします。

トピック 目的

このトピックでは、主要機能、最小要件、ユーザー機能など、 XamLinearGauge コントロールに関する概念的な情報を提供します。

このトピックでは、XamLinearGauge コントロールを Xamarin.Forms アプリケーションに追加する方法を説明します。

概要

スケールの向きと方向の構成の概要

XamLinearGauge コントロールは、スケールの垂直方向および水平方向をサポートしています。既定では、スケールは水平方向です。垂直方向のスケールの値は上向きに増加し、番号ラベルがその左側に配置されます。

xamLinearGauge Configuring the Orientation and Direction 1 17 1.png

この設定は、コントロールの Orientation プロパティで定義されます。

スケールの向きは、スケールの値が増加する方向です。方向は、標準 (水平方向で左から右、垂直方向で下から上) または反転 (水平方向で右から左、垂直方向で上から下) が可能です。

水平方向での反転方向 垂直方向での反転方向
xamLinearGauge Configuring the Orientation and Direction 2 17 1.png
xamLinearGauge Configuring the Orientation and Direction 3 17 1.png

スケールの方向は、コントロールの IsScaleInverted プロパティで定義されます。デフォルトの方向は、標準です。

スケールの向きと方向の構成の概要表

以下の表で、XamLinearGauge のコントロールの方向とスケールの反転で構成できる要素を簡単に説明し、構成に使用するプロパティにマップします。

構成可能な項目 詳細 プロパティ

スケールの向き

コントロール内のリニア ゲージのスケールの向き (水平または垂直)。

スケールの方向

リニア ゲージの方向 (標準または反転)。

スケールの向きの構成

概要

リニア ゲージの向き (水平または垂直) は、コントロールの Orientation プロパティで指定します。

プロパティ設定

以下の表では、各プロパティ設定の構成です。

目的: 使用するプロパティ: 設定の選択肢:

水平方向を指定する

ScaleOrientation.Horizontal

垂直方向を指定する

Orientation

ScaleOrientation.Vertical

以下のスクリーンショットは、下記設定の結果、XamLinearGauge の外観がどのようになるかを示しています。

プロパティ

“Vertical”

xamLinearGauge Configuring the Orientation and Direction 1 17 1.png

以下のコードはこの例を実装します。

XAML の場合:

<ig:XamLinearGauge
    Orientation="Vertical" />

C# の場合:

linearGauge.Orientation = LinearScaleOrientation.Vertical;

スケールの方向の構成 (スケールの反転)

概要

水平方向では、スケールの標準 (デフォルト) 方向は「左から右」で、これはスケールが グラフ領域 の左端から開始され、右端で終了することを意味します ( ScaleStartExtent はグラフ領域の左端の始まりを示し、 ScaleEndExtent は、グラフ領域の左端の終りまでの距離を示します)。

xamLinearGauge Overview 5.png

方向が反転すると、スケールはグラフ領域の右端から開始され、左端で終了します (ScaleStartExtent はグラフ領域の右端の始まりを示し、ScaleEndExtent はグラフ領域の右端の終りまでの距離を示します)。

xamLinearGauge Configuring the Orientation and Direction 4.png

垂直方向では、スケールの標準 (デフォルト) 方向は「下端から上端」で、これはスケールがグラフ領域の下端から開始され、上端で終了することを意味します (ScaleStartExtent はグラフ領域の下端の始まりを示し、ScaleEndExtent は、グラフ領域の下端の終りまでの距離を示します)。

xamLinearGauge Configuring the Orientation and Direction 5.png

方向が反転すると、スケールはグラフ領域の上端から開始され、下端で終了します (ScaleStartExtent はグラフ領域の上端の始まりを示し、ScaleEndExtent はグラフ領域の上端の終りまでの距離を示します)。

xamLinearGauge Configuring the Orientation and Direction 6.png

プロパティ設定

以下の表では、各プロパティ設定の構成です。

目的: 使用するプロパティ: 設定の選択肢:

標準方向の構成

“false”

反転方向の構成

“true”

例 - 水平方向での反転方向

以下のスクリーンショットは、下記設定の結果、XamLinearGauge の外観がどのようになるかを示しています。

プロパティ

“true”

“Horizontal”

xamLinearGauge Configuring the Orientation and Direction 2 17 1.png

以下のコードはこの例を実装します。

XAML の場合:

<ig:XamLinearGauge
	Orientation="Horizontal"
    IsScaleInverted="True" />

C# の場合:

linearGauge.Orientation = LinearScaleOrientation.Horizontal;
linearGauge.IsScaleInverted = true;

例 - 垂直方向での反転方向

以下のスクリーンショットは、下記設定の結果、XamLinearGauge の外観がどのようになるかを示しています。

プロパティ

“true”

“Vertical”

xamLinearGauge Configuring the Orientation and Direction 3 17 1.png

以下のコードはこの例を実装します。

XAML の場合:

<ig:XamLinearGauge
    Orientation="Vertical"
    IsScaleInverted="True" />

C# の場合:

linearGauge.Orientation = LinearScaleOrientation.Vertical;
linearGauge.IsScaleInverted = true;

関連コンテンツ

トピック 目的

このトピック グループは、 XamLinearGauge コントロールの視覚要素 (スケール要素、パフォーマンス バー、比較マーカーおよび範囲など) を詳細に説明し、コード例を使用してコントロールの視覚要素を構成する方法を示します。