From 94470c9f1b44b6ca3c6cfa71ebb0907495df5432 Mon Sep 17 00:00:00 2001 From: CMK Date: Tue, 15 Feb 2022 17:13:02 +0800 Subject: [PATCH] chore: update profile relationship button UI --- .../Header/View/ProfileHeaderView.swift | 12 +++++- .../ProfileRelationshipActionButton.swift | 11 ++++-- .../Scene/Profile/ProfileViewController.swift | 2 +- Mastodon/Scene/Profile/ProfileViewModel.swift | 1 + .../Contents.json | 6 +-- .../Profile/RelationshipButton/Contents.json | 9 +++++ .../background.colorset/Contents.json | 38 +++++++++++++++++++ .../Contents.json | 38 +++++++++++++++++++ .../MastodonAsset/Generated/Assets.swift | 4 ++ 9 files changed, 112 insertions(+), 9 deletions(-) create mode 100644 MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/Contents.json create mode 100644 MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/background.colorset/Contents.json create mode 100644 MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/background.highlighted.colorset/Contents.json diff --git a/Mastodon/Scene/Profile/Header/View/ProfileHeaderView.swift b/Mastodon/Scene/Profile/Header/View/ProfileHeaderView.swift index aadb0d70..1c667cbb 100644 --- a/Mastodon/Scene/Profile/Header/View/ProfileHeaderView.swift +++ b/Mastodon/Scene/Profile/Header/View/ProfileHeaderView.swift @@ -154,6 +154,8 @@ final class ProfileHeaderView: UIView { }() let statusDashboardView = ProfileStatusDashboardView() + + let relationshipActionButtonShadowContainer = ShadowBackgroundContainer() let relationshipActionButton: ProfileRelationshipActionButton = { let button = ProfileRelationshipActionButton() button.titleLabel?.font = .systemFont(ofSize: 17, weight: .semibold) @@ -357,7 +359,7 @@ extension ProfileHeaderView { avatarImageViewBackgroundView.bottomAnchor.constraint(equalTo: dashboardContainer.bottomAnchor), ]) - // authorContainer: H - [ nameContainer | relationshipActionButton ] + // authorContainer: H - [ nameContainer | relationshipActionButtonShadowContainer ] let authorContainer = UIStackView() authorContainer.axis = .horizontal authorContainer.alignment = .top @@ -402,9 +404,15 @@ extension ProfileHeaderView { nameContainerStackView.addArrangedSubview(usernameLabel) authorContainer.addArrangedSubview(nameContainerStackView) + authorContainer.addArrangedSubview(relationshipActionButtonShadowContainer) + relationshipActionButton.translatesAutoresizingMaskIntoConstraints = false - authorContainer.addArrangedSubview(relationshipActionButton) + relationshipActionButtonShadowContainer.addSubview(relationshipActionButton) NSLayoutConstraint.activate([ + relationshipActionButton.topAnchor.constraint(equalTo: relationshipActionButtonShadowContainer.topAnchor), + relationshipActionButton.leadingAnchor.constraint(equalTo: relationshipActionButtonShadowContainer.leadingAnchor), + relationshipActionButton.trailingAnchor.constraint(equalTo: relationshipActionButtonShadowContainer.trailingAnchor), + relationshipActionButton.bottomAnchor.constraint(equalTo: relationshipActionButtonShadowContainer.bottomAnchor), relationshipActionButton.widthAnchor.constraint(greaterThanOrEqualToConstant: ProfileHeaderView.friendshipActionButtonSize.width).priority(.required - 1), relationshipActionButton.heightAnchor.constraint(equalToConstant: ProfileHeaderView.friendshipActionButtonSize.height).priority(.defaultHigh), ]) diff --git a/Mastodon/Scene/Profile/Header/View/ProfileRelationshipActionButton.swift b/Mastodon/Scene/Profile/Header/View/ProfileRelationshipActionButton.swift index fffb061b..8935783f 100644 --- a/Mastodon/Scene/Profile/Header/View/ProfileRelationshipActionButton.swift +++ b/Mastodon/Scene/Profile/Header/View/ProfileRelationshipActionButton.swift @@ -7,6 +7,7 @@ import UIKit import MastodonUI +import MastodonAsset final class ProfileRelationshipActionButton: RoundedEdgesButton { @@ -30,6 +31,7 @@ final class ProfileRelationshipActionButton: RoundedEdgesButton { extension ProfileRelationshipActionButton { private func _init() { + cornerRadius = 10 titleLabel?.font = .systemFont(ofSize: 17, weight: .semibold) activityIndicatorView.translatesAutoresizingMaskIntoConstraints = false @@ -49,9 +51,12 @@ extension ProfileRelationshipActionButton { setTitle(actionOptionSet.title, for: .normal) setTitleColor(.white, for: .normal) setTitleColor(UIColor.white.withAlphaComponent(0.5), for: .highlighted) - setBackgroundImage(.placeholder(color: actionOptionSet.backgroundColor), for: .normal) - setBackgroundImage(.placeholder(color: actionOptionSet.backgroundColor.withAlphaComponent(0.5)), for: .highlighted) - setBackgroundImage(.placeholder(color: actionOptionSet.backgroundColor.withAlphaComponent(0.5)), for: .disabled) + setBackgroundImage(.placeholder(color: Asset.Scene.Profile.RelationshipButton.background.color), for: .normal) + setBackgroundImage(.placeholder(color: Asset.Scene.Profile.RelationshipButton.backgroundHighlighted.color), for: .highlighted) + setBackgroundImage(.placeholder(color: Asset.Scene.Profile.RelationshipButton.backgroundHighlighted.color), for: .disabled) +// setBackgroundImage(.placeholder(color: actionOptionSet.backgroundColor), for: .normal) +// setBackgroundImage(.placeholder(color: actionOptionSet.backgroundColor.withAlphaComponent(0.5)), for: .highlighted) +// setBackgroundImage(.placeholder(color: actionOptionSet.backgroundColor.withAlphaComponent(0.5)), for: .disabled) titleEdgeInsets = UIEdgeInsets(top: 0, left: 4, bottom: 0, right: 4) diff --git a/Mastodon/Scene/Profile/ProfileViewController.swift b/Mastodon/Scene/Profile/ProfileViewController.swift index ee2dacb5..d8e27a29 100644 --- a/Mastodon/Scene/Profile/ProfileViewController.swift +++ b/Mastodon/Scene/Profile/ProfileViewController.swift @@ -619,7 +619,7 @@ extension ProfileViewController { .receive(on: DispatchQueue.main) .sink { [weak self] isHidden in guard let self = self else { return } - self.profileHeaderViewController.profileHeaderView.relationshipActionButton.isHidden = isHidden + self.profileHeaderViewController.profileHeaderView.relationshipActionButtonShadowContainer.isHidden = isHidden } .store(in: &disposeBag) diff --git a/Mastodon/Scene/Profile/ProfileViewModel.swift b/Mastodon/Scene/Profile/ProfileViewModel.swift index 588651c8..403437da 100644 --- a/Mastodon/Scene/Profile/ProfileViewModel.swift +++ b/Mastodon/Scene/Profile/ProfileViewModel.swift @@ -442,6 +442,7 @@ extension ProfileViewModel { } } + @available(*, deprecated, message: "") var backgroundColor: UIColor { guard let highPriorityAction = self.highPriorityAction(except: []) else { assertionFailure() diff --git a/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Onboarding/navigation.next.button.background.colorset/Contents.json b/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Onboarding/navigation.next.button.background.colorset/Contents.json index a36ab82c..0c0c8af0 100644 --- a/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Onboarding/navigation.next.button.background.colorset/Contents.json +++ b/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Onboarding/navigation.next.button.background.colorset/Contents.json @@ -5,9 +5,9 @@ "color-space" : "srgb", "components" : { "alpha" : "1.000", - "blue" : "0.216", - "green" : "0.173", - "red" : "0.157" + "blue" : "55", + "green" : "44", + "red" : "40" } }, "idiom" : "universal" diff --git a/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/Contents.json b/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/Contents.json new file mode 100644 index 00000000..6e965652 --- /dev/null +++ b/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/Contents.json @@ -0,0 +1,9 @@ +{ + "info" : { + "author" : "xcode", + "version" : 1 + }, + "properties" : { + "provides-namespace" : true + } +} diff --git a/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/background.colorset/Contents.json b/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/background.colorset/Contents.json new file mode 100644 index 00000000..a36ab82c --- /dev/null +++ b/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/background.colorset/Contents.json @@ -0,0 +1,38 @@ +{ + "colors" : [ + { + "color" : { + "color-space" : "srgb", + "components" : { + "alpha" : "1.000", + "blue" : "0.216", + "green" : "0.173", + "red" : "0.157" + } + }, + "idiom" : "universal" + }, + { + "appearances" : [ + { + "appearance" : "luminosity", + "value" : "dark" + } + ], + "color" : { + "color-space" : "srgb", + "components" : { + "alpha" : "1.000", + "blue" : "0.933", + "green" : "0.933", + "red" : "0.933" + } + }, + "idiom" : "universal" + } + ], + "info" : { + "author" : "xcode", + "version" : 1 + } +} diff --git a/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/background.highlighted.colorset/Contents.json b/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/background.highlighted.colorset/Contents.json new file mode 100644 index 00000000..2dfe8b1c --- /dev/null +++ b/MastodonSDK/Sources/MastodonAsset/Assets.xcassets/Scene/Profile/RelationshipButton/background.highlighted.colorset/Contents.json @@ -0,0 +1,38 @@ +{ + "colors" : [ + { + "color" : { + "color-space" : "srgb", + "components" : { + "alpha" : "1.000", + "blue" : "0.106", + "green" : "0.082", + "red" : "0.075" + } + }, + "idiom" : "universal" + }, + { + "appearances" : [ + { + "appearance" : "luminosity", + "value" : "dark" + } + ], + "color" : { + "color-space" : "srgb", + "components" : { + "alpha" : "1.000", + "blue" : "0.729", + "green" : "0.729", + "red" : "0.729" + } + }, + "idiom" : "universal" + } + ], + "info" : { + "author" : "xcode", + "version" : 1 + } +} diff --git a/MastodonSDK/Sources/MastodonAsset/Generated/Assets.swift b/MastodonSDK/Sources/MastodonAsset/Generated/Assets.swift index 23aa940d..23d724d6 100644 --- a/MastodonSDK/Sources/MastodonAsset/Generated/Assets.swift +++ b/MastodonSDK/Sources/MastodonAsset/Generated/Assets.swift @@ -119,6 +119,10 @@ public enum Asset { public static let nameEditBackgroundGray = ColorAsset(name: "Scene/Profile/Banner/name.edit.background.gray") public static let usernameGray = ColorAsset(name: "Scene/Profile/Banner/username.gray") } + public enum RelationshipButton { + public static let background = ColorAsset(name: "Scene/Profile/RelationshipButton/background") + public static let backgroundHighlighted = ColorAsset(name: "Scene/Profile/RelationshipButton/background.highlighted") + } } public enum Report { public static let background = ColorAsset(name: "Scene/Report/background")