バージョン

針の構成 (XamRadialGauge)

トピックの概要

目的

このトピックでは、XamRadialGauge コントロールを使用した針の概念的な概要を提供します。針のプロパティの説明および針の構成方法を例で示します。

前提条件

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

トピック 目的

このセクションでは、 XamRadialGauge コントロールおよびその主要機能の概要を説明します。

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

このトピックの内容

このトピックは、以下のセクションで構成されます。

針の概要

針の概要

ゲージの針は、ゲージの設定値を表すために使用される視覚要素で、針キャップのオーバーレイまたはアンダーレイなどのゲージの針のピボット ポイントで構成されます。サポートされている針の図形とキャップは、NeedleShape と NeedlePivotShape プロパティで設定します。さまざまな針の図形やピボット図形の表示については、針のサンプルを参照してください。

プレビュー

以下の画像は、 Value プロパティを 60 に設定した場合の XamRadialGauge コントロールのプレビューです。

Configuring Needles1 1 17 1.png

針のプロパティ

針のプロパティの概要

以下の表で、XamRadialGauge コントロールの針に関連したプロパティを簡単に説明します。

プロパティ名 プロパティ タイプ 説明

double

針が指すゲージの値を決定します。

double

ゲージの中心から測定される、針の開始位置を決定します。このプロパティの値は -1 から 1 の間にする必要があります。

double

ゲージの中心から測定される、針の終了位置を決定します。このプロパティの値は -1 から 1 の間にする必要があります。

double

針のポイント部分の幅を決定します。このプロパティの値は 0 から 1 の間にする必要があります。

double

針の基部の部分の幅を決定します。このプロパティの値は 0 から 1 の間にする必要があります。

NeedleShape プロパティの以下のいずれかの値が設定されていない限り、効果は表示されません。

  • Rectangle

  • RectangleWithBulb

  • Trapezoid

  • TrapezoidWithBulb

使用する針の図形を決定します。以下に設定できます。

  • Rectangle

  • RectangleWithBulb

  • Triangle

  • TriangleWithBulb

  • Trapezoid

  • TrapezoidWithBulb

  • Needle

  • NeedleWithBulb

  • None

針に使用するピボットの形を決定します。

以下に設定できます。

  • Circle

  • CircleWithHole

  • CircleOverlay

  • CircleOverlayWithHole

  • CircleUnderlay

  • CircleUnderlayWithHole

  • None

Brush

ゲージの針のブラシを決定します。

Brush

アウトラインの針に使用するブラシを決定します。

Brush

針のピボット図形の塗りブラシを決定します。このピボット ブラシは、オーバーレイとアンダーレイを描画するピボット図形のみに適用します。そうではない場合は、この設定はピボット図形に効果がありません。

Brush

針のピボット図形のアウトラインのブラシを決定します。このピボット ブラシは、オーバーレイとアンダーレイを描画するピボット図形のみに適用します。そうではない場合は、この設定はピボット図形に効果がありません。

針の構成

例

以下のスクリーンショットは、以下の設定の結果、針のプロパティを使用した XamRadialGauge コントロールの外観がどのようになるか示しています。

プロパティ 値

60

0.5

Rectangle

CircleWithHole
Configuring Needles1 2 17 1.png

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

XAML の場合:

<ig:XamRadialGauge x:Name="radialGauge"
                   Value="60"
                   NeedleEndExtent="0.5"
                   NeedleShape="Rectangle"
                   NeedlePivotShape="CircleWithHole" />

C# の場合:

var radialGauge = new XamRadialGauge();
radialGauge.Value = 60;
radialGauge.NeedleEndExtent = 0.5;
radialGauge.NeedleShape = RadialGaugeNeedleShape.Rectangle;
radialGauge.NeedlePivotShape = RadialGaugePivotShape.CircleWithHole;

関連コンテンツ

このトピックの追加情報については、以下のトピックも合わせてご参照ください。

トピック 目的

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

このトピックでは、XamRadialGauge コントロールのバッキング機能の概念的な概要を提供します。バッキング領域のプロパティについて説明し、実装例を提供します。

このトピックでは、XamRadialGauge コントロールを使用したラベルの概念的な概要を提供します。ラベルのプロパティの説明およびラベルの構成方法を例で示します。

このトピックでは、XamRadialGauge コントロールの範囲の概念的な概要を提供します。範囲のプロパティについて説明し、範囲をラジアル ゲージに追加する方法の例も示します。

このトピックでは、XamRadialGauge コントロールのスケールの概念的な概要を提供します。スケールのプロパティの説明およびスケールの実装方法を例で示します。

このトピックでは、XamRadialGauge コントロールを使用した目盛の概念的な概要を提供します。目盛プロパティの説明および目盛の実装方法を例で示します。