Center vertical candidate window text

Author: ChiahongHong

Packages/CandidateUI/Sources/CandidateUI/VerticalCandidateController.swift

@@ -25,9 +25,16 @@ import Cocoa
 
 private class VerticalKeyLabelStripView: NSView {
     var keyLabelFont: NSFont = .systemFont(ofSize: NSFont.smallSystemFontSize)
-    var labelOffsetY: CGFloat = 0
     var keyLabels: [String] = []
     var highlightedIndex: Int = -1
+    private let textCell: VerticallyCenteredTextFieldCell = {
+        let cell = VerticallyCenteredTextFieldCell()
+        cell.isBezeled = false
+        cell.isBordered = false
+        cell.drawsBackground = false
+        cell.isEditable = false
+        return cell
+    }()
 
     override var isFlipped: Bool {
         true
@@ -76,9 +83,6 @@ private class VerticalKeyLabelStripView: NSView {
             .paragraphStyle: paraStyle,
         ]
         for index in 0..<count {
-            let textRect = NSRect(
-                x: 0.0, y: CGFloat(index) * cellHeight + labelOffsetY, width: bounds.size.width,
-                height: cellHeight - labelOffsetY)
             var cellRect = NSRect(
                 x: 0.0, y: CGFloat(index) * cellHeight, width: bounds.size.width, height: cellHeight
             )
@@ -92,14 +96,16 @@ private class VerticalKeyLabelStripView: NSView {
                     NSColor.selectedControlColor.setFill()
                     NSBezierPath.fill(cellRect)
                 }
-                (text as NSString).draw(
-                    in: textRect,
-                    withAttributes: (index == highlightedIndex) ? textAttrHighlighted : textAttr)
+                textCell.attributedStringValue = NSAttributedString(
+                    string: text,
+                    attributes: (index == highlightedIndex) ? textAttrHighlighted : textAttr)
             } else {
                 (index == highlightedIndex ? darkGray : lightGray).setFill()
                 NSBezierPath.fill(cellRect)
-                (text as NSString).draw(in: textRect, withAttributes: textAttr)
+                textCell.attributedStringValue = NSAttributedString(
+                    string: text, attributes: textAttr)
             }
+            textCell.draw(withFrame: cellRect, in: self)
         }
     }
 }
@@ -109,6 +115,28 @@ private let kCandidateTextLeftMargin: CGFloat = 8.0
 private let kCandidateTextPaddingWithMandatedTableViewPadding: CGFloat = 18.0
 private let kCandidateTextLeftMarginWithMandatedTableViewPadding: CGFloat = 0.0
 
+final class VerticallyCenteredTextFieldCell: NSTextFieldCell {
+    override func drawingRect(forBounds rect: NSRect) -> NSRect {
+        let drawingRect = super.drawingRect(forBounds: rect)
+        let textHeight = min(drawingRect.height, cellSize(forBounds: drawingRect).height)
+        return NSRect(
+            x: drawingRect.minX,
+            y: drawingRect.minY + (drawingRect.height - textHeight) / 2,
+            width: drawingRect.width,
+            height: textHeight)
+    }
+}
+
+func tooltipFrame(
+    windowWidth: CGFloat, windowHeight: CGFloat, tooltipHeight: CGFloat, padding: CGFloat
+) -> NSRect {
+    NSRect(
+        x: padding,
+        y: windowHeight - tooltipHeight,
+        width: max(0, windowWidth - padding * 2),
+        height: tooltipHeight)
+}
+
 // Only used in macOS 10.15 (Catalina) or lower
 private class BackgroundView: NSView {
     override func draw(_: NSRect) {
@@ -264,6 +292,7 @@ public class VerticalCandidateController: CandidateController {
         }
 
         tooltipView = NSTextField(frame: NSRect.zero)
+        tooltipView.cell = VerticallyCenteredTextFieldCell()
         tooltipView.isEditable = false
         tooltipView.isSelectable = false
         tooltipView.isBezeled = false
@@ -290,7 +319,7 @@ public class VerticalCandidateController: CandidateController {
 
         tableView = VerticalCandidateTableView(frame: contentRect)
         let column = NSTableColumn(identifier: NSUserInterfaceItemIdentifier(rawValue: "candidate"))
-        column.dataCell = NSTextFieldCell()
+        column.dataCell = VerticallyCenteredTextFieldCell()
         column.isEditable = false
 
         candidateTextPadding = kCandidateTextPadding
@@ -629,8 +658,8 @@ extension VerticalCandidateController: NSTableViewDataSource, NSTableViewDelegat
         if !tooltip.isEmpty {
             tooltipView.stringValue = tooltip
             let size = tooltipView.intrinsicContentSize
-            tooltipWidth = size.width + tooltipPadding * 2
-            tooltipHeight = size.height + tooltipPadding * 2
+            tooltipWidth = ceil(size.width) + tooltipPadding * 2
+            tooltipHeight = ceil(size.height) + tooltipPadding * 2
             window?.contentView?.addSubview(tooltipView)
         } else {
             tooltipView.removeFromSuperview()
@@ -654,9 +683,6 @@ extension VerticalCandidateController: NSTableViewDataSource, NSTableViewDelegat
         keyLabelStripView.keyLabelFont = keyLabelFont
         let actualKeyLabels = keyLabels[0..<Int(keyLabelCount)].map { $0.displayedText }
         keyLabelStripView.keyLabels = actualKeyLabels
-        keyLabelStripView.labelOffsetY =
-            (keyLabelFontSize >= candidateFontSize)
-            ? 0.0 : floor((candidateFontSize - keyLabelFontSize) / 2.0)
 
         let rowHeight = ceil(fontSize * 1.25)
         tableView.rowHeight = rowHeight
@@ -689,9 +715,9 @@ extension VerticalCandidateController: NSTableViewDataSource, NSTableViewDelegat
         scrollView.frame = NSRect(
             x: stripWidth + 1.0, y: 0, width: windowWidth - stripWidth - 1,
             height: windowHeight - tooltipHeight)
-        tooltipView.frame = NSRect(
-            x: tooltipPadding, y: windowHeight - tooltipHeight + tooltipPadding, width: windowWidth,
-            height: tooltipHeight)
+        tooltipView.frame = tooltipFrame(
+            windowWidth: windowWidth, windowHeight: windowHeight, tooltipHeight: tooltipHeight,
+            padding: tooltipPadding)
         window?.setFrame(frameRect, display: false)
     }
 }

Packages/CandidateUI/Tests/CandidateUITests/VerticalCandidateControllerTests.swift

@@ -190,4 +190,68 @@ final class VerticalCandidateControllerTests {
         #expect(controller.selectedCandidateIndex == 0)
     }
 
+    @Test("Test if candidate text is vertically centered in its row")
+    func testCandidateTextVerticalAlignment() {
+        let fontSize: CGFloat = 16
+        let cell = VerticallyCenteredTextFieldCell()
+        cell.attributedStringValue = NSAttributedString(
+            string: "注",
+            attributes: [.font: NSFont.systemFont(ofSize: fontSize)])
+        let bounds = NSRect(x: 0, y: 0, width: 100, height: ceil(fontSize * 1.25))
+
+        let drawingRect = cell.drawingRect(forBounds: bounds)
+
+        #expect(drawingRect.height < bounds.height)
+        #expect(abs(drawingRect.midY - bounds.midY) < 0.001)
+    }
+
+    @Test("Test if key labels are vertically centered in their rows")
+    func testKeyLabelVerticalAlignment() {
+        let cell = VerticallyCenteredTextFieldCell()
+        cell.attributedStringValue = NSAttributedString(
+            string: "1",
+            attributes: [.font: NSFont.systemFont(ofSize: 10)])
+        let bounds = NSRect(x: 0, y: 0, width: 25, height: 21)
+
+        let drawingRect = cell.drawingRect(forBounds: bounds)
+
+        #expect(drawingRect.height < bounds.height)
+        #expect(abs(drawingRect.midY - bounds.midY) < 0.001)
+    }
+
+    @Test("Test if the tooltip is centered and inset within the window")
+    func testTooltipAlignment() {
+        let cell = VerticallyCenteredTextFieldCell()
+        cell.attributedStringValue = NSAttributedString(
+            string: "將進酒",
+            attributes: [.font: NSFont.systemFont(ofSize: 13)])
+        let padding: CGFloat = 2
+        let contentHeight = ceil(cell.cellSize.height) + padding * 2
+        let bounds = NSRect(x: 0, y: 0, width: 100, height: contentHeight)
+
+        let drawingRect = cell.drawingRect(forBounds: bounds)
+        let frame = tooltipFrame(
+            windowWidth: 100, windowHeight: 200, tooltipHeight: contentHeight, padding: padding)
+
+        #expect(abs(drawingRect.midY - bounds.midY) < 0.001)
+        #expect(frame.minX == padding)
+        #expect(frame.maxX == 100 - padding)
+        #expect(frame.maxY == 200)
+    }
+
+    @Test("Test if oversized candidate text stays within its row")
+    func testOversizedCandidateTextVerticalAlignment() {
+        let cell = VerticallyCenteredTextFieldCell()
+        cell.attributedStringValue = NSAttributedString(
+            string: "注",
+            attributes: [.font: NSFont.systemFont(ofSize: 32)])
+        let bounds = NSRect(x: 0, y: 0, width: 100, height: 20)
+
+        let drawingRect = cell.drawingRect(forBounds: bounds)
+
+        #expect(drawingRect.minY >= bounds.minY)
+        #expect(drawingRect.maxY <= bounds.maxY)
+        #expect(drawingRect.height == bounds.height)
+    }
+
 }