合理使用WebStorm-自定义TouchBar提升使用体验

前几天Webstorm推送了新版本，本次更新带来了全新的界面设计。用了几天后，界面确实很干爽简洁，突然间我的目光转移到了MacBook自带的Touchbar上面，觉得好像少了点什么.

创新互联坚持“要么做到，要么别承诺”的工作理念，服务领域包括：成都网站制作、成都网站建设、外贸营销网站建设、企业官网、英文网站、手机端网站、网站推广等服务，满足客户于互联网时代的梁子湖网站设计、移动媒体设计的需求，帮助企业找到有效的互联网解决方案。努力成为您成熟可靠的网络建设合作伙伴！

要是能把我在开发中经常用到的一些操作放到上面就好了，查了下JetBrains的官网发现确实可以自己定义Touchbar上面要展示的功能，本文就跟大家分享下自定义的方法，欢迎各位感兴趣的开发者阅读本文。

打开webstorm的设置菜单：依次点击顶栏的Webstorm -> Preferences...，或者直接按快捷键command + ,在弹出的菜单中选择Menus and Toolbars

向下滚动，找到Touch Bar选项。

展开后，有3个选项，分别为：

编辑器内触发搜索时要展示的操作选项

在编辑器窗口内停留时要展示的操作选项

调试代码时要展示的操作选项

此处我们要添加的是Default状态下的操作选项，我们将其点开并选中，点击“加号”图标在弹出的菜单中选择Add Action...

在弹出的菜单中，找到自己想要添加的功能，点击OK即可。

添加完成后即可在Default菜单中找到，默认在最后面，你可以通过拖拽来进行排序，将其放到合适的位置。

注意：你添加进来的某些操作可能默认没有图标，会显示一个绿色的?，你可以自己给它设定一个图标，实现起来也很简单，只需要选中它，点击工具栏的编辑图标。

找到合适的图标后，点OK即可。

image-20221206223050381

我在平常开发中经常用到的功能有：

前三个功能将默认展示在TouchBar上，后三个功能将在按下option键时展示出来。

对应的菜单设置如下所示。

添加完成后，当我鼠标在Webstorm中任意位置点击时，我的Touch Bar如下所示：

IMG_7521

按下ctrl后，展示出来的操作选项。

IMG_7522

注意：某些操作操作，搜索结果可能不能精确找到，这时你就需要在Other菜单下找一下了。

新的界面中，编辑器的右上方展示的功能选项区域称为Toolbar，默认的选项你可能也不喜欢，想自定义它也很容易，只需要右上方的空白区域右键，选择Customize Toolbar...即可。

打开的界面如下所示，跟前面的设置界面大同小异，因此你可以用相同的方法来添加你需要的功能，按照你喜欢的顺序进行拖拽排序，我设置好的界面如下所示。

设置完成后，点OK，即可在右上方的区域看到你设置好的内容。

最后，给大家放一张我编辑器设置完成后的完整截图。

注意：我还隐藏了Tool Window Bars，这样看起来就跟我的界面一摸一样了，隐藏它也很简单，你只需要依次点击编辑器顶栏的View -> Appearance -> Tool Window Bars即可。

攀枝花网站建设、攀枝花网站运维推广公司-贝锐智能，是专注品牌与效果的网络营销公司；服务项目有等

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：贝锐智能

贝锐智能技术为您推荐以下文章