バージョン

比較範囲の構成

トピックの概要

目的

このトピックではコード例を使用して、XamBulletGraph コントロールの範囲を構成する方法を説明します。説明には、範囲の数、位置、長さ、幅、および書式設定が含まれます。

前提条件

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

トピック 目的

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

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

このトピックの内容

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

比較範囲の構成

比較範囲構成の概要

XamBulletGraph コントロールは、範囲コレクションを作成することで複数の比較範囲をサポートします。

BulletGraph Configuring Comparative Ranges 1.png

各範囲は、スケールのメジャーでの開始値や終了値、塗りつぶし色、および境界線の幅や色を指定することで個別に構成できます。スケール全域での比較範囲のサイズは、内側と外側の余白を調整して構成します。

比較範囲構成の概要表

以下の表で、XamBulletGraph コントロールの比較範囲で構成できる要素を簡単に説明し、構成に使用するプロパティにマップします。

構成可能な点 プロパティ デフォルト値

長さ、幅、位置

設定なし

設定なし

設定なし

設定なし

設定なし

設定なし

塗りつぶし色

デフォルトのテーマで定義済み

境界線の色

デフォルトのテーマで定義済み

境界線の線幅

1.0
Note
注:

各範囲の Brush および Outline プロパティに明示的な値を設定しない場合、値は XamBulletGraph の RangeBrushes および RangeOutlines コレクションの値から読み取られます。値は、各範囲の色やアウトラインの塗りつぶしの設定に継続して使用するブラシ セットの事前定義にも使用できます。

プロパティ設定

以下の表では、任意の動作と各プロパティ設定のマップを示します。

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

範囲開始

スケールで範囲を開始する位置

スケールのメジャーにおける任意の値

範囲終了

スケールで範囲を終了する位置

スケールのメジャーにおける任意の値

範囲の始点側の端の内側の頂点

予約領域の端からのスケール全域における始点側の端の内側の頂点位置。

(内側の頂点は、予約領域の端に最も近い始点側の端の地点です。)

方向 (水平 / 垂直) に応じた、グラフ領域の高さと幅の相対部分として望ましい値。小数で指定 (例: 0.2)

範囲の終点側の端の内側の頂点

予約領域の端からのスケール全域における終点側の端の内側の頂点位置。

方向 (水平 / 垂直) に応じた、グラフ領域の高さと幅の相対部分として望ましい値。小数で指定 (例: 0.3)

範囲の始点側の端の外側の頂点

予約領域の端からのスケール全域における始点側の端の外側の頂点位置。

(外側の頂点は、予約領域の端に最も近い始点側の端の地点です。)

方向 (水平 / 垂直) に応じた、グラフ領域の高さと幅の相対部分として望ましい値。小数で指定 (例: 0.7)

範囲の終点側の端の外側の頂点

予約領域の端からのスケール全域における終点側の端の外側の頂点位置。

方向 (水平 / 垂直) に応じた、グラフ領域の高さと幅の相対部分として望ましい値。小数で指定 (例: 0.8)

塗りつぶし色

範囲の塗りつぶし色

任意の色

境界線の線幅

範囲の境界線の幅

任意の値 (ピクセル)

境界線の色

範囲の境界線の色

任意の色

例

以下のスクリーンショットは、以下の設定の結果、XamBulletGraph に追加した比較範囲の外観がどのようになるか示しています。

プロパティ 値

"Green"

“6”

“89”

“0.5”

“0.5”

“0.8”

“0.8”

"Black"
BulletGraph Configuring Comparative Ranges 2.png

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

XAML の場合:

<ig:XamBulletGraph x:Name="bulletGraph">
      <ig:XamBulletGraph.Ranges>
            <ig:LinearGraphRange Brush="Green"
                                       StartValue="6"
                                       EndValue="89"
                                       InnerEndExtent="0.5"
                                       InnerStartExtent="0.5"
                                       OuterEndExtent="0.8"
                                       OuterStartExtent="0.8"
                                       Outline="Black"
                                       />
      </ig:XamBulletGraph.Ranges>
</ig:XamBulletGraph>

C# の場合:

LinearGraphRange range = new LinearGraphRange();
range.Brush = new SolidColorBrush(Color.Green);
range.StartValue = 6;
range.EndValue = 89;
range.InnerEndExtent = .5;
range.InnerStartExtent = .5;
range.OuterEndExtent = .8;
range.OuterStartExtent = .8;
range.Outline = new SolidColorBrush(Color.Black);

関連コンテンツ

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

トピック 目的

このトピックではコード例を使用して、 XamBulletGraph コントロールのスケールを構成する方法を説明します。説明には、コントロール内のスケールの配置、スケールの目盛およびラベルの構成が含まれます。

このトピックでは例を使用して、 XamBulletGraph コントロールのパフォーマンス バーを構成する方法を説明します。説明には、バーが示す値、幅、位置、および書式設定が含まれます。

このトピックではコード例を使用して、 XamBulletGraph コントロールの比較目盛マーカーを構成する方法を説明します。説明には、マーカーの値、幅、および書式設定が含まれます。

このトピックではコード例を使用して、ブレット グラフの背景を構成する方法を説明します。説明には、背景のサイズ、位置、色、および境界線の設定が含まれます。