我在基于Xamarin PCL的项目中添加了OxyPlot
Android和Core,我正在使用MVVMCross.
我在我的xml中添加了plotview,如下所示.但我不知道如何使用MVVMCross绑定此视图.
是否有任何好的例子或资源可供遵循?
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安装的其他信息
我通过Package Console添加了如下的OxyPlot.
在PCL中
- PM> Install-Package OxyPlot.Core -Version 1.0.0-unstable1983 -Pre
在Android中
- PM> Install-Package OxyPlot.Xamarin.Android -Pre
或者您也可以从预发布库中将它们添加到Nuget Console中.
解决方法
您应该能够使用标准Mvx属性绑定实现您想要的功能.无需自定义绑定.
基于问题的示例:
方法1:流利的绑定
视图模型
- public class Myviewmodel : Mvxviewmodel
- {
- public Myviewmodel()
- {
- GeneratePlotPoints();
- }
- void GeneratePlotPoints()
- {
- var mo = new PlotModel();
- var s1 = new LineSeries()
- {
- Color = 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,Bundle savedInstanceState)
- {
- var ignored = base.OnCreateView(inflater,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绑定
视图模型
与上述相同
查看/布局
- <oxyplot.xamarin.android.PlotView
- android:id="@+id/plot"
- android:layout_width="match_parent"
- android:layout_height="match_parent"
- local:MvxBind="Model MyModel"/>
片段/代码背后
不需要绑定代码,只需确保通过绑定inflater运行布局.
- public override View OnCreateView(LayoutInflater inflater,savedInstanceState);
- return this.BindingInflate(Resource.Layout.MyView,null);
- }