Skip to main content

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.

Watch Video: Set up a New Xamarin Project for Windows Watch Video: Set up a New Xamarin Project for macOS

Requirements

The table below contains supported platforms, development environments, and required frameworks.

System Requirements

Supported Platforms

Android 4.4 (API 19) or higher,
iOS 9.3 or higher

Supported IDEs

Visual Studio 2019, Visual Studio 2022,
Visual Studio 2019 for Mac, Visual Studio 2022 for Mac

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

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.

Obtain Feed URL

The subsequent page displays a unique NuGet feed URL for your account. Click Copy to Clipboard.

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.

Register NuGet Feed - Visual Studio

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.

New Mobile App

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:

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:

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.

Install NuGet Package - Visual Studio

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:

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.

Add Project Reference

In the NuGet Package Manager, navigate to Browse, find the Xamarin.Kotlin.StdLib NuGet package, and click Install.

Add Project Reference

See Also