chore: update profile relationship button UI

This commit is contained in:
CMK 2022-02-15 17:13:02 +08:00
parent 0b1dc13894
commit 94470c9f1b
9 changed files with 112 additions and 9 deletions

View File

@ -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),
])

View File

@ -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)

View File

@ -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)

View File

@ -442,6 +442,7 @@ extension ProfileViewModel {
}
}
@available(*, deprecated, message: "")
var backgroundColor: UIColor {
guard let highPriorityAction = self.highPriorityAction(except: []) else {
assertionFailure()

View File

@ -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"

View File

@ -0,0 +1,9 @@
{
"info" : {
"author" : "xcode",
"version" : 1
},
"properties" : {
"provides-namespace" : true
}
}

View File

@ -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
}
}

View File

@ -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
}
}

View File

@ -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")