VSCode自定义快捷键和添加自定义快捷键按键到状态栏

news/2025/2/26 2:39:16

VSCode自定义快捷键和添加自定义快捷键按键到状态栏


📄在VSCode中想实现快捷键方式执行与某些指令操作进行绑定,可以通过配置组合式的键盘按键映射来实现,另外一种方式就是将执行某些特定的指令嵌入在面板菜单上,在想要执行的时候,鼠标点击对应按键图标即可实现操作。

📘VSCode自定义快捷键方法

  • 打开命令面板(快捷键 Ctrl+Shift+P)。

  • 搜索并选择“Preferences: Open Keyboard Shortcuts (JSON)”。
    在这里插入图片描述

  • keybindings.json 文件中添加自定义快捷键,例如:我这里配置的是Raspberry Pi Pico插件中的SWD下载程序用的快捷键

// 将键绑定放在此文件中以覆盖默认值
[

{
    "key": "ctrl+shift+enter",
    "command": "raspberry-pi-pico.flashProject",
    "when": "raspberry-pi-pico.isPicoProject"
}
]


  • 对应的命令:
    在这里插入图片描述

当程序编译好后,可以直接使用快捷键进行程序烧录操作。

  1. “key”: “ctrl+shift+enter”
    含义:这部分定义了触发对应命令的快捷键组合。在 Windows 和 Linux 系统中,当用户同时按下 Ctrl、Shift 和 Enter 这三个键时,VS Code 会尝试执行与之绑定的命令。在 macOS 系统中,Ctrl 会对应为 Command 键(前提是未对 VS Code 的按键映射进行特殊修改)。
    用途:为用户提供了一种快速触发特定操作的方式,避免了通过菜单或命令面板来执行命令,提高了操作效率。
  2. “command”: “raspberry - pi - pico.flashProject”
    含义:指定了按下上述快捷键组合时要执行的具体命令。raspberry - pi - pico.flashProject 是一个特定的命令标识符,通常由扩展(这里是 Raspberry Pi Pico 扩展)定义。这个命令可能用于将项目代码烧录到 Raspberry Pi Pico 开发板上。
    用途:将快捷键与特定的功能操作关联起来,当用户按下指定快捷键时,VS Code 会查找并执行该命令对应的逻辑。
  3. “when”: “raspberry - pi - pico.isPicoProject”
    含义:这是一个条件表达式,用于指定在何种情况下该快捷键绑定才会生效。raspberry - pi - pico.isPicoProject 是一个由 Raspberry Pi Pico 扩展定义的上下文条件,只有当当前项目被识别为 Raspberry Pi Pico 项目时,按下 Ctrl + Shift + Enter 组合键才会触发 raspberry - pi - pico.flashProject 命令。
    用途:通过设置条件,可以避免在不相关的场景下误触发快捷键,提高快捷键使用的准确性和针对性。例如,如果当前打开的不是 Raspberry Pi Pico 项目,按下这个快捷键组合将不会执行烧录操作。
  • 需要执行的command可以在对应安装的插件目录里对应的package.json文件中找到所有命令的名称定义。这里以我的电脑安装的raspberry-pi-pico插件为例:
  • 插件安装位置:(以最新插件版本位置为准)
C:\Users\Administrator\.vscode\extensions\raspberry-pi.raspberry-pi-pico-0.17.4\package.json

在这里插入图片描述

  • 在成员对象(contributes)中,找到成员对应的命令(commands):
"contributes": {
		"commands": [
			{
				"command": "raspberry-pi-pico.newProject",
				"title": "New Pico Project",
				"category": "Raspberry Pi Pico"
			},
			{
				"command": "raspberry-pi-pico.switchSDK",
				"title": "Switch Pico SDK",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject"
			},
			{
				"command": "raspberry-pi-pico.switchBoard",
				"title": "Switch Board",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject"
			},
			{
				"command": "raspberry-pi-pico.launchTargetPath",
				"title": "Get path of the project executable",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getPythonPath",
				"title": "Get python path",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getEnvPath",
				"title": "Get environment path",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getGDBPath",
				"title": "Get GDB path",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getCompilerPath",
				"title": "Get compiler path",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getCxxCompilerPath",
				"title": "Get C++ compiler path",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getChip",
				"title": "Get Chip",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getChipUppercase",
				"title": "Get Chip Uppercase",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getTarget",
				"title": "Get OpenOCD Target",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.getPicotoolPath",
				"title": "Get Picotool path",
				"category": "Raspberry Pi Pico",
				"enablement": "false"
			},
			{
				"command": "raspberry-pi-pico.compileProject",
				"title": "Compile Pico Project",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject"
			},
			{
				"command": "raspberry-pi-pico.runProject",
				"title": "Run Pico Project (USB)",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject"
			},
			{
				"command": "raspberry-pi-pico.clearGithubApiCache",
				"title": "Clear GitHub API cache",
				"category": "Raspberry Pi Pico"
			},
			{
				"command": "raspberry-pi-pico.conditionalDebugging",
				"title": "Conditional Debugging",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject && !inQuickOpen"
			},
			{
				"command": "raspberry-pi-pico.debugLayout",
				"title": "Debug Layout",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject"
			},
			{
				"command": "raspberry-pi-pico.openSdkDocumentation",
				"title": "Open SDK Documentation",
				"category": "Raspberry Pi Pico"
			},
			{
				"command": "raspberry-pi-pico.configureCmake",
				"title": "Configure CMake",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject"
			},
			{
				"command": "raspberry-pi-pico.switchBuildType",
				"title": "Switch Build Type",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject"
			},
			{
				"command": "raspberry-pi-pico.importProject",
				"title": "Import Pico Project",
				"category": "Raspberry Pi Pico"
			},
			{
				"command": "raspberry-pi-pico.newExampleProject",
				"title": "New Example Pico Project",
				"category": "Raspberry Pi Pico"
			},
			{
				"command": "raspberry-pi-pico.uninstallPicoSDK",
				"title": "Uninstall Pico SDK",
				"category": "Raspberry Pi Pico"
			},
			{
				"command": "raspberry-pi-pico.flashProject",
				"title": "Flash Pico Project (SWD)",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject"
			},
			{
				"command": "raspberry-pi-pico.cleanCmake",
				"title": "Clean CMake",
				"category": "Raspberry Pi Pico",
				"enablement": "raspberry-pi-pico.isPicoProject && !raspberry-pi-pico.isRustProject"
			}
		],

在以上包含的成员-命令都可以设置对应的快捷键。

📗添加自定义快捷键按键到状态栏

有时候插件安装好后,在VScode界面底部状态栏上没有我们所需要的快捷键按键图标,但是在进入插件里面,是带有相关操作的快捷命令的,此情况下就可以自己添加快捷键按键到VSCode状态栏上。

添加方法

这里我还是以上面的raspberry-pi-pico插件中的SWD烧录快捷键命令图标,进行添加。

  • 找到插件最新版本的安装目录,配置状态栏上内嵌的快捷键插件图标定义是在extension.cjs文件中。
C:\Users\Administrator\.vscode\extensions\raspberry-pi.raspberry-pi-pico-0.17.4\dist\extension.cjs
  • 搜索关键字StatusBarItemKey,定位到VSCode状态栏内嵌快捷键按键定义的地方。
var StatusBarItemKey;
(function (StatusBarItemKey) {
    StatusBarItemKey["compile"] = "raspberry-pi-pico.compileProject";
    StatusBarItemKey["run"] = "raspberry-pi-pico.runProject";
	StatusBarItemKey["swd"] = "raspberry-pi-pico.flashProject";/*添加自己想要的快捷键按键到VSCode状态栏上的指令*/
    StatusBarItemKey["picoSDKQuickPick"] = "raspberry-pi-pico.sdk-quick-pick";
    StatusBarItemKey["picoBoardQuickPick"] = "raspberry-pi-pico.board-quick-pick";
})(StatusBarItemKey || (StatusBarItemKey = {}));
const STATUS_BAR_ITEMS = {
    [StatusBarItemKey.compile]: {
        // alt. "$(gear) Compile"
        text: "$(file-binary) Compile",
        command: "raspberry-pi-pico.compileProject",
        tooltip: "Compile Project",
    },
    [StatusBarItemKey.run]: {
        // alt. "$(gear) Compile"
        text: "$(run) Run",
        command: "raspberry-pi-pico.runProject",
        tooltip: "Run Project",
    },
    /*添加自己想要的快捷键按键到VSCode状态栏上的指令*/
	    [StatusBarItemKey.SWD]: {
        // alt. "$(gear) Compile"
        text: "$(swd) SWD"
        command: "raspberry-pi-pico.flashProject",
        tooltip: "SWD Project",
    },
    [StatusBarItemKey.picoSDKQuickPick]: {
        text: "Pico SDK: <version>",
        command: "raspberry-pi-pico.switchSDK",
        tooltip: "Select Pico SDK",
    },
    [StatusBarItemKey.picoBoardQuickPick]: {
        text: "Board: <board>",
        command: "raspberry-pi-pico.switchBoard",
        tooltip: "Select Board",
    },
};
  1. 定义枚举类型 StatusBarItemKey
    var StatusBarItemKey;:声明一个变量 StatusBarItemKey,用于后续存储枚举对象。
    (function (StatusBarItemKey) {… })(StatusBarItemKey || (StatusBarItemKey = {}));:这是一个立即执行函数表达式(IIFE)。它的作用是创建一个局部作用域,避免变量污染全局作用域。
    StatusBarItemKey || (StatusBarItemKey = {}):如果 StatusBarItemKey 已经存在,则使用它;否则,将其初始化为一个空对象。
    在函数内部,为 StatusBarItemKey 对象添加了多个属性,这些属性作为枚举成员,每个成员都有一个对应的字符串值,这些值通常是 VSCode 命令的标识符。
  2. 定义状态栏项目对象 STATUS_BAR_ITEMS
    const STATUS_BAR_ITEMS = {... };:定义一个常量对象 STATUS_BAR_ITEMS,用于存储状态栏项目的详细信息。
    [StatusBarItemKey.compile]、[StatusBarItemKey.run] 等:使用计算属性名,将 StatusBarItemKey 枚举中的成员作为对象的属性名。
    每个属性对应一个对象,包含以下三个属性:
    text:状态栏项目显示的文本内容,$(...) 是 VSCode 的图标语法,用于在文本中显示图标。
    command:点击状态栏项目时要执行的 VSCode 命令的标识符。
    tooltip:鼠标悬停在状态栏项目上时显示的工具提示信息。
    总结
  • 其他插件的状态栏快捷键按键添加方法,应该也和这个类似,找到对应的StatusBarItemKey地方,按照现有的指令快捷键按键,依葫芦画瓢的方式补充添加即可。
  • 添加成功后,重启VSCode,打开对应的工程时,所添加的图标会显示在状态栏上:
    在这里插入图片描述

🛠自定义修改系统栏插件命令图标和内容方法

  • ✨此功能修改仅限于插件不更新的情况下有效,如果插件进行了更新,原来所修改的文件内容会失效,VSCode会调用最新版本的内容,只将原来旧版本对应文件修改的内容复制粘贴到新版本的插件文件内即可生效。
  • 🌿修改的属性内容:
 [StatusBarItemKey.SWD]: {
        // alt. "$(gear) Compile"
        text: "$(swd) SWD",
        command: "raspberry-pi-pico.flashProject",
        tooltip: "CMSIS-DAP Project",
    },
  • 🔬对应的状态栏图标显示内容效果:tooltip属性值,影响鼠标移动到对应图标上所显示的内容提示信息)
    在这里插入图片描述
  • 🌿修改显示名称: text: "$(file-binary) Compile",修改为成: text: "$(file-binary) Build",
    [StatusBarItemKey.compile]: {
        // alt. "$(gear) Compile"
        text: "$(file-binary) Build",
        command: "raspberry-pi-pico.compileProject",
        tooltip: "Compile Project",
    },
  • 显示效果:(原来的Compile字符显示换成Build
    在这里插入图片描述
  • 🌟增加图标显示效果:(带图标显示效果的状态栏快捷键按键图标)
  [StatusBarItemKey.SWD]: {
        // alt. "$(gear) Compile"
        text: "$(debug-step-into) SWD",
        command: "raspberry-pi-pico.flashProject",
        tooltip: "CMSIS-DAP Project",
    },
  • 显示修改:(debug-step-into代表在SWD前面所显示的图标符号)
    在这里插入图片描述

📒显示或隐藏对应的插件快捷键图标方法:

在状态栏上右键,找到对应的插件扩展,前面打钩的选项就是显示出来的,没有打钩的就不会显示在状态栏上。可以很方便的管理状态栏上的显示快捷键,将一些不常用无关紧要的快捷功能按键图标隐藏掉,简洁VSCode状态栏显示界面。

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

  • 🎉显示图标其相关图标代码和对应图标的显示效果可以参考下面的网址:
https://code.visualstudio.com/api/references/icons-in-labels

📑插件更新文件补充说明

  • 如果插件一旦更新版本,原来在旧版本上的修改将失效,需要将原来在就版本上修改的内容重新移植到新版当中的对应文件中。
  • 插件迭代版本:
    在这里插入图片描述
  • l例如在原来版本:C:\Users\Administrator\.vscode\extensions\raspberry-pi.raspberry-pi-pico-0.17.4\distextension.cjs做的修改,插件更新后,需要在C:\Users\Administrator\.vscode\extensions\raspberry-pi.raspberry-pi-pico-0.17.5\distextension.cjs中相同位置做添加修改。

http://www.niftyadmin.cn/n/5867093.html

相关文章

docker中配置redis

1、常规操作 docker pull redis&#xff08;默认你的docker中没有redis&#xff09; 2、查看redis是否拉取成功 docker images redis 3、创建目录&#xff0c;在你的宿主机&#xff0c;&#xff08;我是在虚机中建的centos7&#xff09;为了给redis配置文件使用 4、下载redis…

51单片机编程学习笔记——点亮LED

大纲 器件51单片机开发板总结 安装驱动点亮LED烧录 随着最近机器人爆火&#xff0c;之前写的ROS2系列博客《Robot Operating System》也获得了更多的关注。我决定在机器人领域里再走一步&#xff0c;于是想到可以学习单片机。研究了下学习路径&#xff0c;最后还是选择先从51单…

小智AI桌宠机器狗

本文主要介绍如何利用开源小智AI制作桌宠机器狗 1 源码下载 首先下载小智源码,下载地址, 下载源码后,使用vsCode打开,需要在vscode上安装esp-idf,安装方式请自己解决 2 源码修改 2.1添加机器狗控制代码 在目录main/iot/things下添加dog.cc文件,内容如下; #include…

List的模拟实现(2)

前言 上一节我们讲解了list的基本功能&#xff0c;那么本节我们就结合底层代码来分析list是怎么实现的&#xff0c;那么废话不多说&#xff0c;我们正式进入今天的学习&#xff1a;&#xff09; List的底层结构 我们先来看一下list的底层基本结构&#xff1a; 这里比较奇怪的…

DeepSeek等LLM对网络安全行业的影响

大家好,我是AI拉呱,一个专注于人工智领域与网络安全方面的博主,现任资深算法研究员一职,兼职硕士研究生导师;热爱机器学习和深度学习算法应用,深耕大语言模型微调、量化、私域部署。曾获多次获得AI竞赛大奖,拥有多项发明专利和学术论文。对于AI算法有自己独特见解和经验…

开源嵌入式实时操作系统uC/OS-II介绍

一、uC/OS-II的诞生&#xff1a;从开源实验到行业标杆 背景与起源 uC/OS-II&#xff08;Micro-Controller Operating System Version II&#xff09;诞生于1992年&#xff0c;由嵌入式系统先驱Jean J. Labrosse开发。其前身uC/OS&#xff08;1991年&#xff09;最初作为教学工…

Linux与自动化的基础

Linux简介 Linux是一种开源的类Unix操作系统&#xff0c;广泛应用于服务器、桌面和嵌入式设备。常见的Linux发行版包括 Ubuntu、CentOS 和 Debian&#xff0c;它们各有特色&#xff0c;但都以稳定性和安全性著称。 与图形界面相比&#xff0c;Linux的**命令行界面&#xff08…

【刷题】贪心算法

贪心算法通常用于那些可以通过局部最优解达到全局最优解的问题&#xff0c;也就是说每一步都选择当前看起来最好的选项&#xff0c;从而希望最终的结果是最优的。 基础概念 [分配问题]&#xff1a;局部最优满足需求&#xff0c;排序后贪心分配 分发饼干 分发糖果 [区间问题]…