tabs update

This commit is contained in:
Pfeil, Scott Robert 2020-08-18 10:38:01 -04:00
parent 773166ae31
commit 62abf18662

View File

@ -27,9 +27,10 @@ import UIKit
let bottomScrollView = UIScrollView(frame: .zero)
let bottomContentView = View()
let bottomLine = View()
var bottomLineLeftConstraint: NSLayoutConstraint?
var bottomLineWidthConstraint: NSLayoutConstraint?
let bottomLine = Line()
let selectionLine = View()
var selectionLineLeftConstraint: NSLayoutConstraint?
var selectionLineWidthConstraint: NSLayoutConstraint?
private var widthLabel = Label()
@ -45,11 +46,10 @@ import UIKit
let TabCellId = "TabCell"
public let sectionPadding: CGFloat = 20.0
public let cellSpacing: CGFloat = 34.0
public let cellHeight: CGFloat = 34.0
public let bottomLineHeight: CGFloat = 4.0
public let bottomLineWidth: CGFloat = 32.0
public let tabsHeight: CGFloat = 38.0
public let bottomLineMovingTime: TimeInterval = 0.2
public let cellHeight: CGFloat = 27.0
public let selectionLineHeight: CGFloat = 4.0
public let selectionLineWidth: CGFloat = 32.0
public let selectionLineMovingTime: TimeInterval = 0.2
//-------------------------------------------------
// MARK:- Layout Views
@ -57,9 +57,9 @@ import UIKit
open override func reset() {
super.reset()
heightConstraint?.constant = tabsHeight
selectedIndex = 0
paddingBeforeFirstTab = true
bottomLine.setStyle(.none)
}
open override func updateView(_ size: CGFloat) {
@ -69,8 +69,10 @@ import UIKit
open override func setupView() {
super.setupView()
backgroundColor = .white
bottomLine.setStyle(.none)
addSubview(bottomLine)
setupCollectionView()
setupBottomLine()
setupSelectionLine()
setupConstraints()
}
@ -90,46 +92,42 @@ import UIKit
self.collectionView = collectionView
}
func setupBottomLine() {
func setupSelectionLine() {
bottomScrollView.translatesAutoresizingMaskIntoConstraints = false
bottomScrollView.delegate = self
addSubview(bottomScrollView)
bottomScrollView.addSubview(bottomContentView)
bottomLine.backgroundColor = .mvmRed
bottomContentView.addSubview(bottomLine)
selectionLine.backgroundColor = .mvmRed
bottomContentView.addSubview(selectionLine)
bringSubviewToFront(bottomScrollView)
}
func setupConstraints() {
//collection view
NSLayoutConstraint.constraintPinSubview(toSuperview: collectionView)
NSLayoutConstraint.constraintPinSubview(collectionView, pinTop: true, pinBottom: false, pinLeft: true, pinRight: true)
collectionView?.heightAnchor.constraint(equalToConstant: cellHeight).isActive = true
//bottom lines
NSLayoutConstraint.constraintPinSubview(bottomScrollView, pinTop: false, pinBottom: true, pinLeft: true, pinRight: true)
bottomScrollView.heightAnchor.constraint(equalToConstant: bottomLineHeight).isActive = true
NSLayoutConstraint.constraintPinSubview(bottomLine, pinTop: true, pinBottom: true, pinLeft: false, pinRight: false)
bottomLine.heightAnchor.constraint(equalToConstant: bottomLineHeight).isActive = true
bottomLineLeftConstraint = bottomLine.leftAnchor.constraint(equalTo: bottomContentView.leftAnchor)
bottomLineLeftConstraint?.isActive = true
bottomLineWidthConstraint = bottomLine.widthAnchor.constraint(equalToConstant: bottomLineWidth)
bottomLineWidthConstraint?.isActive = true
//selection line
bottomScrollView.topAnchor.constraint(equalTo: collectionView!.bottomAnchor).isActive = true;
NSLayoutConstraint.constraintPinSubview(bottomScrollView, pinTop: false, pinBottom: false, pinLeft: true, pinRight: true)
bottomScrollView.heightAnchor.constraint(equalToConstant: selectionLineHeight).isActive = true
NSLayoutConstraint.constraintPinSubview(selectionLine, pinTop: true, pinBottom: true, pinLeft: false, pinRight: false)
selectionLine.heightAnchor.constraint(equalToConstant: selectionLineHeight).isActive = true
selectionLineLeftConstraint = selectionLine.leftAnchor.constraint(equalTo: bottomContentView.leftAnchor)
selectionLineLeftConstraint?.isActive = true
selectionLineWidthConstraint = selectionLine.widthAnchor.constraint(equalToConstant: selectionLineWidth)
selectionLineWidthConstraint?.isActive = true
NSLayoutConstraint.constraintPinSubview(toSuperview: bottomContentView)
//height
heightConstraint = heightAnchor.constraint(equalToConstant: tabsHeight)
heightConstraint?.isActive = true
//bottom line
bottomLine.topAnchor.constraint(equalTo: bottomScrollView.bottomAnchor).isActive = true;
NSLayoutConstraint.constraintPinSubview(bottomLine, pinTop: false, pinBottom: true, pinLeft: true, pinRight: true)
}
//-------------------------------------------------
// MARK:- Control Methods
//-------------------------------------------------
public func pinHeight(_ height: CGFloat) {
heightConstraint?.constant = height
setNeedsLayout()
layoutIfNeeded()
}
public func selectIndex(_ index: Int, animated: Bool) {
guard let _ = collectionView, tabsModel?.tabs.count ?? 0 > 0 else {
selectedIndex = index
@ -159,7 +157,7 @@ import UIKit
self.additionalData = additionalData
selectedIndex = tabsModel?.selectedIndex ?? 0
// TODO: Commented out until we have model support for bar color. Should also do unselected color.
//bottomLine.backgroundColor = tabsModel?.selectedColor.uiColor
//selectionLine.backgroundColor = tabsModel?.selectedColor.uiColor
reloadData()
}
}
@ -224,7 +222,7 @@ extension Tabs: UICollectionViewDelegateFlowLayout {
public func collectionView(_ collectionView: UICollectionView, willDisplay cell: UICollectionViewCell, forItemAt indexPath: IndexPath) {
guard let tabCell = cell as? TabItemCell else { return }
if indexPath.row == selectedIndex {
moveBottomLine(toIndex: indexPath, animated: false, cell: tabCell)
moveSelectionLine(toIndex: indexPath, animated: false, cell: tabCell)
}
}
@ -239,7 +237,7 @@ extension Tabs: UICollectionViewDelegateFlowLayout {
collect.selectItem(at: indexPath, animated: animated, scrollPosition: .centeredHorizontally)
guard let tabCell = collect.cellForItem(at: indexPath) as? TabItemCell, let tabsModel = self.tabsModel else { return }
moveBottomLine(toIndex: indexPath, animated: animated, cell: tabCell)
moveSelectionLine(toIndex: indexPath, animated: animated, cell: tabCell)
tabCell.label.textColor = tabsModel.selectedColor.uiColor
tabCell.updateAccessibility(indexPath: indexPath, selected: true, tabsModel: tabsModel)
tabCell.setNeedsDisplay()
@ -266,20 +264,20 @@ extension Tabs: UIScrollViewDelegate {
// MARK:- Bottom Line Methods
//-------------------------------------------------
extension Tabs {
func moveBottomLine(toIndex indexPath: IndexPath, animated: Bool, cell: TabItemCell) {
func moveSelectionLine(toIndex indexPath: IndexPath, animated: Bool, cell: TabItemCell) {
guard let collect = self.collectionView else {return}
let size = collectionView(collect, layout: layout, sizeForItemAt: indexPath)
let barWidth = max(size.width, bottomLineWidth)
let barWidth = max(size.width, selectionLineWidth)
let animationBlock = {
[weak self] in
let x = cell.frame.origin.x
self?.bottomLineWidthConstraint?.constant = barWidth
self?.bottomLineLeftConstraint?.constant = x + (size.width - barWidth) / 2.0
self?.selectionLineWidthConstraint?.constant = barWidth
self?.selectionLineLeftConstraint?.constant = x + (size.width - barWidth) / 2.0
self?.bottomContentView.layoutIfNeeded()
}
if animated {
UIView.animate(withDuration: bottomLineMovingTime, animations: animationBlock)
UIView.animate(withDuration: selectionLineMovingTime, animations: animationBlock)
} else {
animationBlock()
}
@ -293,8 +291,7 @@ extension Tabs {
public override func setupView() {
super.setupView()
contentView.addSubview(label)
NSLayoutConstraint.constraintPinSubview(label, pinTop: false, pinBottom: false, pinLeft: true, pinRight: true)
label.centerYAnchor.constraint(equalTo: contentView.centerYAnchor).isActive = true
NSLayoutConstraint.constraintPinSubview(label, pinTop: false, topConstant: 0, pinBottom: true, bottomConstant: 6, pinLeft: true, leftConstant: 0, pinRight: true, rightConstant: 0)
label.baselineAdjustment = .alignCenters
}