I have worked on implementing tabs and I think I'm quite happy with the result so far. I have mostly been spending my time getting the UI to look good with some animations _(the animations could use some more work though)_.
It's possible to rearrange tabs by dragging a tab left and right. Simple stuff like closing a tab also works. I do need to get the shortcut `CMD + W` to work as well, so it's faster to close tabs. The home-tab cannot be closed, so when the user selects the home-tab (or there is no other tabs except home-tab) and clicks the close-shortcut, it will not close the tab, but instead close the window.
**Problem:** It's only possible to drag tabs in the horizontal direction (x-axis). This means, tabs can only be dragged inside the tab-area. But ideally, it should be possible to drag tabs outside the tab-area. When doing so and releasing the tab, it should open the tab in a new window.
I'm struggling a bit to get this behavior working. Funny enough, it works fine except when using a ScrollView, because then the tab will clip to the ScrollView. This means the tab will just be hidden in the UI when trying to drag it outside the ScrollView...
I am switching between a normal HStack and a ScrollView depending on the amount of tabs. If there are too many tabs to show in the viewport, the app will switch over to using a ScrollView, and this is where the problem begins, because it hides the tab when trying to drag outside. Also, the switching between HStack and ScrollView can cause some glitches. #dev #SwiftUI #AppKit
npub1nj…52gqz
2025-10-08 17:57:47 UTC
Author Public Key
npub1nj0crmtetu84a7j43yegy358mp8u0e4ye7ndkhtd8dg0edll4mpqn52gqzSeen on
wss://nostr.oxtr.devPublished at
2025-10-08 17:57:47 UTCEvent JSON
{
"id": "cf6f4b7cb51d380a54a361bda68dc9d9a3e0b2db4c278a79a03c3672cc1a49c4",
"pubkey": "9c9f81ed795f0f5efa558932824687d84fc7e6a4cfa6db5d6d3b50fcb7ffaec2",
"created_at": 1759946267,
"kind": 1,
"tags": [
[
"imeta",
"bh ",
"blurhash ",
"dim 0x0",
"m video/mp4",
"ox 225dbaade0f094f3e47cf72609d6adc39a0ee3a1004ff44092e0091e43115f2c",
"size 5613130",
"thumb https://video.nostr.build/225dbaade0f094f3e47cf72609d6adc39a0ee3a1004ff44092e0091e43115f2c.mp4",
"url https://video.nostr.build/225dbaade0f094f3e47cf72609d6adc39a0ee3a1004ff44092e0091e43115f2c.mp4",
"x 0a0ef848717a9a2bee9b7a17205dbdae7369834de184ba0372d598da7af18201"
],
[
"t",
"dev"
],
[
"t",
"swiftui"
],
[
"t",
"appkit"
],
[
"client",
"nosotros",
"31990:c6603b0f1ccfec625d9c08b753e4f774eaf7d1cf2769223125b5fd4da728019e:1728437063755"
]
],
"content": "I have worked on implementing tabs and I think I'm quite happy with the result so far. I have mostly been spending my time getting the UI to look good with some animations _(the animations could use some more work though)_.\n\nIt's possible to rearrange tabs by dragging a tab left and right. Simple stuff like closing a tab also works. I do need to get the shortcut `CMD + W` to work as well, so it's faster to close tabs. The home-tab cannot be closed, so when the user selects the home-tab (or there is no other tabs except home-tab) and clicks the close-shortcut, it will not close the tab, but instead close the window.\n\n**Problem:** It's only possible to drag tabs in the horizontal direction (x-axis). This means, tabs can only be dragged inside the tab-area. But ideally, it should be possible to drag tabs outside the tab-area. When doing so and releasing the tab, it should open the tab in a new window.\n\nI'm struggling a bit to get this behavior working. Funny enough, it works fine except when using a ScrollView, because then the tab will clip to the ScrollView. This means the tab will just be hidden in the UI when trying to drag it outside the ScrollView...\n\nI am switching between a normal HStack and a ScrollView depending on the amount of tabs. If there are too many tabs to show in the viewport, the app will switch over to using a ScrollView, and this is where the problem begins, because it hides the tab when trying to drag outside. Also, the switching between HStack and ScrollView can cause some glitches. #dev #SwiftUI #AppKit \n\nhttps://video.nostr.build/225dbaade0f094f3e47cf72609d6adc39a0ee3a1004ff44092e0091e43115f2c.mp4",
"sig": "4457a5ab8d3b41ba38f098504491a3c84a18e5b31c43ecf8d128bc4dc64105a65e6ba07910d90cab94d26cc6c496b86c1f2b44119f00ae9abea99e80fb6dac12"
}