Write Fast with Infragistics Toolbox
Introduction
The Ultimate UI Controls for Xamarin includes the Infragistics Toolbox. This toolbox allows you to drag and drop controls into your code, and then use configurators to customize the components without having to write a single line of code. In this lesson, we will demonstrate how to use the Infragistics Toolbox.
Lesson Objectives
At the end of this lesson, you will be familiar with how to use the Infragistics Toolbox to easily develop components without writing code.
- Set up the project
- Add XAML from the toolbox
- Use Infragistics controls
For more information on the controls used in this lesson, see the Xamarin Radial Gauge Control page and Xamarin Pie Chart Control page.
Important: Before You Begin
The Visual Studio extension, “NuGet Package Manager for Visual Studio 2015,” v3.5.0.1996 or later must be installed for the Infragistics Toolbox to work correctly. Because the latest version in the Visual Studio Gallery is v3.4.4 and Microsoft has not enabled automatic updates from v3.4.4 to v3.5.0.1996, you need to manually update this package.
To update to the latest version, follow these steps:
- Close all instances of Visual Studio.
- Download the latest NuGet tools
Note: In rare cases, it is possible the Infragistics controls to be missing from the toolbox. Clicking the “Refresh” button at the bottom of the Toolbox pane will add all Infragistics controls present in the current project’s NuGet packages to the Toolbox.
Step 1 Setting up the Project
Open Visual Studio and create a new project. When creating the project, select Cross Platform App (Xamarin.Forms or Native). In our example, we will name the project App6. You should also specify using a blank app with a portal class library.
To open the Infragistics Toolbox, click View, highlight Other Windows, then click Infragistics Toolbox.
Step 2 Adding XAML from the toolbox
To demonstrate the capabilities of the toolbox, open the MainPage.xaml file in the solution. With the toolbox open, drag and drop a Xamarin.Forms view from the toolbox into a blank line in the XAML. Notice that the tags for the code are populated automatically.
Next, hold the Ctrl key while dragging another element. Not only are the tags presented, but common properties are also populated with default values.
This enables you to quickly and easily build components in your app without writing any code. After you’ve dragged a few code examples from the toolbox, delete the lines of code that you added to return to the default MainPage.xaml file.
Step 3 Using Infragistics controls
Next, you will add the Infragistics controls to the solution. Right-click on the project, and then click Manage NuGet Packages for Solution. Change the package source to Infragistics (Local). On the Browse tab, select the Infragistrics.XF.Gauges package. Specify the package for the Android app and then add the package.
After the package has been added to the solution, the Infragistics Toolbox will be updated with the Xamarin.Forms controls. These are additional components that you can drag and drop to create fully configured XAML code without having to write any.
Another feature of using the toolbox to add components is that the required namespaces for components will also be added when dragging a component onto the XAML screen. For example, if you drag and drop the XamRadialGauge control, not only will the gauge XAML populate, the Infragistics namespace will also be created in the ContentPage element.
The necessary namespace will be automatically created based on the control that you drag and drop. Add the XamPieChart control to the XAML to see the changes in the namespace.
Conclusion
The Infragistics Toolbox is used to create visual elements, using the world’s first NuGet-powered toolbox. The toolbox enables you to create blank or pre-populated components by simply dragging and dropping the element into the XAML code. These controls are available with Infragistics Ultimate UI for Xamarin.