Skip to content
This repository has been archived by the owner on May 10, 2024. It is now read-only.

Ref #8078: Improve tab bar look with new colours #8138

Merged
merged 1 commit into from
Sep 25, 2023
Merged

Ref #8078: Improve tab bar look with new colours #8138

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 21 additions & 24 deletions Sources/Brave/Frontend/Browser/Tabs/TabBar/TabBarCell.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,17 +23,17 @@ class TabBarCell: UICollectionViewCell {
button.imageEdgeInsets.left = 6
return button
}()

private let separatorLine = UIView()

let separatorLineRight = UIView().then {
$0.isHidden = true

private let highlightView = UIView().then {
$0.layer.cornerRadius = 4
$0.layer.cornerCurve = .continuous
$0.layer.shadowOffset = CGSize(width: 0, height: 1)
$0.layer.shadowRadius = 2
}

var currentIndex: Int = -1 {
didSet {
isSelected = currentIndex == tabManager?.currentDisplayedIndex
separatorLine.isHidden = currentIndex == 0
}
}
weak var tab: Tab?
Expand All @@ -56,7 +56,7 @@ class TabBarCell: UICollectionViewCell {
override init(frame: CGRect) {
super.init(frame: frame)

[closeButton, titleLabel, separatorLine, separatorLineRight].forEach { contentView.addSubview($0) }
[highlightView, closeButton, titleLabel].forEach { contentView.addSubview($0) }
initConstraints()
updateFont()

Expand All @@ -66,9 +66,10 @@ class TabBarCell: UICollectionViewCell {
private var privateModeCancellable: AnyCancellable?
private func updateColors() {
let browserColors: any BrowserColors = tabManager?.privateBrowsingManager.browserColors ?? .standard
separatorLine.backgroundColor = browserColors.dividerSubtle
separatorLineRight.backgroundColor = browserColors.dividerSubtle
backgroundColor = isSelected ? browserColors.tabBarTabActiveBackground : browserColors.tabBarTabBackground
backgroundColor = browserColors.tabBarTabBackground
highlightView.backgroundColor = isSelected ? browserColors.tabBarTabActiveBackground : .clear
highlightView.layer.shadowOpacity = isSelected ? 0.05 : 0.0
highlightView.layer.shadowColor = UIColor.black.cgColor
closeButton.tintColor = browserColors.iconDefault
titleLabel.textColor = isSelected ? browserColors.textPrimary : browserColors.textSecondary
}
Expand All @@ -78,6 +79,10 @@ class TabBarCell: UICollectionViewCell {
}

private func initConstraints() {
highlightView.snp.makeConstraints {
$0.edges.equalToSuperview().inset(2)
}

titleLabel.snp.makeConstraints { make in
make.top.bottom.equalTo(self)
make.left.equalTo(self).inset(16)
Expand All @@ -89,20 +94,6 @@ class TabBarCell: UICollectionViewCell {
make.right.equalTo(self).inset(2)
make.width.equalTo(30)
}

separatorLine.snp.makeConstraints { make in
make.left.equalTo(self)
make.width.equalTo(0.5)
make.height.equalTo(self)
make.centerY.equalTo(self.snp.centerY)
}

separatorLineRight.snp.makeConstraints { make in
make.right.equalTo(self)
make.width.equalTo(0.5)
make.height.equalTo(self)
make.centerY.equalTo(self.snp.centerY)
}
}

override var isSelected: Bool {
Expand Down Expand Up @@ -153,4 +144,10 @@ class TabBarCell: UICollectionViewCell {
strongSelf.titleLabel.text = tab.displayTitle
}
}

override func layoutSubviews() {
super.layoutSubviews()

highlightView.layer.shadowPath = UIBezierPath(roundedRect: highlightView.bounds, cornerRadius: 4).cgPath
}
}
3 changes: 1 addition & 2 deletions Sources/Brave/Frontend/Browser/Tabs/TabBar/TabsBarViewController.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ class TabsBarViewController: UIViewController {
private var privateModeCancellable: AnyCancellable?
private func updateColors() {
let browserColors: any BrowserColors = tabManager?.privateBrowsingManager.browserColors ?? .standard
view.backgroundColor = browserColors.chromeBackground
view.backgroundColor = browserColors.tabBarTabBackground
collectionView.backgroundColor = view.backgroundColor
}

Expand Down Expand Up @@ -384,7 +384,6 @@ extension TabsBarViewController: UICollectionViewDataSource {
cell.tab = tab
cell.titleLabel.text = tab.displayTitle
cell.currentIndex = indexPath.row
cell.separatorLineRight.isHidden = (indexPath.row != tabList.count() - 1)
cell.configure()

cell.closeTabCallback = { [weak self] tab in
Expand Down