Cross Platform
Android
iOS
Mac
Test Cloud

Introducing Xamarin Studio

The Xamarin Integrated Development Environment

This document provides an overview of Xamarin Studio, the Integrated Development Environment (IDE) used to create iOS, Mac and Android applications, presenting the functionality that makes it an excellent tool for creating native mobile and desktop applications on the Xamarin platform.

Overview

Xamarin Studio is a modern, sophisticated IDE with many features for creating iOS, Mac and Android applications. It includes a rich editor, debugging, native platform integration with iOS, Mac and Android, and integrated source control to name just of few of its many features.

This article surveys various sections of Xamarin Studio, providing a look at some of the features that make it a powerful tool for creating applications.

IDE Tour

Xamarin Studio is organized into several sections for managing application files and settings, creating application code, and debugging.

The image below shows Xamarin Studio with an application loaded:

[ ]

The following sections provide an overview of the major areas in Xamarin Studio.

Welcome Screen

When launched, Xamarin Studio displays a Welcome Screen as shown below:

[ ]

The Welcome Screen contains the following sections:

  • Toolbar – Provides shortcuts to the Xamarin Developer Center, Support and Forums, as well as quick access to your Xamarin Account.
  • Solutions – Provides quick access to recently opened solutions, as well as convenience buttons to open or create projects.
  • Xamarin News - News feed to stay up to date on the latest Xamarin information.
  • Pre- Builts Apps – Templates of complete applications to help bootstrap application development.

Solution Pad

The Solution Pad organizes the project(s) in a solution, as shown below:

[ ]

This is where files for the source code, resources, user interface, and assembly references are managed. When an item in the Solution Pad is selected, a menu button to the right of the item allows access to the item’s context menu, which is also presented by right-clicking the item. The following shows the context menu for a C# source code file:

[ ]

Assembly References

Assembly references are available under the References folder, shown below:

[ ]

Adding references is done via the References folder’s Edit References context menu item, or by double-clicking the folder, either of which opens the Edit References dialog:

[ ]

The list of selected assemblies is shown in the list on the right side of the dialog. Any assemblies selected in the Edit References dialog are added to the project when the dialog’s OK button is selected.

Components

Xamarin Components are a powerful feature that allows user interface components as well as libraries and themes to easily be added to a project. For more information on using Components from Xamarin Studio see the Components Walkthrough.

Adding packages using NuGet

NuGet is a package repository, similar to the Xamarin Component store. When you add a package from NuGet, the package is downloaded and the assemblies added directly under References.

Installing from NuGet can be performed in one of two ways - Project > Add packages - From the package context menu

From the package context menu

The context menu is found by clicking on the drop down next to the package name

[]

From here, adding packages via either method is the same. After Add Packages... has been selected, the NuGet browser window will open:

[ ]

For this example, Xamarin has been typed into the search bar. This limits the NuGet search to only packages with the word
Xamarin in. There are many other packages available.

Select the package required and click the Add Package button. NuGet will install the package and any dependencies. Once this has been done, the file browser pad will change to reflect the addition

[ ]

The packages.config file will be added to the file list. This contains the specific version number of the package amongst other things.

Removing a package To remove the package, highlight the package name by clicking on it and press delete on the keyboard or via the context menu.

Updating a package From time to time, newer versions of a package may become available. Updating the package is performed by clicking on the package name, then on the context menu clicking on Update.

[ ]

Project Options

Double-clicking the project item or selecting Options from its context menu opens the Project Options dialog, shown below:

[ ]

This dialog allows a variety of project level settings to be applied, organized by the following sections:

  • General – Settings such as the application name, version, description and default namespace.
  • Build – Compiler options, build configurations, assembly name and output path; as well as platform specific build, packaging and application settings.
  • Run – Execution scripts and commands.
  • Source Code – Formatting, conventions and naming policies.
  • Version Control – Commit message styles and change log integration.

Editor

Xamarin Studio features a modern, sophisticated source code editor. The editor area features a tabbed interface for editing source files as shown below:

[ ]

The editing experience includes various features, presented in the following sections.

Syntax Highlighting

Code in the editor is highlighted according to various language keywords and constructs, as shown below where the keywords, types and string literals have different colors:

[ ]

Code Completion

Types are discoverable in a popup window while you type. This allows easy exploration of APIs. The following screen shows the completion list:

[ ]

Code Navigation

Xamarin Studio includes support for both finding declarations of any variable or type, as well as any references where they are used. These are available from the editor’s context menu:

[ ]

Selecting Go to declaration navigates the editor to either the variable declaration or to the type in the assembly browser. Find references presents a list of all places in the project where the variable or type is used, as shown below:

[ ]

Breadcrumb Menu

Just below the tabs is the breadcrumb menu, which allows exploration of the class structure contained within the selected file.

[ ]

Tooltips

Rich, detailed tooltips are presented when hovering over various code elements within the editor. These display information such as function signatures, summary descriptions and code template previews, as shown below:

[ ]

#### Multiple Open Source Windows

Having more than one source file editing window open at any time has great speed advantages when constructing code. Xamarin Studio allows you do that simply.

Select View > Editor Layout > 2 columns

To revert back to a single open window, perform the same operation except select 1 column.

Refactoring

Xamarin Studio provides the following refactoring features:

  • Rename
  • Create property
  • Create getter
  • Extract Method
  • Iterate via foreach
  • Declare local variable

These are available in the editor’s context menu based on what is selected in the code. The following screenshot shows the refactoring context menu when the cursor is over a variable:

[ ]

Indentation and Comments

The editor includes support for automatic indention of code, which can be applied across an entire file by selecting Edit > Format > Format Document from the main menu.

Additionally, indentation as well as comment toggling is available in the editor’s context menu:

[ ]

Snippets

Xamarin Studio includes support for code templates, which allow common code constructs to be easily added. The full list of snippets is available in the Toolbox:

[ ]

When typing in the editor, snippets appear in the code completion list, where they can be selected to inject the associated code into the editor, as shown below for the snippet that injects an enum:

[ ]

#### Code suggestions

Xamarin Studio is able to suggest changes to your code which either simplify or optimize the code. When the IDE finds such a change, a blue box will appear under the code that can potentially be changed. Placing the mouse on the line produces a pop up explaining the change.

[ ]

Selecting either option will change the code accordingly. If no change is required, click anywhere on the editor window or press the Escape key on the keyboard.

Unified Search

Xamarin Studio includes unified search capability that searches a solution’s types and files as well as available commands. Matching results are grouped into the following sections:

  • Top Result – Shows the top matching result for the search string.
  • Solution – Shows a list of matching types within the solution.
  • Files – Shows a list of matching files for the search string.
  • Commands – Shows a list of available commands for the search string.

The following screenshot show the result of searching for the string “app” in a solution:

[ ]

Selecting an item in the result list navigates to that item in the editor.

Assembly Browser

Xamarin Studio also includes an Assembly Browser for navigating types in any referenced assembly. Double-clicking on an assembly from the Solution Pad loads it into the Assembly Browser.

For example, the following screenshot shows the MonoTouch assembly loaded in the Assembly Browser:

[ ]

Assembly Search

The Assembly Browser also supports search with auto-complete. For example, typing CAD in the search box displays the following types:

[ ]

The Assembly Browser is also integrated with the code editor, where selecting Go to declaration on a type that exists in a referenced assembly will navigate to that type in the Assembly Browser. For example, the following shows the Assembly Browser with the UIWindow loaded after it was selected in the code editor:

[ ]

Debugging

Xamarin Studio includes integrated debugging for both iOS and Android projects on simulators and emulators respectively, as well as on devices. The debugger includes the following windows:

  • Watch – Allows variables to be added for inspecting values.
  • Locals – Inspects values of locally declared variables.
  • Breakpoints – Manage breakpoints in the project.
  • Threads – View running threads.
  • Call Stack – Lists and navigates the call stack.
  • Immediate – Evaluation of expressions.

The following image shows the debugger stopped at a breakpoint with the inline watch popup displayed when hovering over a variable.

[ ]

Source Control Integration

Xamarin Studio integrates with Git and Subversion source control systems. Projects under source control are denoted with an annotation on their icons in the Solution Pad, as shown below:

[ ]

For a project under source control, the context menu of the item in the Solution Pad will have its Version Control menu enabled, showing various commands, as shown below:

[ ]

Also, the main menu’s Version Control menu includes a variety of additional command for working with source control:

[ ]

Differences, History and Merging

To inspect differences in the selected file, change history and perform merges, several buttons at the bottom of the editor area are available. For example, the following screenshot shows the differences between a local source file and the latest committed version:

[ ]

Native Platform Integration

Xamarin Studio features integration with native platform tools for both iOS and Android. This allows using various code-signing, deployment, and diagnostics tools.

Tools Menu

The following screenshots shows the iOS Tools menu in Xamarin Studio:

[ ]

Under the Tools menu, there are several items that launch native platform tools, including:

  • Instruments – iOS diagnostics tool.
  • Application Loader – iOS utility that assists in preparing apps for sale in the iTunes App Store.
  • AVD Manager – Android utility to manage emulators.

Info.plist

In addition to source code editing, the tabbed interface includes support for certain platform specific files. For example, when opening an Info.plist file, which is used by iOS applications to store various configuration data, the following user interface is presented to allow easy editing of the file:

[ ]

iOS Designer

The iOS Designer is fully integrated with Xamarin studio and enables visual editing of .storyboard files. The entire user interface can be built using drag-and-drop functionality between the Toolbox and Design Surface, while using a much more intuative approach to handling events. The iOS Designer also supports custom controls with the added benefit of design-time rendering.

[ ]

For more information on using the iOS Designer, refer to the Designer documents.

Android Designer

For Android applications, Xamarin Studio includes its own designer, which works with Android .axml files to visually construct user interfaces. Xamarin Studio will open these files in its Android designer, as shown below:

[ ]

For more information on the Android designer see the Designer Overview document.

Summary

This document presented various parts of Xamarin Studio. If showed the areas of the IDE used for file management such as the Solution Pad and Version Control integration. It also exhibited the rich source code editor, search, code completion, and code navigation features that make working with a complex code base a breeze. Finally, it introduced features for integrating with native platform tools on both iOS and Android.