Mac移动隐藏删除顶部菜单栏图标教程

苹果菜单栏贯穿 Mac 的屏幕顶部。

左侧是苹果菜单和应用菜单,应用菜单一般显示你当前使用的Mac软件的所有功能菜单。

右侧通常是以图标显示的状态菜单,帮助你快速查看Mac的状态以及快速访问某些Mac软件。

移动图标位置

若想要重新排列状态菜单栏的图标,只要按住Command键,然后拖动某个图标即可,用这个方式可以调整除了通知中心以外的所有图标的位置。

删除图标

如果有些图标一周内才使用一次,那小编建议,你可以果断的删除这个图标了,不要让过多的图标扰乱你的菜单栏。

按住Command键并点按该图标,将其拖出菜单栏,当鼠标下方出现删除图标时再放开,就能将图标删除。

有些软件图标拖出菜单栏时,鼠标下方出现的是禁止图标,表示这个图标无法删除。

不用担心,你可以***该软件的偏好设置中找找看,大部分软件都提供隐藏功能。

隐藏图标

如果你觉得顶部菜单图标太多,却又不想删除任何图标时,可以试试用第三方管理软件Bartender。

打开Bartender的偏好设置,在这里可以为不同的应用选择不同的展示方式,比如:

Show:显示在外层

Hide:隐藏在内层,有通知时显示外层

Always Show:一直显示在外层

Always Hide:完全隐藏

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,以下是添加点击图标切换菜单栏显示与隐藏的步骤: 1. 在侧边菜单组件中添加切换菜单栏的方法 首先,你需要在侧边菜单组件中添加一个方法来切换菜单栏的显示和隐藏。以下是一个基本的切换方法示例: ``` <template> <div class="sidebar-menu"> <i class="el-icon-s-fold" @click="toggleSidebar"></i> <el-menu :default-active="$route.path" class="el-menu-vertical-demo" router :collapse="isCollapsed"> <el-menu-item index="/"> <i class="el-icon-menu"></i> <span>首页</span> </el-menu-item> <el-menu-item index="/about"> <i class="el-icon-info"></i> <span>关于我们</span> </el-menu-item> <el-menu-item index="/contact"> <i class="el-icon-phone"></i> <span>联系我们</span> </el-menu-item> </el-menu> </div> </template> <script> import { defineComponent, ref } from 'vue' export default defineComponent({ name: 'SidebarMenu', setup() { const isCollapsed = ref(false) const toggleSidebar = () => { isCollapsed.value = !isCollapsed.value } return { isCollapsed, toggleSidebar, } }, }) </script> <style> .sidebar-menu { height: 100%; background-color: #f0f2f5; padding: 20px; } .sidebar-menu i.el-icon-s-fold { font-size: 20px; cursor: pointer; margin-bottom: 10px; } </style> ``` 在这个示例中,我们添加了一个切换方法`toggleSidebar`,用来切换`isCollapsed`的值。我们还在模板中添加了一个图标,当点击图标时会触发切换方法。 2. 在App组件中绑定菜单栏的显示与隐藏 接下来,你需要在App组件中绑定菜单栏的显示与隐藏。以下是一个基本的App组件示例: ``` <template> <div class="app"> <el-container> <el-aside :width="isCollapsed ? '70px' : '200px'" :collapse="isCollapsed" @collapse="toggleSidebar"> <sidebar-menu></sidebar-menu> </el-aside> <el-container> <router-view></router-view> </el-container> </el-container> </div> </template> <script> import { defineComponent, ref } from 'vue' import SidebarMenu from './components/SidebarMenu.vue' export default defineComponent({ name: 'App', components: { SidebarMenu, }, setup() { const isCollapsed = ref(false) const toggleSidebar = () => { isCollapsed.value = !isCollapsed.value } return { isCollapsed, toggleSidebar, } }, }) </script> <style> .app { height: 100%; } </style> ``` 在这个示例中,我们在`el-aside`组件中绑定了菜单栏的宽度和是否折叠的属性。并且在`el-aside`组件中添加了一个`@collapse`事件,用来在菜单栏折叠时触发切换方法。我们还在App组件的setup函数中定义了`isCollapsed`和`toggleSidebar`。 3. 完成 现在,你已经添加了点击图标切换菜单栏显示与隐藏的功能。你可以根据你的需求自定义图标和样式。 希望这可以帮助到你!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值