From 0082360692283ea4463a8af589fd0c967716a76a Mon Sep 17 00:00:00 2001 From: Justin Mazzocchi <2831158+jzzocc@users.noreply.github.com> Date: Sat, 16 Jan 2021 12:45:56 -0800 Subject: [PATCH] Profile avatar and animation improvements --- Transitions/ZoomAnimator.swift | 3 +++ .../ZoomDismissalInteractionController.swift | 1 + Views/AccountHeaderView.swift | 26 +++++++++++++------ 3 files changed, 22 insertions(+), 8 deletions(-) diff --git a/Transitions/ZoomAnimator.swift b/Transitions/ZoomAnimator.swift index b888711..1d7cb91 100644 --- a/Transitions/ZoomAnimator.swift +++ b/Transitions/ZoomAnimator.swift @@ -51,6 +51,7 @@ private extension ZoomAnimator { if transitionView == nil, let transitionView = (fromReferenceView as? ZoomAnimatableView)?.transitionView() { transitionView.frame = fromReferenceViewFrame transitionView.layer.contentsRect = fromReferenceView.layer.contentsRect + transitionView.layer.cornerRadius = fromReferenceView.layer.cornerRadius self.transitionView = transitionView transitionContext.containerView.addSubview(transitionView) } @@ -67,6 +68,7 @@ private extension ZoomAnimator { options: [.transitionCrossDissolve]) { self.transitionView?.frame = finalTransitionSize self.transitionView?.layer.contentsRect = .defaultContentsRect + self.transitionView?.layer.cornerRadius = 0 toVC.view.alpha = 1.0 fromVC.tabBarController?.tabBar.alpha = 0 } completion: { _ in @@ -117,6 +119,7 @@ private extension ZoomAnimator { } self.transitionView?.layer.contentsRect = toReferenceView?.layer.contentsRect ?? .defaultContentsRect + self.transitionView?.layer.cornerRadius = toReferenceView?.layer.cornerRadius ?? 0 toVC.tabBarController?.tabBar.alpha = 1 } completion: { _ in diff --git a/Transitions/ZoomDismissalInteractionController.swift b/Transitions/ZoomDismissalInteractionController.swift index 3130732..544a0a1 100644 --- a/Transitions/ZoomDismissalInteractionController.swift +++ b/Transitions/ZoomDismissalInteractionController.swift @@ -84,6 +84,7 @@ final class ZoomDismissalInteractionController: NSObject { } transitionView.layer.contentsRect = toReferenceView?.layer.contentsRect ?? .defaultContentsRect + transitionView.layer.cornerRadius = toReferenceView?.layer.cornerRadius ?? 0 toVC.tabBarController?.tabBar.alpha = 1 } completion: { _ in diff --git a/Views/AccountHeaderView.swift b/Views/AccountHeaderView.swift index 41fb0a0..aac05bf 100644 --- a/Views/AccountHeaderView.swift +++ b/Views/AccountHeaderView.swift @@ -7,6 +7,7 @@ import ViewModels final class AccountHeaderView: UIView { let headerImageView = AnimatedImageView() let headerButton = UIButton() + let avatarBackgroundView = UIView() let avatarImageView = UIImageView() let avatarButton = UIButton() let relationshipButtonsStackView = UIStackView() @@ -177,14 +178,19 @@ private extension AccountHeaderView { headerButton.addAction(UIAction { [weak self] _ in self?.viewModel?.presentHeader() }, for: .touchUpInside) - addSubview(avatarImageView) + let avatarBackgroundViewDimension = Self.avatarDimension + .compactSpacing * 2 + + addSubview(avatarBackgroundView) + avatarBackgroundView.translatesAutoresizingMaskIntoConstraints = false + avatarBackgroundView.backgroundColor = .systemBackground + avatarBackgroundView.layer.cornerRadius = avatarBackgroundViewDimension / 2 + + avatarBackgroundView.addSubview(avatarImageView) avatarImageView.translatesAutoresizingMaskIntoConstraints = false avatarImageView.contentMode = .scaleAspectFill avatarImageView.clipsToBounds = true avatarImageView.isUserInteractionEnabled = true avatarImageView.layer.cornerRadius = Self.avatarDimension / 2 - avatarImageView.layer.borderWidth = .compactSpacing - avatarImageView.layer.borderColor = UIColor.systemBackground.cgColor avatarImageView.addSubview(avatarButton) avatarButton.translatesAutoresizingMaskIntoConstraints = false @@ -318,21 +324,25 @@ private extension AccountHeaderView { headerButton.topAnchor.constraint(equalTo: headerImageView.topAnchor), headerButton.bottomAnchor.constraint(equalTo: headerImageView.bottomAnchor), headerButton.trailingAnchor.constraint(equalTo: headerImageView.trailingAnchor), + avatarBackgroundView.heightAnchor.constraint(equalToConstant: avatarBackgroundViewDimension), + avatarBackgroundView.widthAnchor.constraint(equalToConstant: avatarBackgroundViewDimension), + avatarBackgroundView.leadingAnchor.constraint(equalTo: readableContentGuide.leadingAnchor), + avatarBackgroundView.centerYAnchor.constraint(equalTo: headerImageView.bottomAnchor), avatarImageView.heightAnchor.constraint(equalToConstant: Self.avatarDimension), avatarImageView.widthAnchor.constraint(equalToConstant: Self.avatarDimension), - avatarImageView.leadingAnchor.constraint(equalTo: readableContentGuide.leadingAnchor), - avatarImageView.centerYAnchor.constraint(equalTo: headerImageView.bottomAnchor), + avatarImageView.centerXAnchor.constraint(equalTo: avatarBackgroundView.centerXAnchor), + avatarImageView.centerYAnchor.constraint(equalTo: avatarBackgroundView.centerYAnchor), avatarButton.leadingAnchor.constraint(equalTo: avatarImageView.leadingAnchor), avatarButton.topAnchor.constraint(equalTo: avatarImageView.topAnchor), avatarButton.bottomAnchor.constraint(equalTo: avatarImageView.bottomAnchor), avatarButton.trailingAnchor.constraint(equalTo: avatarImageView.trailingAnchor), - relationshipButtonsStackView.leadingAnchor.constraint(equalTo: avatarImageView.trailingAnchor), + relationshipButtonsStackView.leadingAnchor.constraint(equalTo: avatarBackgroundView.trailingAnchor), relationshipButtonsStackView.topAnchor.constraint( equalTo: headerImageView.bottomAnchor, constant: .defaultSpacing), relationshipButtonsStackView.trailingAnchor.constraint(equalTo: readableContentGuide.trailingAnchor), - relationshipButtonsStackView.bottomAnchor.constraint(equalTo: avatarImageView.bottomAnchor), - baseStackView.topAnchor.constraint(equalTo: avatarImageView.bottomAnchor, constant: .defaultSpacing), + relationshipButtonsStackView.bottomAnchor.constraint(equalTo: avatarBackgroundView.bottomAnchor), + baseStackView.topAnchor.constraint(equalTo: avatarBackgroundView.bottomAnchor, constant: .defaultSpacing), baseStackView.leadingAnchor.constraint(equalTo: readableContentGuide.leadingAnchor), baseStackView.trailingAnchor.constraint(equalTo: readableContentGuide.trailingAnchor), baseStackView.bottomAnchor.constraint(equalTo: readableContentGuide.bottomAnchor)