Tailscale 的新 macOS 主页
Tailscale's new macOS home

原始链接: https://tailscale.com/blog/macos-notch-escape

Tailscale 最近解决了在一些 MacBook(特别是 2021 款带刘海屏的型号)上,其菜单栏图标因空间有限而消失在屏幕刘海中的问题。苹果没有提供直接的解决方案,导致用户无法在没有第三方应用等变通方法的情况下访问设置。 最初,Tailscale 实施了一个临时修复方案:弹出通知,提醒用户图标已隐藏,利用其可见性数据。虽然不完美,但有助于诊断问题。 核心解决方案现已通过 Tailscale 的新窗口化 macOS 应用(版本 1.96.2 及更高版本)提供。该应用与菜单栏版本并行运行,提供可搜索的设备列表、简便的文件共享、出口节点访问、错误通知以及最小化的“迷你播放器”模式。窗口化界面旨在使 Tailscale 更易于访问和使用,减少对可能隐藏的菜单栏图标的依赖。Tailscale 也在计划为 Windows 开发类似的 UI。

相关文章

原文

Tailscale should feel nearly invisible when it's connecting you and all your devices together. But on some MacBooks, for a while there, it could be a little too invisible. We have two fixes for it: one small and slightly quirky, and another really useful one, available now on macOS.

The small, quirky fix might become a thing of the past for the vast majority of Mac users. I wanted to document it here: to help other developers, to mark this moment in time, and quietly crow about our windowed macOS interface now being generally available.

But for a while there, we had this issue with Tailscale's icon slipping into darkness.

At its debut on macOS, Tailscale was a command-line tool and a menu bar utility. Some MacBooks, starting with 2021 MacBook Pro models, have a notch in the top-middle of their display. And depending on how many other apps with menu bar icons are running, the Tailscale app’s icon can be hidden inside that notch.

Apple, a company that traditionally favors simple functionality over dense settings, does not offer users, or developers, a path out of the darkness. If there are more menu bar icons then there is space to the right side of the notch, the menu bar items simply disappear into the notch-y ether. If you don’t see it, you can’t click it. There is no notification to the user, no overflow section, no options to rearrange the menu bar items.

a tight screenshot of the Tailscale menu bar app, right next to a simulated notch on the gray top menu bar of a MacBook screen.
Author's rendition of the Tailscale menu bar applet, dangerously close to the inky depths.

As of this writing, Apple has some indirect work-arounds, like pushing more of its own system icons into a revamped Control Center, and offering a somewhat inelgant “Scale to fit below camera” option. Third-party menu-bar-managing apps like ICE and Bartender can help, but they add complications and overhead.

“We don’t have any control over where things get rendered in the menu bar,” said one Tailscale engineer, who asked to go nameless so as to share their honest opinion. “You just say, ‘I want to be a menu bar app.’ They shove it up there, and that’s it, you end up where you end up.”

Given this there-or-not-there behavior, Tailscale developers received a number of bug reports from users when, after the notched MacBooks' debut, their Tailscale icons fell into the middle-screen distance. "They were like, 'Actually, I can't find my Tailscale. It's gone. It didn't start," the engineer said. "We're like, 'No, it's there, it's just hiding behind the notch.' But we kind of got sick of that."

Mac menu bar icons may not know they are trapped inside the no-pixel phantom zone, but they can report that something is blocking them. Using data from occlusionState, the Tailscale app can see that its icon is in mid-bar limbo.

And while it cannot move, it can speak. Specifically, a pop-up message can say:

Mac pop-up dialog, reading: Sneaky! The Tailscale icon is hiding behind the notch [new line] The Tailscale icon is hidden due to limited space in the menu bar. To see the Tailscale menu, please rearrange or remove some of the other icons.

This affable warning is not perfect, by any means. The notch warning can be inadvertently triggered by other display quirks, like opening and closing the MacBook lid, moving between monitors, or some combination of the two. But it helped triage the "Where are my Tailscale settings?" issue for a while.

Apple could certainly make some changes to prevent this being an issue at all. The system could prevent menu bar icons from rendering in the notch area at all. An overflow mechanism could stack the icons that would otherwise drop into a negative notch zone. Or developers could be given more information and tools about icons' notch-itive states.

In the meantime, here’s a look at the Swift code that let our app know it should chirp a bit when hidden. It should be unnecessary with the new windowed app—unless you enable the “Hide Dock icon” option in the windowed client options, in which case it might still call out its hidden nature.

self.visibilityObserver = NotificationCenter.default.addObserver(
    forName: NSWindow.didChangeOcclusionStateNotification,
    object: statusItemButton.window,
    queue: .main
) { [weak self] _ in
    guard let self, statusItem.isVisible else { return }
    isIconOccluded = statusItem.button?.window?.occlusionState.contains(.visible) == false
}

As we noted at its September beta release, a windowed version of Tailscale’s macOS app doesn’t replace the menu bar app, but runs alongside it. It can be pulled up from the Dock or a Spotlight search, and makes a lot of Tailscale data and features more accessible.

A screenshot showing Tailscale's macOS windowed UI, with a device selected (iPhone) and details of that device on the right. A Taildrop box offers drag-and-drop file sending.

The windowed interface, enabled by default starting with version 1.96.2 of our macOS client, offers:

  • A searchable list of tailnet devices and their connection status
  • Easily ping, copy IP addresses, and send files through Taildrop to devices
  • Easy access to exit nodes, searchable and with one recommended based on latency, performance, and location
  • A red dot on the Dock icon to note critical errors
  • A “mini player” that shrinks Tailscale down to the bare minimum
  • A product tour of all these things upon installing/updating

Let us know what you think of the new interface so we can make it better. We’re working on a comparable UI for Windows devices. And we’re always looking for ways to bring a little bit of functional whimsy to our software.

联系我们 contact @ memedata.com