通过Xamarin.Android中的MVVMCross绑定OxyPlot [英] Binding OxyPlot via MVVMCross in Xamarin.Android

问题描述

我已经在使用MVVMCross的基于Xamarin PCL的项目中添加了OxyPlot Android和Core.

I have added OxyPlot Android and Core in my Xamarin PCL based project where I am using MVVMCross.

我已经在我的xml中添加了plotview，如下所示.但是我不知道如何使用MVVMCross绑定此视图.

I have added the plotview in my xml as follows. But I do not know how to bind this view using MVVMCross.

有没有好的榜样或资源可循?

Is there any good example or resources to follow?

MyView.xml

<oxyplot.xamarin.android.PlotView
android:id="@+id/plot"
android:layout_width="match_parent"
android:layout_height="match_parent" /> 

MyView.cs

public class MyView : MvxFragment<MyViewModel>
{
    public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
    {
        var ignored = base.OnCreateView(inflater, container, savedInstanceState);
        var view = this.BindingInflate(Resource.Layout.MyView, null)

        MyViewModel MyMainViewModel = new MyViewModel();
        var a = view.FindViewById<PlotView>(Resource.Id.plot);
        a.Model = MyViewModel.MyModel;

        return view;
    }
}

MyViewModel.cs

public PlotModel MyModel { get; set; }
public MyViewModel
{
  PlotModel mo = new PlotModel();
  var s1 = new LineSeries()
  {
    Color = OxyColors.SkyBlue,
    MarkerType = MarkerType.Circle,
    MarkerSize = 6,
    MarkerStroke = OxyColors.White,
    MarkerFill = OxyColors.SkyBlue,
    MarkerStrokeThickness = 1.5
  };
  s1.Points.Add(new DataPoint(0, 10));
  s1.Points.Add(new DataPoint(10, 40));
  s1.Points.Add(new DataPoint(40, 20));
  s1.Points.Add(new DataPoint(60, 30));
  mo.Series.Add(s1);
  MyModel = mo;
}

---

OxyPlot安装的其他信息

---

Additional Information for OxyPlot installation

我通过Package Console如下添加了OxyPlot.

I have added OxyPlot as follows through Package Console.

在PCL中

PM> Install-Package OxyPlot.Core -Version 1.0.0-unstable1983 -Pre

在Android系统中

PM> Install-Package OxyPlot.Xamarin.Android -Pre

或者您也可以从prelease库的Nuget控制台中添加它们.

Or you can also add them in Nuget Console from prelease library.

推荐答案

您应该能够使用标准Mvx属性绑定来实现所需的功能.无需自定义绑定.

You should be able to achieve what you want using standard Mvx property binding. No custom binding required.

基于问题的示例:

方法1:流畅的绑定

ViewModel

public class MyViewModel : MvxViewModel
{
    public MyViewModel()
    {
        GeneratePlotPoints();
    }

    void GeneratePlotPoints()
    {
        var mo = new PlotModel();
        var s1 = new LineSeries()
        {
            Color = OxyColors.SkyBlue,
            MarkerType = MarkerType.Circle,
            MarkerSize = 6,
            MarkerStroke = OxyColors.White,
            MarkerFill = OxyColors.SkyBlue,
            MarkerStrokeThickness = 1.5
        };
        s1.Points.Add(new DataPoint(0, 10));
        s1.Points.Add(new DataPoint(10, 40));
        s1.Points.Add(new DataPoint(40, 20));
        s1.Points.Add(new DataPoint(60, 30));
        mo.Series.Add(s1);
        MyModel = mo;
    }

    PlotModel _myModel;
    public PlotModel MyModel
    {
        get { return _myModel; }
        set { SetProperty(ref _myModel, value); }
    }
}

视图/布局

<oxyplot.xamarin.android.PlotView
   android:id="@+id/plot"
   android:layout_width="match_parent"
   android:layout_height="match_parent" />

后面的片段/代码

public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
{
    var ignored = base.OnCreateView(inflater, container, savedInstanceState);
    var view = this.BindingInflate(Resource.Layout.MyView, null);

    var graphControl = view.FindViewById<PlotView>(Resource.Id.plot);

    var bindset = this.CreateBindingSet<MyView, MyViewModel>();
    bindset.Bind(graphControl).For(c => c.Model).To(vm => vm.MyModel);
    bindset.Apply();

    return view;
}

方法2:Xml绑定

ViewModel

与上述相同

视图/布局

<oxyplot.xamarin.android.PlotView
   android:id="@+id/plot"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   local:MvxBind="Model MyModel"/>

片段/代码后面

不需要绑定代码，只需确保通过绑定充气机运行布局即可.

No binding code needed, just make sure to run the layout through the binding inflater.

public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
{
    var ignored = base.OnCreateView(inflater, container, savedInstanceState);
    return this.BindingInflate(Resource.Layout.MyView, null);
}

这篇关于通过Xamarin.Android中的MVVMCross绑定OxyPlot的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！