mbrucedogs/mvm_core_ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'bugfix/tabs_ui' into 'develop'

Browse Source 
tabs update

See merge request BPHV_MIPS/mvm_core_ui!565
This commit is contained in:
Pfeil, Scott Robert 2020-08-18 11:29:52 -04:00
commit 8ae5d7f2a9
2 changed files with 38 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
MVMCoreUI/Atomic/Molecules/HorizontalCombinationViews/Tabs.swift
View File

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

1
MVMCoreUI/Atomic/Molecules/Items/TabsTableViewCell.swift
View File

@ -22,6 +22,7 @@ import UIKit
tabs.paddingBeforeFirstTab = false tabs.paddingBeforeFirstTab = false
tabs.translatesAutoresizingMaskIntoConstraints = false tabs.translatesAutoresizingMaskIntoConstraints = false
tabs.delegate = self tabs.delegate = self
tabs.bottomLine.setStyle(.none)
contentView.addSubview(tabs) contentView.addSubview(tabs)
NSLayoutConstraint.activate(Array(NSLayoutConstraint.pinView(toSuperview: tabs, useMargins: true).values)) NSLayoutConstraint.activate(Array(NSLayoutConstraint.pinView(toSuperview: tabs, useMargins: true).values))