データ連結

XAML で作業する際は、プロパティを直接設定するのではなく、外部データソースから Min、Max および Value の値をフェッチできます。

このトピックの例は、MVVM パターンに従います。MVVM パターンについては、https://msdn.microsoft.com/ja-jp/library/hh848246.aspx を参照してください。

次のクラスは、ゲージのデータソースとして機能します。

C#	コードのコピー
class GaugeData { double _value; double _min; double _max; public double Value { get { return _value; } set { _value = value; } } public double Min { get { return _min; } set { _min = value; } } public double Max { get { return _max; } set { _max = value; } } }

コードのコピー

    class GaugeData
    {
        double _value;
        double _min;
        double _max;
        
        
        public double Value
        {
            get { return _value; }
            set
            {
                _value = value;
              
            }
        }
        public double Min
        {
            get { return _min; }
            set
            {
                _min = value;
            }
        }
        public double Max
        {
            get { return _max; }
            set
            {
                _max = value;
            }
        }
    }

XAML のコード

次のように、XAML でコントロールを初期化します。

XAML	コードのコピー
<xuni:XuniLinearGauge Value="{Binding Value}" Min="{Binding Min}" Max="{Binding Max}" Thickness="0.1" HeightRequest="50" WidthRequest="50" PointerColor="Blue"> <xuni:XuniLinearGauge.Ranges> <xuni:GaugeRange Min="0" Max="40" Color="Red"/> <xuni:GaugeRange Min="40" Max="80" Color="Yellow"/> <xuni:GaugeRange Min="80" Max="100" Color="Green"/> </xuni:XuniLinearGauge.Ranges> </xuni:XuniLinearGauge>

XAML

コードのコピー

<xuni:XuniLinearGauge Value="{Binding Value}" Min="{Binding Min}" Max="{Binding Max}"
 Thickness="0.1" HeightRequest="50" WidthRequest="50" PointerColor="Blue">
  <xuni:XuniLinearGauge.Ranges>
    <xuni:GaugeRange Min="0" Max="40" Color="Red"/>
    <xuni:GaugeRange Min="40" Max="80" Color="Yellow"/>
    <xuni:GaugeRange Min="80" Max="100" Color="Green"/>
  </xuni:XuniLinearGauge.Ranges>
</xuni:XuniLinearGauge>

C# のコード

Gauge をデータ連結するには、XAML ページの C# コードビハインドを開き、次のように、クラスコンストラクタ内でゲージに BindingContext を設定します。

C#	コードのコピー
public DataBinding() { InitializeComponent(); BindingContext = new GaugeData() { Value = 25, Max=100, Min=0 }; }