From 1b74df7f27c28d08895e3fba4df8807c3a88477b Mon Sep 17 00:00:00 2001 From: CMK Date: Mon, 25 Oct 2021 18:08:33 +0800 Subject: [PATCH] chore: update trends card UI --- ...earchRecommendTagsCollectionViewCell.swift | 32 +++++++++++++------ .../Search/Search/SearchViewController.swift | 3 ++ .../Search/Search/View/LineChartView.swift | 22 ++++++------- 3 files changed, 36 insertions(+), 21 deletions(-) diff --git a/Mastodon/Scene/Search/Search/CollectionViewCell/SearchRecommendTagsCollectionViewCell.swift b/Mastodon/Scene/Search/Search/CollectionViewCell/SearchRecommendTagsCollectionViewCell.swift index a538d30bf..3734bc8a4 100644 --- a/Mastodon/Scene/Search/Search/CollectionViewCell/SearchRecommendTagsCollectionViewCell.swift +++ b/Mastodon/Scene/Search/Search/CollectionViewCell/SearchRecommendTagsCollectionViewCell.swift @@ -17,7 +17,7 @@ class SearchRecommendTagsCollectionViewCell: UICollectionViewCell { let hashtagTitleLabel: UILabel = { let label = UILabel() - label.textColor = .label + label.textColor = .white label.font = .systemFont(ofSize: 20, weight: .semibold) label.lineBreakMode = .byTruncatingTail return label @@ -25,7 +25,7 @@ class SearchRecommendTagsCollectionViewCell: UICollectionViewCell { let peopleLabel: UILabel = { let label = UILabel() - label.textColor = .label + label.textColor = .white label.font = .preferredFont(forTextStyle: .body) return label }() @@ -48,7 +48,7 @@ class SearchRecommendTagsCollectionViewCell: UICollectionViewCell { override var isHighlighted: Bool { didSet { - backgroundColor = isHighlighted ? .systemBackground.withAlphaComponent(0.8) : .systemBackground + backgroundColor = isHighlighted ? Asset.Colors.brandBlueDarken20.color : Asset.Colors.brandBlue.color } } } @@ -62,7 +62,7 @@ extension SearchRecommendTagsCollectionViewCell { } private func configure() { - backgroundColor = .systemBackground + backgroundColor = Asset.Colors.brandBlue.color layer.cornerRadius = 10 layer.cornerCurve = .continuous clipsToBounds = false @@ -96,14 +96,26 @@ extension SearchRecommendTagsCollectionViewCell { containerStackView.addArrangedSubview(hashtagTitleLabel) containerStackView.addArrangedSubview(peopleLabel) - lineChartView.translatesAutoresizingMaskIntoConstraints = false - contentView.addSubview(lineChartView) + let lineChartContainer = UIView() + lineChartContainer.translatesAutoresizingMaskIntoConstraints = false + contentView.addSubview(lineChartContainer) NSLayoutConstraint.activate([ - lineChartView.topAnchor.constraint(equalTo: containerStackView.bottomAnchor, constant: 8), - lineChartView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16), - contentView.trailingAnchor.constraint(equalTo: lineChartView.trailingAnchor, constant: 16), - contentView.bottomAnchor.constraint(equalTo: lineChartView.bottomAnchor, constant: 16), + lineChartContainer.topAnchor.constraint(equalTo: containerStackView.bottomAnchor, constant: 12), + lineChartContainer.leadingAnchor.constraint(equalTo: contentView.leadingAnchor), + contentView.trailingAnchor.constraint(equalTo: lineChartContainer.trailingAnchor), + contentView.bottomAnchor.constraint(equalTo: lineChartContainer.bottomAnchor, constant: 12), ]) + lineChartContainer.layer.masksToBounds = true + + lineChartView.translatesAutoresizingMaskIntoConstraints = false + lineChartContainer.addSubview(lineChartView) + NSLayoutConstraint.activate([ + lineChartView.topAnchor.constraint(equalTo: lineChartContainer.topAnchor, constant: 4), + lineChartView.leadingAnchor.constraint(equalTo: lineChartContainer.leadingAnchor), + lineChartView.trailingAnchor.constraint(equalTo: lineChartContainer.trailingAnchor), + lineChartContainer.bottomAnchor.constraint(equalTo: lineChartView.bottomAnchor, constant: 4), + ]) + } func config(with tag: Mastodon.Entity.Tag) { diff --git a/Mastodon/Scene/Search/Search/SearchViewController.swift b/Mastodon/Scene/Search/Search/SearchViewController.swift index c72945927..8dcf9cd3b 100644 --- a/Mastodon/Scene/Search/Search/SearchViewController.swift +++ b/Mastodon/Scene/Search/Search/SearchViewController.swift @@ -23,6 +23,9 @@ final class SearchViewController: UIViewController, NeedsDependency { public static var hashtagCardHeight: CGFloat { get { + if UIScreen.main.bounds.size.height > 736 { + return 186 + } return 130 } } diff --git a/Mastodon/Scene/Search/Search/View/LineChartView.swift b/Mastodon/Scene/Search/Search/View/LineChartView.swift index 2fb8ac733..a64aa270d 100644 --- a/Mastodon/Scene/Search/Search/View/LineChartView.swift +++ b/Mastodon/Scene/Search/Search/View/LineChartView.swift @@ -19,7 +19,7 @@ final class LineChartView: UIView { let lineShapeLayer = CAShapeLayer() let gradientLayer = CAGradientLayer() - let dotShapeLayer = CAShapeLayer() +// let dotShapeLayer = CAShapeLayer() override init(frame: CGRect) { super.init(frame: frame) @@ -37,14 +37,14 @@ extension LineChartView { private func _init() { lineShapeLayer.frame = bounds gradientLayer.frame = bounds - dotShapeLayer.frame = bounds +// dotShapeLayer.frame = bounds layer.addSublayer(lineShapeLayer) layer.addSublayer(gradientLayer) - layer.addSublayer(dotShapeLayer) +// layer.addSublayer(dotShapeLayer) gradientLayer.colors = [ - Asset.Colors.brandBlue.color.withAlphaComponent(0.5).cgColor, - Asset.Colors.brandBlue.color.withAlphaComponent(0).cgColor, + UIColor.white.withAlphaComponent(0.5).cgColor, + UIColor.white.withAlphaComponent(0).cgColor, ] gradientLayer.startPoint = CGPoint(x: 0.5, y: 0) gradientLayer.endPoint = CGPoint(x: 0.5, y: 1) @@ -55,11 +55,11 @@ extension LineChartView { lineShapeLayer.frame = bounds gradientLayer.frame = bounds - dotShapeLayer.frame = bounds +// dotShapeLayer.frame = bounds guard data.count > 1 else { lineShapeLayer.path = nil - dotShapeLayer.path = nil +// dotShapeLayer.path = nil gradientLayer.isHidden = true return } @@ -96,7 +96,7 @@ extension LineChartView { } lineShapeLayer.lineWidth = 3 - lineShapeLayer.strokeColor = Asset.Colors.brandBlue.color.cgColor + lineShapeLayer.strokeColor = UIColor.white.cgColor lineShapeLayer.fillColor = UIColor.clear.cgColor lineShapeLayer.lineJoin = .round lineShapeLayer.lineCap = .round @@ -113,8 +113,8 @@ extension LineChartView { maskLayer.lineWidth = 0.0 gradientLayer.mask = maskLayer - dotShapeLayer.lineWidth = 3 - dotShapeLayer.fillColor = Asset.Colors.brandBlue.color.cgColor - dotShapeLayer.path = dotPath.cgPath +// dotShapeLayer.lineWidth = 3 +// dotShapeLayer.fillColor = Asset.Colors.brandBlue.color.cgColor +// dotShapeLayer.path = dotPath.cgPath } }