Home / Learn / Using Code Snippets In Visual Studio Mac

Using Code Snippets In Visual Studio Mac

Write less boilerplate code with your own customised code snippets in Visual Studio Mac.

Introduction

As software developers, it's inevitable that we'll end up writing repetitive, boilerplate code that's necessary for our applications to function.

Let's step into the shoes of a Xamarin.Forms developer and think about the repetitive code we write for our view models...

The most common code we might write for a Xamarin.Forms app is view model properties. View model properties often have a public facing property with a backing field, that triggers a property changed event. It might look a little like this:

private string message;
public string Message
{
  get
  {
    return message;
  }
  set
  {
    SetProperty(value, ref message, nameof(Message));
  }
}

After writing a few of these properties by hand, you'll probably get an itch to make this workflow a tad less repetitive.

Luckily, Visual Studio Mac has a solution for us: code snippets!

A code snippet is block of templated text that includes named arguments that are substituted when inserted by a developer. If we created a code snippet for our view model property, it'd look something like this:

private $type$ $field$;
public $type$ $property$
{
  get
  {
    return $field$;
  }
  set
  {
    SetProperty(value, ref $field$, nameof($property$));
  }
}

Each section of code to be replaced is surrounded with a $ symbol and represents an argument the developer can control. In the above code snippet, we have:

  • A $type$ argument to control the property type.
  • A $field$ argument to control the field name.
  • A $property$ argument to control the property name.

So how do we create and use our own code snippets?

Creating A Code Snippet

In Visual Studio Mac we manage our code snippets in the Code Snippets panel in Visual Studio Macs Preferences window. Here we can add, delete and edit code snippets for any language that Visual Studio Mac supports.

To access the Code Snippet editor, go to the top Visual Studio menu and choose Preferences.

Under Text Editor, select Code Snippets.

Let's create a code snippet by clicking on the Add button and entering the following information:

Visual Studio Macs code snippet editor

  • Shortcut: The shortcut for the code snippet that appears in IntelliSense.
  • Group: The code snippet group. This is the folder this snippet appears inside in the Code Snippet preferences panel.
  • Description: A description of the code snippet. This will appear in tooltips in IntelliSense.
  • Mime: The mime-type of the language this code snippet supports.
  • Template Text: The code snippet content.

Inserting Code Snippets

Now that we've got our code snippet setup, let's learn how to apply it to our codebase.

First, open up one of your view models and then move the caret to where you want to insert the new view model property.

Next, type out the full shortcut name of your code snippet, move the caret to the end of the snippet name and then pressing Tab.

This inserts the code snippet and starts an editing session for you to set the value of each argument.

To change the value of an argument, double-click on a highlighted argument span and start editing it.

Finally, to finish inserting a code snippet, press Escape.

This is what it looks like when we insert and edit our view model property code snippet:

Inserting a code snippet in Visual Studio Mac

Over the course of our application using code snippets can save us tonnes of work!

Summary

Code snippets are both easy to setup and easy to use!

By using code snippets, we can improve our productivity by eliminating repetitive work.