From 8fd37c83625b2c0360116d3ef67535ba7af56933 Mon Sep 17 00:00:00 2001 From: Marcus Kida Date: Tue, 15 Nov 2022 11:34:03 +0100 Subject: [PATCH] feat: Implement more obvious account switcher --- .../Root/MainTab/MainTabBarController.swift | 11 ++++++++++- .../Scene/Root/Sidebar/SidebarViewModel.swift | 4 ++++ .../Sidebar/View/SidebarListContentView.swift | 17 +++++++++++++++-- 3 files changed, 29 insertions(+), 3 deletions(-) diff --git a/Mastodon/Scene/Root/MainTab/MainTabBarController.swift b/Mastodon/Scene/Root/MainTab/MainTabBarController.swift index 9728c551a..c8fa53d2f 100644 --- a/Mastodon/Scene/Root/MainTab/MainTabBarController.swift +++ b/Mastodon/Scene/Root/MainTab/MainTabBarController.swift @@ -43,6 +43,7 @@ class MainTabBarController: UITabBarController { static let avatarButtonSize = CGSize(width: 25, height: 25) let avatarButton = CircleAvatarButton() + let accountSwitcherChevron = UIImageView(image: UIImage(systemName: "chevron.up.chevron.down")) @Published var currentTab: Tab = .home @@ -506,13 +507,20 @@ extension MainTabBarController { } anchorImageView.alpha = 0 + accountSwitcherChevron.translatesAutoresizingMaskIntoConstraints = false + view.addSubview(accountSwitcherChevron) + self.avatarButton.translatesAutoresizingMaskIntoConstraints = false view.addSubview(self.avatarButton) NSLayoutConstraint.activate([ - self.avatarButton.centerXAnchor.constraint(equalTo: anchorImageView.centerXAnchor), + self.avatarButton.centerXAnchor.constraint(equalTo: anchorImageView.centerXAnchor, constant: -16), self.avatarButton.centerYAnchor.constraint(equalTo: anchorImageView.centerYAnchor), self.avatarButton.widthAnchor.constraint(equalToConstant: MainTabBarController.avatarButtonSize.width).priority(.required - 1), self.avatarButton.heightAnchor.constraint(equalToConstant: MainTabBarController.avatarButtonSize.height).priority(.required - 1), + accountSwitcherChevron.widthAnchor.constraint(equalToConstant: 10), + accountSwitcherChevron.heightAnchor.constraint(equalToConstant: 18), + accountSwitcherChevron.leadingAnchor.constraint(equalTo: avatarButton.trailingAnchor, constant: 8), + accountSwitcherChevron.centerYAnchor.constraint(equalTo: avatarButton.centerYAnchor) ]) self.avatarButton.setContentHuggingPriority(.required - 1, for: .horizontal) self.avatarButton.setContentHuggingPriority(.required - 1, for: .vertical) @@ -520,6 +528,7 @@ extension MainTabBarController { } private func updateAvatarButtonAppearance() { + accountSwitcherChevron.tintColor = currentTab == .me ? .label : .secondaryLabel avatarButton.borderColor = currentTab == .me ? .label : .systemFill avatarButton.setNeedsLayout() } diff --git a/Mastodon/Scene/Root/Sidebar/SidebarViewModel.swift b/Mastodon/Scene/Root/Sidebar/SidebarViewModel.swift index c3f9e3e36..607637c7c 100644 --- a/Mastodon/Scene/Root/Sidebar/SidebarViewModel.swift +++ b/Mastodon/Scene/Root/Sidebar/SidebarViewModel.swift @@ -80,6 +80,7 @@ extension SidebarViewModel { }() cell.item = SidebarListContentView.Item( isActive: false, + showAccountSwitcher: item == .me, title: item.title, image: item.image, activeImage: item.selectedImage, @@ -157,6 +158,7 @@ extension SidebarViewModel { case .setting: let item = SidebarListContentView.Item( isActive: false, + showAccountSwitcher: false, title: L10n.Common.Controls.Actions.settings, image: Asset.ObjectsAndTools.gear.image.withRenderingMode(.alwaysTemplate), activeImage: Asset.ObjectsAndTools.gear.image.withRenderingMode(.alwaysTemplate), @@ -166,6 +168,7 @@ extension SidebarViewModel { case .compose: let item = SidebarListContentView.Item( isActive: false, + showAccountSwitcher: self.currentTab == .me, title: L10n.Common.Controls.Actions.compose, image: Asset.ObjectsAndTools.squareAndPencil.image.withRenderingMode(.alwaysTemplate), activeImage: Asset.ObjectsAndTools.squareAndPencil.image.withRenderingMode(.alwaysTemplate), @@ -213,6 +216,7 @@ extension SidebarViewModel { let item = SidebarListContentView.Item( isActive: false, + showAccountSwitcher: false, title: L10n.Common.Controls.Actions.compose, image: Asset.ObjectsAndTools.squareAndPencil.image.withRenderingMode(.alwaysTemplate), activeImage: Asset.ObjectsAndTools.squareAndPencil.image.withRenderingMode(.alwaysTemplate), diff --git a/Mastodon/Scene/Root/Sidebar/View/SidebarListContentView.swift b/Mastodon/Scene/Root/Sidebar/View/SidebarListContentView.swift index 515988405..0ef99c0a3 100644 --- a/Mastodon/Scene/Root/Sidebar/View/SidebarListContentView.swift +++ b/Mastodon/Scene/Root/Sidebar/View/SidebarListContentView.swift @@ -23,7 +23,8 @@ final class SidebarListContentView: UIView, UIContentView { button.borderColor = UIColor.label return button }() - + let accountSwitcherChevron = UIImageView(image: UIImage(systemName: "chevron.up.chevron.down")) + private var currentConfiguration: ContentConfiguration! var configuration: UIContentConfiguration { get { @@ -60,6 +61,9 @@ extension SidebarListContentView { imageView.widthAnchor.constraint(equalToConstant: 40).priority(.required - 1), imageView.heightAnchor.constraint(equalToConstant: 40).priority(.required - 1), ]) + + accountSwitcherChevron.translatesAutoresizingMaskIntoConstraints = false + addSubview(accountSwitcherChevron) avatarButton.translatesAutoresizingMaskIntoConstraints = false addSubview(avatarButton) @@ -68,6 +72,10 @@ extension SidebarListContentView { avatarButton.centerYAnchor.constraint(equalTo: imageView.centerYAnchor), avatarButton.widthAnchor.constraint(equalTo: imageView.widthAnchor, multiplier: 1.0).priority(.required - 2), avatarButton.heightAnchor.constraint(equalTo: imageView.heightAnchor, multiplier: 1.0).priority(.required - 2), + accountSwitcherChevron.widthAnchor.constraint(equalToConstant: 12), + accountSwitcherChevron.heightAnchor.constraint(equalToConstant: 22), + accountSwitcherChevron.leadingAnchor.constraint(equalTo: avatarButton.trailingAnchor, constant: 4), + accountSwitcherChevron.centerYAnchor.constraint(equalTo: avatarButton.centerYAnchor) ]) avatarButton.setContentHuggingPriority(.defaultLow - 10, for: .vertical) avatarButton.setContentHuggingPriority(.defaultLow - 10, for: .horizontal) @@ -96,6 +104,8 @@ extension SidebarListContentView { imageView.isHidden = item.imageURL != nil avatarButton.isHidden = item.imageURL == nil imageView.image = item.isActive ? item.activeImage.withRenderingMode(.alwaysTemplate) : item.image.withRenderingMode(.alwaysTemplate) + accountSwitcherChevron.isHidden = !item.showAccountSwitcher + accountSwitcherChevron.tintColor = item.isActive ? .label : .secondaryLabel avatarButton.avatarImageView.setImage( url: item.imageURL, placeholder: avatarButton.avatarImageView.image ?? .placeholder(color: .systemFill), // reuse to avoid blink @@ -112,7 +122,8 @@ extension SidebarListContentView { var isSelected: Bool = false var isHighlighted: Bool = false var isActive: Bool - + var showAccountSwitcher: Bool + // model let title: String var image: UIImage @@ -124,6 +135,7 @@ extension SidebarListContentView { return lhs.isSelected == rhs.isSelected && lhs.isHighlighted == rhs.isHighlighted && lhs.isActive == rhs.isActive + && lhs.showAccountSwitcher == rhs.showAccountSwitcher && lhs.title == rhs.title && lhs.image == rhs.image && lhs.activeImage == rhs.activeImage @@ -134,6 +146,7 @@ extension SidebarListContentView { hasher.combine(isSelected) hasher.combine(isHighlighted) hasher.combine(isActive) + hasher.combine(showAccountSwitcher) hasher.combine(title) hasher.combine(image) hasher.combine(activeImage)