tabs update
This commit is contained in:
parent
773166ae31
commit
62abf18662
@ -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
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user