How to automatically format XAML code in Visual Studio?

Question

Here:

https://social.msdn.microsoft.com/Forums/de-DE/b77c7529-298f-4b9a-874a-f94f699986ac/automatically-formatting-xaml-code?forum=vswpfdesigner

... it is written that one can use "Ctrl+K+D" ... but that didn't work.

I also tried "shift + alt + F", which was suggested here:

How do you format code in Visual Studio Code (VSCode)

... it didn't work either.

So my question is: how can you automatically format XAML code in Visual Studio?

This issue was noted here: github.com/dotnet/roslyn/issues/16899 where it was suggested to report an issue using the VS feedback tool. I don't know if the OP of that post had done so, but FWIW I have. — StayOnTarget
– StayOnTarget, Commented Jul 9, 2018 at 11:40

stanimirsp · Accepted Answer · 2020-06-18 05:45:18Z

189

Probably your formatting options are wrong, go to: Tools -> Options -> Text Editor -> XAML -> Formatting -> Spacing and on Attribute Spacing section click "Position each attribute on a separete line" and then try "Ctrl+K+D" again.

edited Jun 18, 2020 at 5:45

answered Mar 17, 2019 at 8:56

stanimirsp

3,2162 gold badges30 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Emperor Eto Over a year ago

Wow this is an amazing tip. I don't understand why this isn't the default though. (At least it wasn't for me).

John Glen Over a year ago

This does not fix tabs

Johnson Over a year ago

Good find! Would not have expected the default to preserve any spaces between attributes like in a verbatim style.

27k1 Sep 23 at 8:08

Brilliant tip, works a treat

David Grochocki · Accepted Answer · 2017-09-11 04:09:13Z

I would check out XAML Styler, which is a Visual Studio extension to help format your XAML source code (full disclosure, I am one of the owners on the project).

Edit: Forgot to mention that Visual Studio does not have a very rich set of XAML formatting capabilities on its own.

Vimal Saifudin · Accepted Answer · 2018-06-11 20:13:24Z

12

Shortcut key for XAML formatting in Visual Studio for Mac machines: Ctrl+I

answered Jun 11, 2018 at 20:13

Vimal Saifudin

1,8551 gold badge22 silver badges28 bronze badges

Comments

Wahyu · Accepted Answer · 2019-07-11 12:39:24Z

11

In case you guys still don't know how...

It's called 'Format Document', you can find it inside menu:

Edit => Advanced => Format Document

There is also shortcut for it:

Ctrl+E then Ctrl+D

This works for most document, including XAML.

EDIT: When this post was made, I was using VS 2017

edited Jul 11, 2019 at 12:39

answered Jun 10, 2018 at 14:28

Wahyu

5,1192 gold badges21 silver badges23 bronze badges

6 Comments

StayOnTarget Over a year ago

This does nothing in XAML VS2015 when I try it. In my menu it is shown as ^K^D which is mentioned in the original question and is noted not to work.

GHauan Over a year ago

Worked for me as well.

Lucas Over a year ago

in VS 2019 this menu option doesn't exist when in a xaml file. :(

Sheridan Over a year ago

This works in VS2019 now, at least, if not before.

Grault Over a year ago

Does not work for me in VS2022, maybe because of configuration differences? I ended up using an extension to fill the gap.

|

Kacper Stachowski · Accepted Answer · 2017-09-11 08:58:11Z

I use Xaml Formatter. Works pretty good for me. You will just have to assign code formatting with Xaml Formatter to a Ctrl+K Ctrl+D shortcut in Xaml files, since it is not done by default (it's creating Format Xaml option in Tools menu).

Also Inline Color Picker is a very simple but extremely useful extension if you are developing a lot of Xaml code.

Stepan Zakharov · Accepted Answer · 2024-02-21 10:12:17Z

I prefer to keep a tag with few attributes on a single line, but a tag with many attributes on multiple lines (each attribute on a separate line, as in stanimirsp's answer).

To doing so, I ended up with disabling of auto-formatting and using of hotkeys.

To disable auto-formatting, open Tools / Options / Text Editor / XAML / Formatting / General and uncheck all Auto-Formatting events.

Formatting hotkeys

To format selection or tag under cursor: Ctrl + K + F;
To format whole document: Ctrl + K + D.

Community · Accepted Answer · 2022-02-04 05:23:22Z

For anyone who is searching for kind of combining "Insert a single space between attributes" and "Position each attribute on a seperate line" I found this solution:

Tools -> Options -> Text Editor -> XAML -> Formatting -> General -> Tag Wrapping

and tick "Wrap tags that exceed specified length".

Self-explanatory that one can adjust the length in the following input field.

mxmissile · Accepted Answer · 2020-02-17 15:37:27Z

0

Try using "XML Tools" for VS Code, the shortcut is Alt + Shift + F

edited Feb 17, 2020 at 15:37

mxmissile

11.7k6 gold badges57 silver badges85 bronze badges

answered Feb 7, 2019 at 10:49

user3916810

411 silver badge8 bronze badges

Collectives™ on Stack Overflow

How to automatically format XAML code in Visual Studio?

8 Answers 8

4 Comments

Comments

Comments

6 Comments

Comments

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

8 Answers 8

4 Comments

Comments

Comments

6 Comments

Comments

Comments

Comments

Comments

Linked

Related