Get Started with DevExpress Components for Xamarin.Forms
- 6 minutes to read
Note
Microsoft will end Xamarin-related support services on May 1, 2024 and shift development focus to the .NET MAUI platform.
Based on Microsoft’s decision, we highly recommend those using Xamarin.Forms to consider our .NET MAUI Component Suite for existing/new mobile projects. DevExpress .NET MAUI components support many of the features/capabilities available in Xamarin.Forms counterparts.
Please refer to the following help topic when you are ready to migrate your DevExpress Xamarin.Forms-based application to .NET MAUI: Migration from Xamarin.Forms to .NET MAUI.
Free-of-Charge DevExpress Components for Xamarin.Forms are distributed through the DevExpress NuGet Gallery and as downloadable libraries. This topic explains how to get started with your new cross-platform application and add DevExpress Components for Xamarin.Forms to the project.
Requirements
The table below contains supported platforms, development environments, and required frameworks.
System Requirements | |
---|---|
Supported Platforms | Android 4.4 (API 19) or higher, |
Supported IDEs | Visual Studio 2019, Visual Studio 2022, |
SDK Requirements | Xamarin.Forms 5.0.0.2012 or higher |
Your Xamarin.Forms solution should meet the requirements below.
Solution Requirements | |
---|---|
Target Android Version | Android 10 (API 29) or higher |
Code Sharing Strategy | .NET Standard |
Register DevExpress NuGet Gallery in Visual Studio
Obtain a NuGet feed URL that contains your unique API key. Go to nuget.devexpress.com, log in as a registered DevExpress customer, and click Obtain Feed URL.
The subsequent page displays a unique NuGet feed URL for your account. Click Copy to Clipboard.
Register your personal NuGet feed as a package source in Visual Studio.
Navigate to Tools | Options | NuGet Package Manager | Package Source and add your personal NuGet feed to the list of package sources.
Tip
The DevExpress NuGet Gallery is the recommended choice, but you can also use Download Manager to obtain libraries that contain DevExpress Components for Xamarin.Forms. The NuGet Gallery offers multiple advantages: for example, notifications that alert you to a new available version, dependencies are automatically downloaded and installed.
Use Project Templates
If you create a new project, you can use DevExpress Project Templates. The wizard allows you to select components that you plan to use.
Your project will include references to the corresponding DevExpress NuGet packages and will register all required handlers (the predefined pages will also declare XAML namespaces for DevExpress controls).
Navigate to the following pages in the Visual Studio Marketplace, download, and install the extensions:
- DevExpress Xamarin Project Templates for Visual Studio 2019
- DevExpress Xamarin Project Templates for Visual Studio 2022
See the following topic for more information: Project Templates.
Tip
We recommend that you use project templates to create your new application, but you can also manually install DevExpress NuGet packages, initialize components, and declare XAML namespaces.
How to Install DevExpress NuGet Packages
The DevExpress NuGet Gallery includes the following packages and components:
DevExpress.XamarinForms.Grid
—contains the DataGridView component.DevExpress.XamarinForms.Editors
—contains DataFormView, SimpleButton, Chip, ChoiceChipGroup and other chip groups, DXPopup, TextEdit and other data editors.DevExpress.XamarinForms.CollectionView
—contains the DXCollectionView component.DevExpress.XamarinForms.Charts
—contains the ChartView and PieChartView components.DevExpress.XamarinForms.Navigation
—contains the TabView, DrawerView, and other navigation components.DevExpress.XamarinForms.Scheduler
—contains the MonthView, WeekView, and other scheduler views.
Install required packages in Visual Studio.
In Visual Studio’s main menu, select Tools | NuGet Package Manager | Manage NuGet Packages for Solution, or right-click the solution in Solution Explorer and select Manage NuGet Packages for Solution.
Search for the required packages in the DevExpress NuGet package source, select all projects in the solution, and click Install.
Tip
Enable the Include prerelease option to see components that are in a preview or beta state.
How to Initialize DevExpress Components
You must initialize DevExpress components in order to use them in your application. There are several initialization methods available to you on the Android and iOS platforms.
Android
The following methods allow you to initialize the corresponding components for the Android platform:
- Charts.Initializer.Init—initializes the ChartView and PieChartView components.
- CollectionView.Initializer.Init—initializes the DXCollectionView component.
- Scheduler.Initializer.Init—initializes the MonthView, WeekView, and other scheduler views.
- DataGrid.Initializer.Init—initializes the DataGridView component.
- Editors.Initializer.Init—initializes the SimpleButton, Chip, ChoiceChipGroup and other chip groups, TextEdit and other data editors.
- Navigation.Initializer.Init—initializes the TabView, DrawerView, and other navigation components.
- DataForm.Initializer.Init—initializes the DataFormView component.
- Popup.Initializer.Init—initializes the DXPopup component.
In the App.xaml.cs file of the shared project, call these methods depending on which components are required. The code below initializes all DevExpress components.
namespace DXApp1 {
public partial class App : Application {
public App() {
DevExpress.XamarinForms.Charts.Initializer.Init();
DevExpress.XamarinForms.CollectionView.Initializer.Init();
DevExpress.XamarinForms.Scheduler.Initializer.Init();
DevExpress.XamarinForms.DataGrid.Initializer.Init();
DevExpress.XamarinForms.Editors.Initializer.Init();
DevExpress.XamarinForms.Navigation.Initializer.Init();
DevExpress.XamarinForms.DataForm.Initializer.Init();
DevExpress.XamarinForms.Popup.Initializer.Init();
InitializeComponent();
MainPage = new MainPage();
}
}
}
iOS
If you target iOS, you should also call similar methods to initialize DevExpress components for this platform:
Charts.iOS.Initializer.Init
—initializes the ChartView and PieChartView components.CollectionView.iOS.Initializer.Init
—initializes the DXCollectionView component.Scheduler.iOS.Initializer.Init
—initializes the MonthView, WeekView, and other scheduler views.DataGrid.iOS.Initializer.Init
—initializes the DataGridView component.Editors.iOS.Initializer.Init
—initializes the SimpleButton, Chip, ChoiceChipGroup and other chip groups, TextEdit and other data editors.Navigation.iOS.Initializer.Init
—initializes the TabView, DrawerView, and other navigation components.DataForm.iOS.Initializer.Init
—initializes the DataFormView component.Popup.iOS.Initializer.Init
—initializes the DXPopup component.
In the AppDelegate.cs file of the iOS project, call these methods depending on required components. The code below initializes all DevExpress components.
namespace DXApp1.iOS {
[Register("AppDelegate")]
public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate {
public override bool FinishedLaunching(UIApplication app, NSDictionary options) {
global::Xamarin.Forms.Forms.Init();
DevExpress.XamarinForms.Charts.iOS.Initializer.Init();
DevExpress.XamarinForms.CollectionView.iOS.Initializer.Init();
DevExpress.XamarinForms.Scheduler.iOS.Initializer.Init();
DevExpress.XamarinForms.DataGrid.iOS.Initializer.Init();
DevExpress.XamarinForms.Editors.iOS.Initializer.Init();
DevExpress.XamarinForms.Navigation.iOS.Initializer.Init();
DevExpress.XamarinForms.DataForm.iOS.Initializer.Init();
DevExpress.XamarinForms.Popup.iOS.Initializer.Init();
LoadApplication(new App());
return base.FinishedLaunching(app, options);
}
}
}
How to Declare XAML Namespaces
On each application page that contains DevExpress components, declare XAML namespaces that refer to the corresponding CLR namespaces. The markup below shows how to declare XAML namespaces and add a DataGridView instance to a page.
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:dxg="http://schemas.devexpress.com/xamarin/2014/forms/datagrid"
xmlns:dxc="http://schemas.devexpress.com/xamarin/2014/forms/charts"
xmlns:dxsch="http://schemas.devexpress.com/xamarin/2014/forms/scheduler"
xmlns:dxe="http://schemas.devexpress.com/xamarin/2014/forms/editors"
xmlns:dxp="http://schemas.devexpress.com/xamarin/2014/forms/popup"
xmlns:dxcv="http://schemas.devexpress.com/xamarin/2014/forms/collectionview"
xmlns:dxn="http://schemas.devexpress.com/xamarin/2014/forms/navigation"
x:Class="DXApp1.MainPage">
<dxg:DataGridView/>
</ContentPage>
Kotlin Standard Library
If your project targets the Android platform, add the Kotlin Standard Library to the Android project.
In Solution Explorer, right-click the Android project (<YourAppName>.Android) and select Manage NuGet Packages.
In the NuGet Package Manager, navigate to Browse, find the Xamarin.Kotlin.StdLib NuGet package, and click Install.