Xamarin.Forms¶
Note
This section is under construction. Please contribute!
This example shows how to create a Xamarin.Forms app where both the user interface and the plot is defined in portable code.
Create the project¶
Start Visual Studio and select the blank Xamarin.Forms app template.
Update and add references¶
Update the Xamarin.Forms
NuGet packages to the latest version.
Add the OxyPlot.Xamarin.Forms
NuGet package in both the portable and platform specific projects. Tip: Use the “Manage NuGet packages for solution…” command when you install the package to a lot of projects.
Initialize renderers¶
You need to initialize the OxyPlot renderers by adding the following call just after Xamarin.Forms.Forms.Init()
:
- iOS (Unified API):
OxyPlot.Xamarin.Forms.Platform.iOS.PlotViewRenderer.Init();
- Android:
OxyPlot.Xamarin.Forms.Platform.Android.PlotViewRenderer.Init();
- Universal Windows:
OxyPlot.Xamarin.Forms.Platform.UWP.PlotViewRenderer.Init();
- Windows Phone:
OxyPlot.Xamarin.Forms.Platform.WP8.PlotViewRenderer.Init();
Tip: Search for “Xamarin.Forms.Forms.Init()” in your solution to find all the places you need to add code.
Add the PlotView to a page (in code)¶
In the portable/shared app project, add the plot view to a page:
public App()
{
this.MainPage = new ContentPage
{
Content = new PlotView
{
Model = new PlotModel { Title = "Hello, Forms!" },
VerticalOptions = LayoutOptions.Fill,
HorizontalOptions = LayoutOptions.Fill,
},
};
}
Note that the VerticalOptions and HorizontalOptions properties must be set, otherwise the plot view will have 0 width and height.
Add the PlotView to a page (XAML)¶
Add a “Forms Xaml Page” to your project. In the page element, add a namespace declaration:
xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms"
Then add the plot view:
<oxy:PlotView Model="{Binding Model}" VerticalOptions="Center" HorizontalOptions="Center" />
This view will now be bound to a PlotModel
in the binding context of the page.
References¶
The source code can be found in the HelloWorldXamarinFormsApp1 folder in the documentation-examples repository.