如何将Visual Studio Code中的面板移动到右侧？

Question

默认情况下，它在底部。

例如，在以下图片中，组件（第D节）位于底部，但我想将其移动到右侧区域，即在编辑器组（第C节）中显示README.md编辑器的区域。

图片来源：(https://code.visualstudio.com/images/codebasics_hero.png)

- 1c.

---

滚动条的背景颜色不是实心的，结果是... - MCunha98

您应该更新这个问题以接受 @dcastro 的答案。当前被接受的答案已经过时了。 - jmargolisvt

另请参见https://dev59.com/KcDqa4cB1Zd3GeqPiKQD#69329503，以创建另一个面板，类似于侧边栏，但位于当前侧边栏的对面 - 并且与面板分开。 - Mark

从v1.64开始，(底部)面板和侧面板将保持原位，您可以在它们之间移动"视图"(调试、问题、输出、终端、搜索)。 - Denis Howe

@Denis：我刚刚花了半个小时尝试将终端显示在左侧，而不是底部（似乎是新的默认设置）或右侧。最终我成功了，但我不确定我是怎么做到的。远程工作似乎需要你保持一个“安装”程序运行，除了终端本身。这个新系统在我看来是一场灾难（显然不是你的错！）。无论如何，你能多说一点关于如何重新定位终端吗？我认为你可以把它变成一个“答案”，而不仅仅是一个评论。 - Mike Maxwell

查看标题 > 右键单击 > 将视图移动到侧面板 - Denis Howe

Answer 1

截至2018年10月（版本1.29），@mvvijesh的答案中的按钮已不再存在。

现在您有两个选项。 右键单击面板工具栏（面板上其他任何位置都不起作用），然后选择“将面板移动到右侧/底部”： 或者从命令面板中选择“查看：切换面板位置”。

来源：VSCode更新说明：https://code.visualstudio.com/updates/v1_29#_panel-position-button-to-context-menu

- dcastro

---

值得一提的是，右键点击必须在面板的工具栏上执行。（在其他任何地方点击都没有用。） - customcommander

很烦人。不断变化。 - see sharper

谢谢！这件事让我很烦恼。为什么他们在1.29.1版本中删除了按钮？它之前与Chrome的开发工具一致，现在却不一样了。 - colefner

提醒您正在使用微软产品：它并没有坏，但他们肯定会继续优化它。 - mkvlrn

@shashwat 是的，打开键盘快捷方式并搜索 workbench.action.togglePanelPosition。您可以添加一个键盘快捷方式来在面板位置之间进行切换。 - Jake Bathman

Answer 2

对于寻找答案的人（如何移动侧边栏）：

您可以按下

ctrl + ,（或在OSX上为cmd + ,）

并将以下选项添加到您的用户设置JSON文件中：

"workbench.sideBar.location": "right"

- Forres

---

OP指的是底部面板，而不是左侧边栏。 - steph643

@steph643在标题中没有明确指出他所指的面板。虽然他的问题很好地澄清了这一点，但搜索结果中显示的是标题。这个答案回答了我的问题。往往我们忘记了对于寻找答案的大众而言，是谷歌引领我们找到正确答案的地方，直到我们找到一个没有被某些高压和目光短浅的管理员拒绝的正确答案。他们总是要求答案准确无误地站立并向他们的敏锐表示敬意。 - hawkeyegold

@forres，能否将面板浮动并移动到单独的监视器上？这是我在使用VS时的常规设置-代码在左侧，所有面板在右侧。更改侧边栏的锚点（左/右）不会改变文本编辑器可见的程度。 - Darius

太棒了兄弟，点赞！ - John

我同意@hawkeyegold的看法 - 尽管答案明显没有回答OP的意图，但它非常有帮助，因为我在与Forres完全相同的问题上也搜索了这个问题 - 希望移动工作台侧边栏。非常感谢！ - Per Lundberg

因为这个回答令人困惑并阻碍了寻找正确答案，所以遭到了负评。作者询问如何移动“面板”，而不是侧边栏。正确答案由Stefano提供： "workbench.panel.defaultLocation": "right"。 - Barabas

Answer 3

我在Mac上使用Visual Studio Code v1.24.0。

默认情况下，面板将出现在底部（您也可以更改默认设置。请参阅@Forres的答案：将Visual Studio Code中的面板移动到右侧）

这是VS Code面板的底部/右侧切换按钮：

点击此按钮后，面板会移动到右侧。

不过，将其移回有点棘手。正如您所看到的，一些按钮被隐藏了。这是因为当面板向右对齐时，它的宽度太小了。我们需要扩展列以查看所有按钮。

扩展后的效果如下：

现在，如果您想将面板移回底部，请再次单击切换底部/顶部按钮。

- mvvijesh

---

这太令人困惑了。底部被隐藏了，还有另一个看起来完全一样的地方。用户体验很差。 - Alex Bollbach

非常感谢您提供的隐藏按钮 :D 它真的节省了我很多时间。 - Ken Block

您可以打开命令面板并使用“View: toggle panel position”来切换面板位置。 - protoEvangelion

对我来说，那个图标似乎不在了。无论面板在底部还是右侧，即使面板足够宽，都没有出现。我需要右键单击面板标题才能将其移动到右侧或底部。这很糟糕。 - oyalhi

@oyalhi，最新的 Visual Studio Code（版本1.32.3）中正确的答案似乎是“查看->外观->切换面板位置”，就像@protoEvangelion所提到的那样。 - Subhash

Answer 4

点击菜单选项 View > Appearance > Move Side Bar Right 或者在 settings.json 文件中：

"workbench.panel.defaultLocation": "right"

- Stefano

---

OP指的是底部面板，而不是工作台面板。工作台面板包含文件浏览器、扩展等。不幸的是，它们都被称为“___面板”，因此很容易产生混淆。 - Jason

我认为你在想的是workbench.sideBar.location。除非我复制时出错了，否则我的评论是正确的。然后我注意到现在有一个新按钮可以将其移动到侧边栏或底部。 - Stefano

这是最佳答案。它将我的终端（底部）面板移动到了右侧，正如我所需的那样。完全符合原帖的要求。谢谢！ - Tyler Davis

需要先关闭现有的终端，然后按 CTRL + ` 将它们显示在右侧。 - Aditya Kresna Permana

Answer 5

点击菜单选项 查看 > 外观 > 移动到侧边栏右侧。一旦侧边栏移动到右侧，选项“将侧边栏移到左侧”将变为“将侧边栏移到右侧”。

- user8079583

---

这已经不存在了。 - pmiranda

这个选项已经移到了“视图” > “外观” > “将侧边栏移动到右侧/左侧”。 - jkmartindale

Answer 6

在版本1.55.2中。 进入“查看”-->“外观”-->“将面板向右移动”。

- Manish

---

这对我来说很有效，简短而美好！ - Dayán Ruiz

也适用于1.62版本。 - Debashish

Answer 7

截至2019年6月，此设置可以通过搜索“面板”找到-如果您想更改默认设置，则有一个选项，如屏幕截图所示：

- NickersF

---

JSON 中的设置是 "workbench.panel.defaultLocation": "right"。 - williamli

正是我正在寻找的！谢谢。 - Vincent

Answer 8

对于 Visual Studio Code v1.31.1 版本，您可以通过视图菜单切换面板会话。

• 转到视图菜单。
• 通过外观选项，单击切换面板位置

- Mel Michael

Answer 9

希望这能帮到某些人。

-> 开启键盘快捷方式

-> 搜索“workbench.action.togglePanelPosition”

-> 分配您想要的快捷方式

我已经分配了按键绑定“cmd+`”

{
  "key": "cmd+`",
  "command": "workbench.action.togglePanelPosition"
}

现在我可以通过按下“cmd + `”来切换终端

- sh6210

---

在我的OSX上，终端在我执行此操作后失去了焦点，这对我来说很奇怪。 - Daniel Lizik

@DanielLizik，现在VSCode有一个选项“View-->Appearance-->Move Panel ___”。 - sh6210

Answer 10

VSCode 1.42（2020年1月）引入了以下功能：

Panel on the left/right

The panel can now be moved to the left side of the editor with the setting:

"workbench.panel.defaultLocation": "left"

This removes the command View: Toggle Panel Position (workbench.action.togglePanelPosition) in favor of the following new commands:

• View: Move Panel Left (workbench.action.positionPanelLeft)
• View: Move Panel Right (workbench.action.positionPanelRight)
• View: Move Panel To Bottom (workbench.action.positionPanelBottom)

- VonC

---

对我来说，我必须重新启动VSCode才能看到更改。 - Chuan

@Chuan 好的。对我来说，我正在等待VSCode 2020年5月版1.46：https://github.com/microsoft/vscode-docs/blob/d5787d62216069e0b66b77c9470bb2d093c60e59/release-notes/v1_46.md#workbench - VonC