Change timeline layout to increase information density. Issue #1938

This commit is contained in:
Maurice Parker 2020-03-23 21:43:54 -05:00
parent 80d0a76e11
commit 5afc3c55f8
4 changed files with 38 additions and 39 deletions

View File

@ -17,12 +17,11 @@ struct TimelineCellAppearance: Equatable {
let feedNameFont: NSFont
let dateFont: NSFont
let dateMarginLeft: CGFloat = 10.0
let dateMarginBottom: CGFloat = 1.0
let dateMarginLeft: CGFloat = 8.0
let titleFont: NSFont
let titleBottomMargin: CGFloat = 1.0
let titleNumberOfLines = 2
let titleNumberOfLines = 3
let textFont: NSFont
@ -46,12 +45,12 @@ struct TimelineCellAppearance: Equatable {
init(showIcon: Bool, fontSize: FontSize) {
let actualFontSize = AppDefaults.actualFontSize(for: fontSize)
let smallItemFontSize = actualFontSize //floor(actualFontSize * 0.95)
let largeItemFontSize = actualFontSize //floor(actualFontSize * 1.1)
let smallItemFontSize = floor(actualFontSize * 0.90)
let largeItemFontSize = actualFontSize
self.feedNameFont = NSFont.systemFont(ofSize: smallItemFontSize)
self.dateFont = NSFont.systemFont(ofSize: smallItemFontSize, weight: NSFont.Weight.bold)
self.titleFont = NSFont.systemFont(ofSize: largeItemFontSize, weight: NSFont.Weight.semibold)
self.dateFont = NSFont.systemFont(ofSize: smallItemFontSize)
self.titleFont = NSFont.systemFont(ofSize: largeItemFontSize, weight: NSFont.Weight.bold)
self.textFont = NSFont.systemFont(ofSize: largeItemFontSize)
self.textOnlyFont = NSFont.systemFont(ofSize: largeItemFontSize)

View File

@ -63,7 +63,7 @@ struct TimelineCellLayout {
if numberOfLinesForTitle == 0 {
lastTextRect = textRect
}
else if numberOfLinesForTitle == 1 {
else if numberOfLinesForTitle < appearance.titleNumberOfLines {
if summaryRect.height > 0.1 {
lastTextRect = summaryRect
}
@ -124,16 +124,24 @@ private extension TimelineCellLayout {
}
static func rectForSummary(_ textBoxRect: NSRect, _ titleRect: NSRect, _ titleNumberOfLines: Int, _ appearance: TimelineCellAppearance, _ cellData: TimelineCellData) -> NSRect {
if titleNumberOfLines >= appearance.titleNumberOfLines || cellData.text.isEmpty {
return NSRect.zero
}
return rectOfLineBelow(titleRect, titleRect, 0, cellData.text, appearance.textFont)
var r = textBoxRect
r.origin.y = NSMaxY(titleRect)
let summaryNumberOfLines = appearance.titleNumberOfLines - titleNumberOfLines
let sizeInfo = MultilineTextFieldSizer.size(for: cellData.text, font: appearance.textOnlyFont, numberOfLines: summaryNumberOfLines, width: Int(textBoxRect.width))
r.size.height = sizeInfo.size.height
if sizeInfo.numberOfLinesUsed < 1 {
r.size.height = 0
}
return r
}
static func rectForText(_ textBoxRect: NSRect, _ appearance: TimelineCellAppearance, _ cellData: TimelineCellData) -> NSRect {
var r = textBoxRect
if cellData.text.isEmpty {
@ -150,32 +158,30 @@ private extension TimelineCellLayout {
}
static func rectForDate(_ textBoxRect: NSRect, _ rectAbove: NSRect, _ appearance: TimelineCellAppearance, _ cellData: TimelineCellData) -> NSRect {
let textFieldSize = SingleLineTextFieldSizer.size(for: cellData.dateString, font: appearance.dateFont)
var r = NSZeroRect
r.size = textFieldSize
r.origin.y = NSMaxY(rectAbove) + appearance.titleBottomMargin
r.size.width = textFieldSize.width
return rectOfLineBelow(textBoxRect, rectAbove, appearance.titleBottomMargin, cellData.dateString, appearance.dateFont)
r.origin.x = textBoxRect.maxX - textFieldSize.width
return r
}
static func rectForFeedName(_ textBoxRect: NSRect, _ dateRect: NSRect, _ appearance: TimelineCellAppearance, _ cellData: TimelineCellData) -> NSRect {
if !cellData.showFeedName {
return NSZeroRect
}
return rectOfLineBelow(textBoxRect, dateRect, appearance.dateMarginBottom, cellData.feedName, appearance.feedNameFont)
}
static func rectOfLineBelow(_ textBoxRect: NSRect, _ rectAbove: NSRect, _ topMargin: CGFloat, _ value: String, _ font: NSFont) -> NSRect {
let textFieldSize = SingleLineTextFieldSizer.size(for: value, font: font)
let textFieldSize = SingleLineTextFieldSizer.size(for: cellData.feedName, font: appearance.feedNameFont)
var r = NSZeroRect
r.size = textFieldSize
r.origin.y = NSMaxY(rectAbove) + topMargin
r.origin.y = dateRect.minY
r.origin.x = textBoxRect.origin.x
var width = textFieldSize.width
width = min(width, textBoxRect.size.width)
width = max(width, 0.0)
r.size.width = width
r.size.width = (textBoxRect.maxX - (dateRect.size.width + appearance.dateMarginLeft)) - textBoxRect.origin.x
return r
}

View File

@ -12,7 +12,7 @@ import RSCore
class TimelineTableCellView: NSTableCellView {
private let titleView = TimelineTableCellView.multiLineTextField()
private let summaryView = TimelineTableCellView.singleLineTextField()
private let summaryView = TimelineTableCellView.multiLineTextField()
private let textView = TimelineTableCellView.multiLineTextField()
private let unreadIndicatorView = UnreadIndicatorView(frame: NSZeroRect)
private let dateView = TimelineTableCellView.singleLineTextField()
@ -144,7 +144,7 @@ private extension TimelineTableCellView {
let textField = NSTextField(wrappingLabelWithString: "")
textField.usesSingleLineMode = false
textField.maximumNumberOfLines = 2
textField.maximumNumberOfLines = 0
textField.isEditable = false
textField.cell?.truncatesLastVisibleLine = true
textField.allowsDefaultTighteningForTruncation = false
@ -180,7 +180,7 @@ private extension TimelineTableCellView {
titleView.textColor = NSColor.labelColor
feedNameView.textColor = NSColor.secondaryLabelColor
dateView.textColor = NSColor.secondaryLabelColor
summaryView.textColor = NSColor.secondaryLabelColor
summaryView.textColor = NSColor.labelColor
textView.textColor = NSColor.labelColor
}

View File

@ -128,12 +128,7 @@ final class TimelineViewController: NSViewController, UndoableCommandRunner, Unr
}
private var showIcons = false
private var rowHeightWithFeedName: CGFloat = 0.0
private var rowHeightWithoutFeedName: CGFloat = 0.0
private var currentRowHeight: CGFloat {
return showFeedNames ? rowHeightWithFeedName : rowHeightWithoutFeedName
}
private var currentRowHeight: CGFloat = 0.0
private var didRegisterForNotifications = false
static let fetchAndMergeArticlesQueue = CoalescingQueue(name: "Fetch and Merge Articles", interval: 0.5, maxInterval: 2.0)
@ -662,20 +657,19 @@ final class TimelineViewController: NSViewController, UndoableCommandRunner, Unr
// MARK: - Cell Configuring
private func calculateRowHeight(showingFeedNames: Bool) -> CGFloat {
private func calculateRowHeight() -> CGFloat {
let longTitle = "But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the truth, the master-builder of human happiness. No one rejects, dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful. Nor again is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain, but because occasionally circumstances occur in which toil and pain can procure him some great pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise, except to obtain some advantage from it? But who has any right to find fault with a man who chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that produces no resultant pleasure?"
let prototypeID = "prototype"
let status = ArticleStatus(articleID: prototypeID, read: false, starred: false, userDeleted: false, dateArrived: Date())
let prototypeArticle = Article(accountID: prototypeID, articleID: prototypeID, webFeedID: prototypeID, uniqueID: prototypeID, title: longTitle, contentHTML: nil, contentText: nil, url: nil, externalURL: nil, summary: nil, imageURL: nil, datePublished: nil, dateModified: nil, authors: nil, status: status)
let prototypeCellData = TimelineCellData(article: prototypeArticle, showFeedName: showingFeedNames, feedName: "Prototype Feed Name", iconImage: nil, showIcon: false, featuredImage: nil)
let prototypeCellData = TimelineCellData(article: prototypeArticle, showFeedName: true, feedName: "Prototype Feed Name", iconImage: nil, showIcon: false, featuredImage: nil)
let height = TimelineCellLayout.height(for: 100, cellData: prototypeCellData, appearance: cellAppearance)
return height
}
private func updateRowHeights() {
rowHeightWithFeedName = calculateRowHeight(showingFeedNames: true)
rowHeightWithoutFeedName = calculateRowHeight(showingFeedNames: false)
currentRowHeight = calculateRowHeight()
updateTableViewRowHeight()
}