Skip to content

Commit d21db75

Browse files
Merge pull request nathanhosselton#5 from nathanhosselton/hotfix-text-truncating-iPhoneX
Fix layout and sizing issues on certain screens
2 parents 9033d87 + 6ef8b97 commit d21db75

9 files changed

+35
-32
lines changed

BindableView/Label.swift

+6-8
Original file line numberDiff line numberDiff line change
@@ -294,17 +294,15 @@ enum DisplayScale: CGFloat, Comparable {
294294
}
295295
}
296296

297-
/// Returns the provided value scaled to the current display width relative to self. The result
298-
/// is always rounded in the direction of the scaling.
297+
/// Returns the provided value scaled to the current display width relative to self.
299298
/// - parameter value: The value to scale.
300299
func scale(_ value: CGFloat) -> CGFloat {
301300
guard self != .any else { return value }
302-
let scaled = value * (min(UIScreen.main.bounds.width, DisplayScale.maxScaling.rawValue) / rawValue)
303-
return scaled.rounded(scaled < value ? .down : .up)
301+
let scale = min(UIScreen.main.bounds.width, DisplayScale.maxScaling.rawValue) / rawValue
302+
return value * scale
304303
}
305304

306-
/// Returns the provided value scaled to the current display size relative to self. The result
307-
/// is always rounded in the direction of the scaling.
305+
/// Returns the provided value scaled to the current display size relative to self.
308306
///
309307
/// The display's width and height are considered, the latter of which relative to the maximum
310308
/// possible height for the width class. The smallest scale factor is used to scale the result.
@@ -313,8 +311,8 @@ enum DisplayScale: CGFloat, Comparable {
313311
guard self != .any else { return value }
314312
let widthScale = min(UIScreen.main.bounds.width, DisplayScale.maxScaling.rawValue) / rawValue
315313
let heightScale = min(UIScreen.main.bounds.height, DisplayScale.maxScaling.maxHeight) / maxHeight
316-
let scaled = value * min(widthScale, heightScale)
317-
return scaled.rounded(scaled < value ? .down : .up)
314+
let scale = abs(1 - widthScale) > abs(1 - heightScale) ? widthScale : heightScale
315+
return value * scale
318316
}
319317

320318
static func < (lhs: DisplayScale, rhs: DisplayScale) -> Bool {

Fabled/Sources/CardView.swift

+7-5
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ class CardView: UIView {
1414
backgroundColor = Style.Color.cardView
1515

1616
let body = self.body
17-
let inset = DisplayScale.x375.scaleWithHeight(Style.Layout.largeSpacing)
17+
let inset = Style.Layout.largeSpacing
1818

1919
addSubview(body)
2020

@@ -48,6 +48,8 @@ class CardView: UIView {
4848
/// Styling provider for the body text of `CardView`s.
4949
func bodyTextStyling(_ label: UILabel) {
5050
label.font = Style.Font.body.withSize(CardView.Font.bodySize)
51+
label.adjustsFontSizeToFitWidth = true
52+
label.minimumScaleFactor = 0.80
5153
label.textColor = Style.Color.text
5254
}
5355
}
@@ -57,9 +59,9 @@ class CardView: UIView {
5759
extension CardView {
5860
/// A collection of standard font related constants for text inside `CardView`s.
5961
enum Font {
60-
static let titleSize: CGFloat = DisplayScale.x375.scaleWithHeight(60)
61-
static let headingSize: CGFloat = DisplayScale.x375.scaleWithHeight(22)
62-
static let bodySize: CGFloat = DisplayScale.x375.scaleWithHeight(16)
62+
static let titleSize: CGFloat = UIScreen.main.displayScale == .x414 ? 60 : DisplayScale.x375.scaleWithHeight(58)
63+
static let headingSize: CGFloat = UIScreen.main.displayScale == .x414 ? 23 : DisplayScale.x375.scaleWithHeight(21)
64+
static let bodySize: CGFloat = UIScreen.main.displayScale == .x414 ? 16 : DisplayScale.x375.scaleWithHeight(16)
6365
}
6466

6567
/// A collection of spacing related constants for subview layout inside `CardView`s.
@@ -72,6 +74,6 @@ extension CardView {
7274
static let minimumTitleWidth: CGFloat = DisplayScale.x375.scale(76)
7375

7476
/// The maximum value for width of the primary value column of card views.
75-
static let maximumTitleWidth: CGFloat = DisplayScale.x375.scale(110)
77+
static let maximumTitleWidth: CGFloat = DisplayScale.x375.scale(100)
7678
}
7779
}

Fabled/Sources/DebugUIViewController.swift

+5-5
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ final class DebugUIViewController: DeclarativeViewController, RootPresentationVi
5050
PillView(.plain,
5151
Text(currentGlory.binding, " GLORY")
5252
.font(Style.Font.title)
53-
.fontSize(18)
53+
.fontSize(Style.Font.sizeForPill)
5454
.color(Style.Color.text)
5555
.adjustsFontSizeRelativeToDisplay(.x375)
5656
),
@@ -60,7 +60,7 @@ final class DebugUIViewController: DeclarativeViewController, RootPresentationVi
6060
PillView(.emphasized,
6161
Text(playerRankText)
6262
.font(Style.Font.title)
63-
.fontSize(18)
63+
.fontSize(Style.Font.sizeForPill)
6464
.color(Style.Color.text)
6565
.adjustsFontSizeRelativeToDisplay(.x375)
6666
),
@@ -90,13 +90,13 @@ final class DebugUIViewController: DeclarativeViewController, RootPresentationVi
9090
PillView(.emphasized,
9191
Text(winsToFabled.binding)
9292
.font(Style.Font.title)
93-
.fontSize(18)
93+
.fontSize(Style.Font.sizeForPill)
9494
.color(Style.Color.text)
9595
.adjustsFontSizeRelativeToDisplay(.x375)
9696
+
9797
Text(moreWinsText, " FOR FABLED")
9898
.font(Style.Font.title)
99-
.fontSize(18)
99+
.fontSize(Style.Font.sizeForPill)
100100
.color(Style.Color.text)
101101
.adjustsFontSizeRelativeToDisplay(.x375)
102102
),
@@ -127,7 +127,7 @@ final class DebugUIViewController: DeclarativeViewController, RootPresentationVi
127127

128128
Button(#imageLiteral(resourceName: "question_regular_m"))
129129
.observe(with: onMoreInfoPressed)
130-
.size(DisplayScale.x375.scaleWithHeight(23))
130+
.size(DisplayScale.x375.scaleWithHeight(22 + 2))
131131
.tintColor(Style.Color.deemphasized),
132132

133133
Spacer(.flexible)

Fabled/Sources/GloryProfileViewController.swift

+5-5
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ class GloryProfileViewController: DeclarativeViewController, RootPresentationVie
5656
PillView(.plain,
5757
Text(currentGlory, " GLORY")
5858
.font(Style.Font.title)
59-
.fontSize(18)
59+
.fontSize(Style.Font.sizeForPill)
6060
.color(Style.Color.text)
6161
.adjustsFontSizeRelativeToDisplay(.x375)
6262
),
@@ -66,7 +66,7 @@ class GloryProfileViewController: DeclarativeViewController, RootPresentationVie
6666
PillView(.emphasized,
6767
Text(playerRank)
6868
.font(Style.Font.title)
69-
.fontSize(18)
69+
.fontSize(Style.Font.sizeForPill)
7070
.color(Style.Color.text)
7171
.adjustsFontSizeRelativeToDisplay(.x375)
7272
),
@@ -109,13 +109,13 @@ class GloryProfileViewController: DeclarativeViewController, RootPresentationVie
109109
PillView(.emphasized,
110110
Text(winsToFabled)
111111
.font(Style.Font.title)
112-
.fontSize(18)
112+
.fontSize(Style.Font.sizeForPill)
113113
.color(Style.Color.text)
114114
.adjustsFontSizeRelativeToDisplay(.x375)
115115
+
116116
Text(moreWinsText, " FOR FABLED")
117117
.font(Style.Font.title)
118-
.fontSize(18)
118+
.fontSize(Style.Font.sizeForPill)
119119
.color(Style.Color.text)
120120
.adjustsFontSizeRelativeToDisplay(.x375)
121121
),
@@ -146,7 +146,7 @@ class GloryProfileViewController: DeclarativeViewController, RootPresentationVie
146146

147147
Button(#imageLiteral(resourceName: "question_regular_m"))
148148
.observe(with: onMoreInfoPressed)
149-
.size(DisplayScale.x375.scaleWithHeight(22 + 1)) //+1 for visual sizing differences from escape button
149+
.size(DisplayScale.x375.scaleWithHeight(22 + 2)) //+2 for visual sizing differences from escape button
150150
.tintColor(Style.Color.deemphasized),
151151

152152
Spacer(.flexible)

Fabled/Sources/MoreInfoViewController.swift

+1-1
Original file line numberDiff line numberDiff line change
@@ -136,7 +136,7 @@ final class MoreInfoViewController: DeclarativeViewController {
136136
Spacer(10),
137137

138138
StackView(.vertical, [
139-
Button("Meow Pew Pew on Bungie.net")
139+
Button("Meow Pew Pew on Bungie")
140140
.observe(with: onClanPressed),
141141

142142
Text("We're always welcoming chill new members (PC).")

Fabled/Sources/PillView.swift

+2-2
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,8 @@ final class PillView: UIView {
3333

3434
addSubview(body)
3535

36-
let yInset: CGFloat = DisplayScale.x375.scaleWithHeight(8)
37-
let xInset: CGFloat = yInset * 2.333
36+
let yInset: CGFloat = DisplayScale.x375.scaleWithHeight(7)
37+
let xInset: CGFloat = yInset * 2.5
3838

3939
NSLayoutConstraint.activate([
4040
body.topAnchor.constraint(equalTo: topAnchor, constant: yInset),

Fabled/Sources/PlayerSearchViewController.swift

+2-2
Original file line numberDiff line numberDiff line change
@@ -54,13 +54,13 @@ final class PlayerSearchViewController: DeclarativeViewController, RootPresentat
5454

5555
TextField(playerSearchText.binding)
5656
.updatesRateLimited(to: 1.0)
57-
.placeholder("Select a platform" + (UIScreen.main.displayScale > .x320 ? " to narrow search" : ""))
57+
.placeholder("Select a platform to narrow search")
5858
.transforming(when: playerSearchPlatform.binding, updatePlayerSearchFieldPlaceholder)
5959
.rightView(playerSearchActivityIndicator, mode: .always)
6060
.leftView(View().size(19.5), mode: .always) //Compensates for rightView
6161
.endEditingOnReturn()
6262
.font(Style.Font.body)
63-
.fontSize(DisplayScale.x320.scale(16))
63+
.fontSize(DisplayScale.x375.scale(18))
6464
.textAlignment(.center)
6565
.autocorrectionType(.no)
6666
.autocapitalizationType(.none)

Fabled/Sources/Style.swift

+3
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,9 @@ enum Style {
1414

1515
/// The font used for **T H I C C** text.
1616
static let thicc = UIFont.systemFont(ofSize: 20, weight: .bold) //.SFUIDisplay-Bold
17+
18+
/// The font size to use for text that is displayed wiithin `PillView`s.
19+
static let sizeForPill: CGFloat = 17
1720
}
1821

1922
enum Color {

Fabled/Sources/WeeklyBonusCard.swift

+4-4
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ final class WeeklyBonusCard: CardView {
2525

2626
Text(matchesRemainingIndicator)
2727
.font(Style.Font.thicc)
28-
.fontSize(44)
28+
.fontSize(41)
2929
.adjustsFontSizeRelativeToDisplay(.x375)
3030
.color(Style.Color.imperativeText)
3131
.offset(.vertical, -2),
@@ -61,7 +61,7 @@ final class WeeklyBonusCard: CardView {
6161
If(willRankUp).then(
6262
Spacer(CardView.Spacing.heading),
6363

64-
Text("Ranking up".uppercased())
64+
Text("RANKING UP")
6565
.font(Style.Font.heading)
6666
.fontSize(CardView.Font.bodySize)
6767
.color(Style.Color.imperativeText)
@@ -81,8 +81,8 @@ final class WeeklyBonusCard: CardView {
8181
optimisticGloryAtNextResetValue = optimisticGlory.map(String.init)
8282

8383
matchesRemainingIndicator = bonusMet.map { $0 ? "" : "" }
84-
matchesRemainingText = matchesRemaining.map { $0 == 1 ? "Match remaining to" : "Matches remaining to" }
85-
bonusOrDecayText = currentRankDecays.map { $0 ? "avoid decay" : "weekly bonus" }
84+
matchesRemainingText = matchesRemaining.map { $0 == 1 ? "Match remaining" : "Matches remaining" }
85+
bonusOrDecayText = currentRankDecays.map { $0 ? "to avoid decay" : "to weekly bonus" }
8686

8787
super.init()
8888
}

0 commit comments

Comments
 (0)