3

RadRadialGauge を更新しようとしています。リアルタイムで取得されているデータを (アニメーション化されたニードルを使用して) 表示します。TimeStampプロパティを使用してチャートを描画する RadChartView がありValueます。グラフを追加するとき、監視している変数に基づいていくつか追加したい場合があります。たとえば、モーター速度と出力周波数を見たい場合は、複数の垂直軸を追加する必要があります。RadChartView のデータ バインディングを処理するコードの一部は次のとおりです。

var lineSeries = new LineSeries();
lineSeries.CategoryBinding =
    new PropertyNameDataPointBinding() { PropertyName = "TimeStamp" };
lineSeries.ValueBinding =
    new PropertyNameDataPointBinding() { PropertyName = "Value" };
lineSeries.ItemsSource = (chart.Chart as GuiAnalogQueue).Records;

コードの残りの部分は単なる外観処理であり、最後に LineSeries を RadChartView に追加します。

今、ある意味で、このコードを RadGauge に移植しようとしています。値をニードルにバインドして、値が変更されたときにニードルが移動する方法がわかりません。
私が試したXAMLでは、変数Value="{Binding Value}"にバインディングを追加しようとしましたValueSource。また、私はやったneedle.Value = chart.Chart.Value;

私はそれを理解できないので、助けていただければ幸いです。

アップデート

これが私が達成しようとしていることです。私のRecordsコレクションには と の 2 つのプロパティがValueありTimeStampます。私は自分ValueRecordsneedle値にバインドしようとしています。これは、プログラムでそれを行うための私のアプローチです:

public void InitializeCharts(ChartsVM charts, Theme theme)
{
    DataContext = charts;
    foreach (cVM chart in charts.Charts)
    {
        Binding value = new Binding();
        value.Source = (chart.Chart as GuiAnalogQueue).Records;
        value.Path = new PropertyPath("Value");
        needle.SetBinding(Needle.ValueProperty, value);
    } 
}

ただし、これを行うと、まったく変更needle.Valueされません。MyRecordsは NotifyPropertyChanged("Records") を使用するコレクションなので、Records が変更されるたびに針が変更されることを期待します。

私の元の投稿でわかるように、これらの 3 行は変数を ChartView チャートにバインドする処理を行いますが、RadGauge を機能させることができません。

4

2 に答える 2

3

要するに、Needle は値にどのタイプのコレクションも使用していないことがわかりました。そのため、ソースをコレクション内に設定し、パスを設定しようとしたとき、それはあまり好きではありませんでした。代わりに、値をレコード コレクションに追加する直前にプロパティを追加しました (値の更新関数で)。そうすれば、バインディングを次のように設定できます。

Binding value = new Binding();         
value.Source = (chart.Chart as GuiAnalogQueue);         
value.Path = new PropertyPath("AnalogValue");
needle.SetBinding(Needle.ValueProperty, value); 

つまり、Needle はその Value プロパティを Source--chart.Chart にある AnalogValue プロパティに GuiAnalogQueue としてバインドします。

このページに誘導された方の参考になれば幸いです。

于 2012-08-01T16:34:31.237 に答える
2

これは、RadRadialGaugeを使用する基本的な例です。


XAML:


<telerik:RadRadialGauge x:Name="radialGauge"
                    Width="300"
                    Height="300"
                                Grid.Column="0">
        <telerik:RadialScale Min="1"
                        Max="12">
            <telerik:RadialScale.Indicators>
                <telerik:Needle x:Name="needle" />
                <telerik:Pinpoint/>
            </telerik:RadialScale.Indicators>

        </telerik:RadialScale>
    </telerik:RadRadialGauge>

ご覧のとおり、ラジアルスケールが定義されたラジアルゲージがあります。ラジアルスケールには、インジケーターとして針があります。RadialScaleは1から12です。針に名前を付けていることに注意してください。これを使用して、コードビハインドから値をプッシュします。

この例では、ディスパッチャータイマーを使用して1秒ごとにティックし、1〜12のランダムな値を生成しています。これがスニペットの背後にあるコードです。


コードスニペット:


以下の変数はウィンドウレベルで宣言されます

TimeSpan interval = TimeSpan.FromSeconds(1);
DispatcherTimer timer;
Random rnd = new Random();

WindowLoadedおよびUnloadedイベントのイベントハンドラーを定義しました。ウィンドウロードで、タイマーを開始します。

    void OnWindowLoad(object sender, RoutedEventArgs e)
    {
        timer = new DispatcherTimer();
        timer.Interval = interval;
        timer.Tick += new EventHandler(Timer_Tick);
        timer.Start();
    }

タイマーティック機能は次のとおりです。

    private void Timer_Tick(object sender, EventArgs e)
    {
        timer.Stop();

        SetNextValue();

        timer.Start();
    }

SetNextValue関数は次のとおりです。

    private void SetNextValue()
    {
        int minValue = 1;
        int maxValue = 12;
        int nextValue = rnd.Next(minValue, maxValue);
        needle.Value = nextValue;
    }

Unloadedイベントハンドラーでタイマーを停止しています。

    void OnWindowUnload(object sender, RoutedEventArgs e)
    {
        timer.Stop();
    }

出力:アプリを実行すると、毎秒1から12までの乱数が生成され、生成された数値が針の値に設定されるため、針の位置が変化するのがわかります。SetNextValue()メソッドは、実際の値を監視し、針の値をその実際のデータに設定するためのゲートウェイになります。

これは、ラジアルゲージを説明するために私が考えることができる基本的なサンプルコードです。

これがあなたが探している答えを提供することを願っています。


アップデート:


針の値を設定するMVVMの方法は次のとおりです。ウィンドウにINotifyPropertyChangedインターフェイスを実装させます。datacontextをウィンドウ自体に設定します

public partial class MainWindow : Window, INotifyPropertyChanged

public MainWindow()
    {
        InitializeComponent();

        Loaded += OnWindowLoad;
        Unloaded += OnWindowUnload;

        DataContext = this;
    }

以下のようにPropertyChangedイベントの実装を提供します。

public event PropertyChangedEventHandler PropertyChanged = delegate { };

    void NotifyPropertyChanged(string propName)
    {
        PropertyChanged(this, new PropertyChangedEventArgs(propName));
    }

NeedleValueというプロパティを実装します。

    int needleValue = 1;
    public int NeedleValue 
    {
        get
        {
            return needleValue;
        }
        set
        {
            needleValue = value;
            NotifyPropertyChanged("NeedleValue");
        }
    }

SetNextValueで-新しく作成されたNeedleValueプロパティを設定するだけです。これにより、プロパティ変更通知が発生します。

private void SetNextValue()
    {
        int minValue = 1;
        int maxValue = 12;
        int nextValue = rnd.Next(minValue, maxValue);
        NeedleValue = nextValue;
    }

XAMLで、以下のようにNeedleValueプロパティをNeedleValueにバインドします

<telerik:Needle x:Name="needle" Value="{Binding NeedleValue}" />

これがあなたが探している答えをあなたに提供することを願っています:)

Lohith(Tech Evangelist、Telerik India)

于 2012-07-26T19:19:48.137 に答える