Some appearance tweaks

This commit is contained in:
James Magahern
2021-06-14 16:32:51 -07:00
parent ecee3bd9bb
commit d959342180
5 changed files with 46 additions and 18 deletions

View File

@@ -11,12 +11,12 @@ class ReliefButton: UIButton
{ {
public var constrainedToSquare = true public var constrainedToSquare = true
internal var cornerRadius = CGFloat(8.0) { didSet { setNeedsLayout() } }
internal let shadowView = UIView(frame: .zero) internal let shadowView = UIView(frame: .zero)
internal let backgroundView = GradientView(direction: .vertical, colors: ReliefButton.gradientColors(inverted: false, darkMode: false)) internal let backgroundView = GradientView(direction: .vertical, colors: ReliefButton.gradientColors(inverted: false, darkMode: false))
static let padding = CGFloat(24.0) static let padding = CGFloat(24.0)
static let cornerRadius = CGFloat(6.0) static let borderWidth = CGFloat(1.0 / UIScreen.main.scale)
static let borderWidth = CGFloat(1.0)
override var isHighlighted: Bool { override var isHighlighted: Bool {
get { get {
@@ -53,14 +53,12 @@ class ReliefButton: UIButton
shadowView.layer.shadowOffset = CGSize(width: 0.0, height: 1.0) shadowView.layer.shadowOffset = CGSize(width: 0.0, height: 1.0)
shadowView.layer.shadowRadius = 1.0 shadowView.layer.shadowRadius = 1.0
shadowView.layer.shadowOpacity = 1.0 shadowView.layer.shadowOpacity = 1.0
shadowView.layer.cornerRadius = Self.cornerRadius
shadowView.layer.masksToBounds = false shadowView.layer.masksToBounds = false
shadowView.layer.shouldRasterize = true shadowView.layer.shouldRasterize = true
shadowView.layer.rasterizationScale = UIScreen.main.scale shadowView.layer.rasterizationScale = UIScreen.main.scale
shadowView.layer.cornerCurve = .continuous shadowView.layer.cornerCurve = .continuous
addSubview(shadowView) addSubview(shadowView)
backgroundView.layer.cornerRadius = Self.cornerRadius
backgroundView.isUserInteractionEnabled = false backgroundView.isUserInteractionEnabled = false
backgroundView.layer.masksToBounds = true backgroundView.layer.masksToBounds = true
backgroundView.layer.borderWidth = Self.borderWidth backgroundView.layer.borderWidth = Self.borderWidth
@@ -85,7 +83,7 @@ class ReliefButton: UIButton
if darkMode { if darkMode {
if !inverted { if !inverted {
return [ return [
UIColor(white: 0.30, alpha: 1.0), UIColor(white: 0.20, alpha: 1.0),
UIColor(white: 0.10, alpha: 1.0) UIColor(white: 0.10, alpha: 1.0)
] ]
} else { } else {
@@ -159,7 +157,10 @@ class ReliefButton: UIButton
shadowView.frame = backgroundView.frame shadowView.frame = backgroundView.frame
let shadowPath = UIBezierPath(roundedRect: shadowView.bounds, cornerRadius: Self.cornerRadius) let shadowPath = UIBezierPath(roundedRect: shadowView.bounds, cornerRadius: cornerRadius)
shadowView.layer.shadowPath = shadowPath.cgPath shadowView.layer.shadowPath = shadowPath.cgPath
backgroundView.layer.cornerRadius = cornerRadius
shadowView.layer.cornerRadius = cornerRadius
} }
} }

View File

@@ -27,7 +27,8 @@ class SegmentedReliefButton: ReliefButton
self.children = children self.children = children
backgroundsContainerView.clipsToBounds = true backgroundsContainerView.clipsToBounds = true
backgroundsContainerView.layer.cornerRadius = Self.cornerRadius - Self.borderWidth backgroundsContainerView.layer.cornerRadius = self.cornerRadius + Self.borderWidth + 1.0
backgroundsContainerView.layer.cornerCurve = .continuous
constrainedToSquare = false constrainedToSquare = false
@@ -49,7 +50,7 @@ class SegmentedReliefButton: ReliefButton
return result + button.sizeThatFits(size).width return result + button.sizeThatFits(size).width
} }
return CGSize(width: width, height: ourSize.height) return CGSize(width: width + (2 * Self.borderWidth), height: ourSize.height)
} }
override func setBackgroundInverted(_ inverted: Bool) { override func setBackgroundInverted(_ inverted: Bool) {
@@ -66,18 +67,25 @@ class SegmentedReliefButton: ReliefButton
childrenHighlighObservations.removeAll() childrenHighlighObservations.removeAll()
backgroundsContainerView.subviews.forEach { $0.removeFromSuperview() } backgroundsContainerView.subviews.forEach { $0.removeFromSuperview() }
let paddedSize = CGSize(
width: bounds.size.width - (Self.borderWidth * 2.0),
height: bounds.size.height - (Self.borderWidth * 2.0)
)
let darkMode = self.traitCollection.userInterfaceStyle == .dark let darkMode = self.traitCollection.userInterfaceStyle == .dark
var buttonRect = CGRect(origin: .zero, size: CGSize(width: 0, height: bounds.height)) var buttonXOffset = CGFloat(Self.borderWidth)
for (i, child) in children.enumerated() { for (i, child) in children.enumerated() {
child.shadowView.isHidden = true child.shadowView.isHidden = true
child.backgroundView.isHidden = true child.backgroundView.isHidden = true
bringSubviewToFront(child) bringSubviewToFront(child)
let childSize = child.sizeThatFits(bounds.size) let childSize = child.sizeThatFits(paddedSize)
buttonRect.size = CGSize(width: childSize.width, height: bounds.height) child.frame = CGRect(
child.frame = buttonRect origin: CGPoint(x: buttonXOffset, y: Self.borderWidth),
size: CGSize(width: childSize.width, height: paddedSize.height)
)
buttonRect.origin.x += buttonRect.width buttonXOffset += child.frame.width
// Background // Background
let backgroundView = GradientView(direction: .vertical, colors: Self.gradientColors(inverted: false, darkMode: darkMode)) let backgroundView = GradientView(direction: .vertical, colors: Self.gradientColors(inverted: false, darkMode: darkMode))
@@ -92,7 +100,7 @@ class SegmentedReliefButton: ReliefButton
let separatorView = UIView(frame: CGRect( let separatorView = UIView(frame: CGRect(
x: child.frame.maxX, x: child.frame.maxX,
y: 0, y: 0,
width: 1.0, width: 1.0 / UIScreen.main.scale,
height: bounds.height height: bounds.height
)) ))
separatorView.backgroundColor = .systemFill separatorView.backgroundColor = .systemFill

View File

@@ -6,6 +6,7 @@
// //
import UIKit import UIKit
import QuartzCore_Private
class TitlebarView: UIView class TitlebarView: UIView
{ {
@@ -15,10 +16,16 @@ class TitlebarView: UIView
UIColor(red: 0.153, green: 0.000, blue: 0.153, alpha: 1.0) UIColor(red: 0.153, green: 0.000, blue: 0.153, alpha: 1.0)
]) ])
private let separatorView = UIView(frame: .zero)
convenience init() { convenience init() {
self.init(frame: .zero) self.init(frame: .zero)
addSubview(backgroundView) addSubview(backgroundView)
addSubview(titleLabelView) addSubview(titleLabelView)
addSubview(separatorView)
separatorView.backgroundColor = UIColor(white: 1.0, alpha: 0.20)
separatorView.layer.compositingFilter = kCAFilterPlusL
titleLabelView.textColor = .white titleLabelView.textColor = .white
titleLabelView.layer.shadowColor = UIColor.black.cgColor titleLabelView.layer.shadowColor = UIColor.black.cgColor
@@ -61,5 +68,8 @@ class TitlebarView: UIView
backgroundView.frame = bounds backgroundView.frame = bounds
titleLabelView.frame = bounds.avoiding(verticalInsets: safeAreaInsets).insetBy(dx: 8.0 + layoutMargins.left, dy: 0.0) titleLabelView.frame = bounds.avoiding(verticalInsets: safeAreaInsets).insetBy(dx: 8.0 + layoutMargins.left, dy: 0.0)
let separatorHeight = 1.0 / UIScreen.main.scale
separatorView.frame = CGRect(x: 0, y: bounds.height - separatorHeight, width: bounds.width, height: separatorHeight)
} }
} }

View File

@@ -14,7 +14,16 @@ class ToolbarView: UIView
var cancelButtonVisible: Bool = false { didSet { layoutSubviews() } } var cancelButtonVisible: Bool = false { didSet { layoutSubviews() } }
let containerView = UIView(frame: .zero) let containerView = UIView(frame: .zero)
let backgroundView = GradientView(direction: .vertical, colors: [.tertiarySystemGroupedBackground, .secondarySystemGroupedBackground]) let backgroundView = GradientView(direction: .vertical, colors: [
.init(dynamicProvider: { traits in
if traits.userInterfaceStyle == .dark {
return UIColor(white: 0.15, alpha: 1.0)
} else {
return UIColor.tertiarySystemGroupedBackground
}
}),
.secondarySystemGroupedBackground
])
let cancelButton = UIButton(type: .system) let cancelButton = UIButton(type: .system)
let leadingButtonsView = ToolbarButtonContainerView(frame: .zero) let leadingButtonsView = ToolbarButtonContainerView(frame: .zero)
@@ -34,9 +43,9 @@ class ToolbarView: UIView
layer.masksToBounds = false layer.masksToBounds = false
layer.shadowColor = UIColor.black.cgColor layer.shadowColor = UIColor.black.cgColor
layer.shadowOpacity = 0.2 layer.shadowOpacity = 0.3
layer.shadowOffset = CGSize(width: 0.0, height: 1.0) layer.shadowOffset = CGSize(width: 0.0, height: 1.0)
layer.shadowRadius = 1.5 layer.shadowRadius = 1.8
} }
override func sizeThatFits(_ size: CGSize) -> CGSize override func sizeThatFits(_ size: CGSize) -> CGSize

View File

@@ -49,7 +49,7 @@ class URLBar: ReliefButton
private let progressIndicatorView = ProgressIndicatorView() private let progressIndicatorView = ProgressIndicatorView()
private var progressIndicatorAnimating = false private var progressIndicatorAnimating = false
private let documentImage = UIImage(systemName: "filemenu.and.selection") private let documentImage = UIImage(systemName: "ellipsis.circle")
private let refreshImage = UIImage(systemName: "arrow.clockwise") private let refreshImage = UIImage(systemName: "arrow.clockwise")
private let stopImage = UIImage(systemName: "xmark") private let stopImage = UIImage(systemName: "xmark")