From 3e3ab07d8a5e2120e7b5e5ddc193bbea15985575 Mon Sep 17 00:00:00 2001 From: robert Date: Sat, 25 Feb 2023 23:41:39 -0600 Subject: [PATCH 1/5] Improves leaderboard layout, enabling full width table view frame with corrected scroll bar positioning while maintaining row padding --- HackIllinois/UI/HILabel.swift | 1 + .../TableView/Cells/HILeaderboardCell.swift | 39 ++++++++++++------- .../HILeaderboardListViewController.swift | 15 ++++--- .../HILeaderboardViewController.swift | 2 +- 4 files changed, 36 insertions(+), 21 deletions(-) diff --git a/HackIllinois/UI/HILabel.swift b/HackIllinois/UI/HILabel.swift index 90f7eb63..bac0a584 100644 --- a/HackIllinois/UI/HILabel.swift +++ b/HackIllinois/UI/HILabel.swift @@ -307,6 +307,7 @@ class HILabel: UILabel { case .leaderboardName: textHIColor = \.leaderboardText backgroundHIColor = \.clear + lineBreakMode = .byTruncatingTail if UIDevice.current.userInterfaceIdiom == .pad { font = HIAppearance.Font.leaderboardNamePad } else { diff --git a/HackIllinois/UI/TableView/Cells/HILeaderboardCell.swift b/HackIllinois/UI/TableView/Cells/HILeaderboardCell.swift index daf8c0e1..a4237792 100644 --- a/HackIllinois/UI/TableView/Cells/HILeaderboardCell.swift +++ b/HackIllinois/UI/TableView/Cells/HILeaderboardCell.swift @@ -33,7 +33,15 @@ class HILeaderboardCell: UITableViewCell { selectionStyle = .none backgroundColor = UIColor.clear contentView.addSubview(cellView) - cellView.constrain(to: safeAreaLayoutGuide, topInset: 0, trailingInset: 0, bottomInset: 0, leadingInset: 0) + + cellView.constrain( + to: safeAreaLayoutGuide, + topInset: 0, + trailingInset: -HILeaderboardCell.padding.right, + bottomInset: 0, + leadingInset: HILeaderboardCell.padding.left + ) + cellView.addSubview(rankLabel) cellView.addSubview(pointsLabel) cellView.addSubview(nameLabel) @@ -44,6 +52,14 @@ class HILeaderboardCell: UITableViewCell { } } +// MARK: - Padding +extension HILeaderboardCell { + static var padding: UIEdgeInsets { + let pad = (UIScreen.main.bounds.width * 0.15) / 2.0 + return UIEdgeInsets(top: 0, left: pad, bottom: 0, right: pad) + } +} + // MARK: - Population extension HILeaderboardCell { static func heightForCell(with group: LeaderboardProfile, width: CGFloat) -> CGFloat { @@ -51,9 +67,9 @@ extension HILeaderboardCell { } static func <- (lhs: HILeaderboardCell, rhs: LeaderboardProfile) { - var padConstant = 1.0 + var padConstant = 25.0 if UIDevice.current.userInterfaceIdiom == .pad { - padConstant = 2.0 + padConstant = 50.0 } lhs.rankLabel.textAlignment = .center lhs.pointsLabel.textAlignment = .center @@ -67,23 +83,18 @@ extension HILeaderboardCell { lhs.nameLabel.textAlignment = .left lhs.rankLabel.centerYAnchor.constraint(equalTo: lhs.cellView.centerYAnchor).isActive = true - lhs.rankLabel.leadingAnchor.constraint(equalTo: lhs.cellView.leadingAnchor, constant: 25 * padConstant).isActive = true - lhs.rankLabel.setContentHuggingPriority(.defaultHigh, for: .horizontal) - + lhs.rankLabel.leadingAnchor.constraint(equalTo: lhs.cellView.leadingAnchor, constant: padConstant).isActive = true + lhs.rankLabel.widthAnchor.constraint(equalToConstant: 30).isActive = true + lhs.pointsLabel.centerYAnchor.constraint(equalTo: lhs.cellView.centerYAnchor).isActive = true lhs.pointsLabel.widthAnchor.constraint(equalTo: lhs.cellView.widthAnchor, multiplier: 0.24).isActive = true lhs.pointsLabel.trailingAnchor.constraint(equalTo: lhs.cellView.trailingAnchor, constant: -25).isActive = true lhs.pointsLabel.heightAnchor.constraint(equalTo: lhs.cellView.heightAnchor, multiplier: 0.38).isActive = true lhs.nameLabel.centerYAnchor.constraint(equalTo: lhs.cellView.centerYAnchor).isActive = true - lhs.nameLabel.leadingAnchor.constraint(equalTo: lhs.rankLabel.leadingAnchor, constant: 50 * padConstant).isActive = true - - if UIDevice.current.userInterfaceIdiom == .pad { - lhs.nameLabel.constrain(width: lhs.contentView.frame.width, height: 40.0) - } else { - lhs.nameLabel.constrain(width: lhs.contentView.frame.width - 185, height: 20.0) - lhs.nameLabel.numberOfLines = 1 - } + lhs.nameLabel.leadingAnchor.constraint(equalTo: lhs.rankLabel.trailingAnchor, constant: padConstant).isActive = true + lhs.nameLabel.trailingAnchor.constraint(equalTo: lhs.pointsLabel.leadingAnchor, constant: -10).isActive = true + lhs.nameLabel.numberOfLines = 1 } } diff --git a/HackIllinois/ViewControllers/HILeaderboardListViewController.swift b/HackIllinois/ViewControllers/HILeaderboardListViewController.swift index 20c06fa5..2fb83338 100644 --- a/HackIllinois/ViewControllers/HILeaderboardListViewController.swift +++ b/HackIllinois/ViewControllers/HILeaderboardListViewController.swift @@ -36,19 +36,22 @@ extension HILeaderboardListViewController { cell <- leaderboardProfile cell.indexPath = indexPath cell.rankLabel.text = "\((indexPath.row) + 1)" - cell.backgroundColor = #colorLiteral(red: 0.7882352941, green: 0.8235294118, blue: 0.8980392157, alpha: 1) + cell.backgroundColor = .clear + + cell.cellView.backgroundColor = #colorLiteral(red: 0.7882352941, green: 0.8235294118, blue: 0.8980392157, alpha: 1) tableView.separatorStyle = .singleLine tableView.separatorInset = UIEdgeInsets() tableView.separatorColor = #colorLiteral(red: 0.04009541315, green: 0.1307413591, blue: 0.3802352191, alpha: 1) + // Round certain corners based on row if indexPath.row == 0 { - cell.layer.cornerRadius = 20 - cell.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner] + cell.cellView.layer.cornerRadius = 20 + cell.cellView.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner] } else if indexPath.row == 9 { - cell.layer.cornerRadius = 20 - cell.layer.maskedCorners = [.layerMinXMaxYCorner, .layerMaxXMaxYCorner] + cell.cellView.layer.cornerRadius = 20 + cell.cellView.layer.maskedCorners = [.layerMinXMaxYCorner, .layerMaxXMaxYCorner] } else { - cell.layer.cornerRadius = 0 + cell.cellView.layer.cornerRadius = 0 } } diff --git a/HackIllinois/ViewControllers/HILeaderboardViewController.swift b/HackIllinois/ViewControllers/HILeaderboardViewController.swift index e9550e03..7d0e4a59 100644 --- a/HackIllinois/ViewControllers/HILeaderboardViewController.swift +++ b/HackIllinois/ViewControllers/HILeaderboardViewController.swift @@ -78,7 +78,7 @@ extension HILeaderboardViewController { tableView.layer.cornerRadius = 8 tableView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 15 * padConstant).isActive = true tableView.heightAnchor.constraint(equalTo: view.safeAreaLayoutGuide.heightAnchor, multiplier: 0.90).isActive = true - tableView.widthAnchor.constraint(equalTo: view.safeAreaLayoutGuide.widthAnchor, multiplier: 0.85).isActive = true + tableView.widthAnchor.constraint(equalTo: view.safeAreaLayoutGuide.widthAnchor, multiplier: 1).isActive = true tableView.centerXAnchor.constraint(equalTo: view.safeAreaLayoutGuide.centerXAnchor).isActive = true self.tableView = tableView } From ecd29248b9f0e6003be81e7849e721629adf4371 Mon Sep 17 00:00:00 2001 From: robert Date: Sat, 25 Feb 2023 23:58:46 -0600 Subject: [PATCH 2/5] Cell inset update to respect new insets --- .../HILeaderboardListViewController.swift | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/HackIllinois/ViewControllers/HILeaderboardListViewController.swift b/HackIllinois/ViewControllers/HILeaderboardListViewController.swift index 2fb83338..834a698b 100644 --- a/HackIllinois/ViewControllers/HILeaderboardListViewController.swift +++ b/HackIllinois/ViewControllers/HILeaderboardListViewController.swift @@ -24,8 +24,18 @@ extension HILeaderboardListViewController { if let tableView = tableView { tableView.register(HILeaderboardCell.self, forCellReuseIdentifier: HILeaderboardCell.identifier) } + super.setupTableView() } + + override func viewDidLoad() { + super.viewDidLoad() + + tableView?.separatorStyle = .singleLine + tableView?.separatorColor = #colorLiteral(red: 0.04009541315, green: 0.1307413591, blue: 0.3802352191, alpha: 1) + tableView?.separatorInset = HILeaderboardCell.padding + tableView?.tableFooterView = UIView() + } } // MARK: - UITableViewDataSource @@ -39,9 +49,6 @@ extension HILeaderboardListViewController { cell.backgroundColor = .clear cell.cellView.backgroundColor = #colorLiteral(red: 0.7882352941, green: 0.8235294118, blue: 0.8980392157, alpha: 1) - tableView.separatorStyle = .singleLine - tableView.separatorInset = UIEdgeInsets() - tableView.separatorColor = #colorLiteral(red: 0.04009541315, green: 0.1307413591, blue: 0.3802352191, alpha: 1) // Round certain corners based on row if indexPath.row == 0 { From 335f420076eb2a807ccea87e17b93ecb03b92420 Mon Sep 17 00:00:00 2001 From: robert Date: Sun, 26 Feb 2023 00:04:43 -0600 Subject: [PATCH 3/5] Move override out of mark --- .../HILeaderboardListViewController.swift | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/HackIllinois/ViewControllers/HILeaderboardListViewController.swift b/HackIllinois/ViewControllers/HILeaderboardListViewController.swift index 834a698b..fb4c03f4 100644 --- a/HackIllinois/ViewControllers/HILeaderboardListViewController.swift +++ b/HackIllinois/ViewControllers/HILeaderboardListViewController.swift @@ -16,6 +16,14 @@ import HIAPI import APIManager class HILeaderboardListViewController: HIBaseViewController { + override func viewDidLoad() { + super.viewDidLoad() + + tableView?.separatorStyle = .singleLine + tableView?.separatorColor = #colorLiteral(red: 0.04009541315, green: 0.1307413591, blue: 0.3802352191, alpha: 1) + tableView?.separatorInset = HILeaderboardCell.padding + tableView?.tableFooterView = UIView() + } } // MARK: - UITableView Setup @@ -27,15 +35,6 @@ extension HILeaderboardListViewController { super.setupTableView() } - - override func viewDidLoad() { - super.viewDidLoad() - - tableView?.separatorStyle = .singleLine - tableView?.separatorColor = #colorLiteral(red: 0.04009541315, green: 0.1307413591, blue: 0.3802352191, alpha: 1) - tableView?.separatorInset = HILeaderboardCell.padding - tableView?.tableFooterView = UIView() - } } // MARK: - UITableViewDataSource From 5f48a2b3f49615928690e0338a2a74f7ab6b0914 Mon Sep 17 00:00:00 2001 From: robert Date: Sun, 26 Feb 2023 00:56:16 -0600 Subject: [PATCH 4/5] Added managed separator view --- .../UI/TableView/Cells/HILeaderboardCell.swift | 15 +++++++++++++++ .../HILeaderboardListViewController.swift | 12 ++++-------- 2 files changed, 19 insertions(+), 8 deletions(-) diff --git a/HackIllinois/UI/TableView/Cells/HILeaderboardCell.swift b/HackIllinois/UI/TableView/Cells/HILeaderboardCell.swift index a4237792..6ff7b973 100644 --- a/HackIllinois/UI/TableView/Cells/HILeaderboardCell.swift +++ b/HackIllinois/UI/TableView/Cells/HILeaderboardCell.swift @@ -20,6 +20,15 @@ class HILeaderboardCell: UITableViewCell { let nameLabel = HILabel(style: .leaderboardName) let rankLabel = HILabel(style: .leaderboardRank) let pointsLabel = HILabel(style: .leaderboardPoints) + + // iOS 16 TableView did not respect separator inset for + // first and last rows, add managed equivalent + let separatorView: UIView = { + let separatorView = UIView() + separatorView.backgroundColor = #colorLiteral(red: 0.04009541315, green: 0.1307413591, blue: 0.3802352191, alpha: 1) + separatorView.translatesAutoresizingMaskIntoConstraints = false + return separatorView + }() var cellView = HIView { $0.clipsToBounds = true @@ -45,6 +54,7 @@ class HILeaderboardCell: UITableViewCell { cellView.addSubview(rankLabel) cellView.addSubview(pointsLabel) cellView.addSubview(nameLabel) + cellView.addSubview(separatorView) } required init?(coder aDecoder: NSCoder) { @@ -95,6 +105,11 @@ extension HILeaderboardCell { lhs.nameLabel.leadingAnchor.constraint(equalTo: lhs.rankLabel.trailingAnchor, constant: padConstant).isActive = true lhs.nameLabel.trailingAnchor.constraint(equalTo: lhs.pointsLabel.leadingAnchor, constant: -10).isActive = true lhs.nameLabel.numberOfLines = 1 + + lhs.separatorView.leadingAnchor.constraint(equalTo: lhs.cellView.leadingAnchor).isActive = true + lhs.separatorView.trailingAnchor.constraint(equalTo: lhs.cellView.trailingAnchor).isActive = true + lhs.separatorView.bottomAnchor.constraint(equalTo: lhs.cellView.bottomAnchor).isActive = true + lhs.separatorView.heightAnchor.constraint(equalToConstant: 1/UIScreen.main.scale).isActive = true } } diff --git a/HackIllinois/ViewControllers/HILeaderboardListViewController.swift b/HackIllinois/ViewControllers/HILeaderboardListViewController.swift index fb4c03f4..0f87a86f 100644 --- a/HackIllinois/ViewControllers/HILeaderboardListViewController.swift +++ b/HackIllinois/ViewControllers/HILeaderboardListViewController.swift @@ -16,14 +16,7 @@ import HIAPI import APIManager class HILeaderboardListViewController: HIBaseViewController { - override func viewDidLoad() { - super.viewDidLoad() - - tableView?.separatorStyle = .singleLine - tableView?.separatorColor = #colorLiteral(red: 0.04009541315, green: 0.1307413591, blue: 0.3802352191, alpha: 1) - tableView?.separatorInset = HILeaderboardCell.padding - tableView?.tableFooterView = UIView() - } + } // MARK: - UITableView Setup @@ -53,11 +46,14 @@ extension HILeaderboardListViewController { if indexPath.row == 0 { cell.cellView.layer.cornerRadius = 20 cell.cellView.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner] + cell.separatorView.isHidden = false } else if indexPath.row == 9 { cell.cellView.layer.cornerRadius = 20 cell.cellView.layer.maskedCorners = [.layerMinXMaxYCorner, .layerMaxXMaxYCorner] + cell.separatorView.isHidden = true } else { cell.cellView.layer.cornerRadius = 0 + cell.separatorView.isHidden = false } } From 75a445e16fb2d885dec53837f68bcc29d9f027db Mon Sep 17 00:00:00 2001 From: Lasya <44485522+lasyaneti@users.noreply.github.com> Date: Tue, 8 Aug 2023 12:18:36 -0700 Subject: [PATCH 5/5] Empty commit to trigger build/lint workflow --- HackIllinois/UI/HILabel.swift | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/HackIllinois/UI/HILabel.swift b/HackIllinois/UI/HILabel.swift index bac0a584..676cb09e 100644 --- a/HackIllinois/UI/HILabel.swift +++ b/HackIllinois/UI/HILabel.swift @@ -7,7 +7,7 @@ // This file is part of the Hackillinois iOS App. // The Hackillinois iOS App is open source software, released under the University of // Illinois/NCSA Open Source License. You should have received a copy of -// this license in a file with the distribution. +// this license in a file with the distribution. // import Foundation