Pad selected lines to cursor position in VSCode

Question

In Visual Studio 2019, I can use Alt+Shift+(Arrow Keys) to multi-line edit the "virtual" whitespace then press any key to make all the lines padded with space to the selected column, I use this a lot to make initialization code easier to read. However, when I switched to Visual Studio Code, I could not find the equivalent. The closest thing I was able to find was Ctrl+Alt+(Arrow Keys). This is not quite what I need since it only places each line cursor at the end instead of the "virtual" whitespace in the previous example.

Here's a visual example in Visual Studio 2019 (I don't know how to make GIFs):

Is there any equivalent in VSCode or am I stuck without it for now?

Answer 1

Good question, I couldn't find a way to do the same in VScode, but here's a little hack to get the same effect:

• Ctrl+Alt+(Arrow Keys) all of the lines
• End button
• Tab over, so the furthest cursor to the left is where you want it
• Escape
• Ctrl+Alt+(Arrow Keys) all of the lines again

Obviously it's not as nice of a work-flow.. but it works. You could also look into VScode extensions, to make this faster or make your own

Answer 2

You can do this fairly well with a macro. Using a macro extension like multi-command put this into your settings.json:

"multiCommand.commands": [

  {
    "command": "multiCommand.padTrailingSpaces",
    "sequence": [
      "editor.action.insertCursorAtEndOfEachLineSelected",
       "cursorHomeSelect",
      {
        "command": "editor.action.insertSnippet,

                       // pad end of each line with lots of spaces's'
        "args": {
          "snippet": "$TM_SELECTED_TEXT                                              ",
        }
      },

      "cursorHomeSelect",
      {
        "command": "editor.action.insertSnippet",  
        "args": {

          // keep first 30 characters, increase if you typically need more
          "snippet": "${TM_SELECTED_TEXT/(.{30}).*/$1/g}",  
        }
      }
    ]
  }
]

The above puts a cursor at the end of each line, adds way more spaces than you should ever need, and then keeps only the first 30 characters on each line.

Choose some keybinding (in keybindings.json):

{
  "key": "alt+s",
  "command": "extension.multiCommand.execute",
  "args": { "command": "multiCommand.padTrailingSpaces" },
  "when": "editorTextFocus" 
},

---

First select all the lines you want padded, than trigger your keybinding. Then al least you have all the cursors lined up with padding and it is easy to go left or right with all of them at once.

You probably can reduce the 30 that I use just for demonstration purposes by a some - depends on how long your longest line usually is.