Problem solve Get help with specific problems with your technologies, process and projects.

Setting up the XAML editor in Visual Studio 2010

Nothing stirs up controversy like discussing naming conventions or code styling. Learn some configuration settings for the XAML editor in Visual Studio 2010.

Nothing stirs up controversy like discussing naming conventions or code styling with your fellow programmers. Don't believe me? Try starting a conversation about the correct way is to use curly braces in C# or Java and see where it gets you. With that in mind I like to show you some of my favorite configuration settings for the XAML editor in Visual Studio 2010.

Setting the Options
All the settings in this article are available in the Tools/Options menu. In the Options Dialog, scroll down until you see the Text Editor section then open the XAML node.

Single or Double Quotes
OK, I admit that this is a personal bias, but I prefer single quotes for my XAML attributes. I think they're slightly easier to read over double quotes. If you agree, you can setup Visual Studio 2010 to automatically enter single quotes for you. In the Options dialog choose the Formatting-General node and then select the Single quotes radio button.

Auto arranging your XAML attributes
I prefer a tidy vertical arrangement of XAML elements/attributes in my files. Visual Studio is happy to accommodate my preferences. If you prefer a different auto-arrangement pattern there are two other settings to choose from. Once you have your preferred setting, Visual Studio can apply them at you beck and call.

How do you apply the formatting to your XAML file in Visual Studio? My favorite way to do it is to use the Visual Studio keystroke combination: Ctrl-K, Ctrl-D, but you can also use the Edit menu if you prefer.

Here is a raw XAML file which is starting point to demonstrate the auto-arrange features. As you can see the XAML for the element is hard to read, the attributes are arranged in a haphazard manner and scattered across multiple lines.

The Settings
There are three auto-arrange features (called Attribute Spacing in the options dialog) that can be configured to improve the layout of this XAML.

Hands off my code: Do you find it annoying when Visual Studio rearranges your XAML or XML? If so the "Preserve newlines and spaces between attributes" setting is for you. It does just what it says it will do, leave your code looking exactly the way you typed it into the editor.

Tidy up my XAML please: This is the default setting in Visual Studio. It's called the "Insert a single space between attributes" setting and it arranges all your XAML onto a single line.

Make it even tidier: Studies show that reading horizontally is about 30% slower than reading vertically. Even without scientific confirmation of this fact I can testify that I find it easier to read and comprehend my XAML if it's stacked vertically. So I choose the "Position each attribute on a separate line" setting.

There is one more setting we should talk about though I don't prefer it. It's the "Position first attribute on the same line as start tag" checkbox. This setting is self-explanatory ; here's the result of applying the setting.

Removing blank Lines
Visual Studio also has settings for removing blank lines in your code and XAML files.

I encourage you to experiment with the Elements Spacing settings to see which one you like. The setting names are clear and understandable so you shouldn't have any trouble grasping what each one does. Just in case you're curious my favorite is the one selected in the screenshot.

Dig Deeper on Visual Studio Tools for Office (VSTO)

Start the conversation

Send me notifications when other members comment.

Please create a username to comment.