一个标签有四个不同的verticalAlignmentMode
: .Baseline
, .Bottom
, .Center
和 .Top
.
我希望标签根据其基线以其位置为中心。 .Center
对我不起作用,因为框架的底部不是文本的基线,而是最低字母的底部(例如“y”)。
我也尝试过使用 .Baseline
并从 y 位置减去框架高度的一半,但这也不起作用,导致与 .Center
相同的问题.
我试图居中的标签中的文本是“播放!”。将模式设置为“.Center”会使文本略高于我想要的高度,这一点非常明显。将文本更改为“Pla!”解决了这个问题,因为 'y' 被删除并且没有字符卡在基线以下(虽然我显然不能这样做作为解决方案)。
我想要一个解决这个问题的方法的建议——也许有某种方法可以获取基线的位置?谢谢!
最佳答案
因此,在 this question and answer 的帮助下,我遇到了同样的问题我找到了一个不错的解决方案。
我想将标签节点的文本与自定义按钮节点(标签节点包裹在形状节点中以绘制轮廓)对齐。
我还想将切换(开/关)按钮与标签节点的基线对齐,并使用与标签中文本的 xHeight 相同的高度。
因此,为了做到这一点,我做了以下事情。
我创建了一个 Font 类,可用于根据 SKLabelNode
中的 fontName
和 fontSize
创建字体对象。
在内部它将创建一个 NSFont
(macOS) 或 UIFont
(iOS)。并设置ascender、descender属性。为了方便起见,还有一个返回字体最大可能高度的 getter。
import Foundation
#if os(macOS)
import Cocoa
#endif
#if os(iOS)
import UIKit
#endif
enum FontError: LocalizedError {
case invalidFont(String, CGFloat)
var errorDescription: String? {
switch self {
case .invalidFont(let name, let size):
return "Could not create font with name \(name) and size: \(size)"
}
}
}
class Font {
private(set) var name: String
private(set) var size: CGFloat
private(set) var ascender: CGFloat
private(set) var descender: CGFloat
private(set) var xHeight: CGFloat
var maxHeight: CGFloat {
return self.ascender + fabs(self.descender)
}
init(name: String, size: CGFloat) throws {
// check if font can be created, otherwise crash
// set ascender, descender, etc...
#if os(macOS)
guard let font = NSFont(name: name, size: size) else {
throw FontError.invalidFont(name, size)
}
self.ascender = font.ascender
self.descender = font.descender
self.xHeight = font.xHeight
#endif
#if os(iOS)
guard let font = UIFont(name: name, size: size) else {
throw FontError.invalidFont(name, size)
}
self.ascender = font.ascender
self.descender = font.descender
self.xHeight = font.xHeight
#endif
self.name = name
self.size = size
}
}
然后我在我的标签位置计算中使用 maxHeight。因此,例如在我的自定义 ButtonNode
(一个包含 SKLabelNode
的 SKShapeNode
)中,我执行以下操作(简化):
// in the constructor of my custom
// button node ...
let height = 30
self.label = SKLabelNode(text: "Back")
// in order to position properly, set
// vertical alignment to baseline
self.label.verticalAlignmentMode = .baseline
let font = try Font(name: self.label.fontName!, size: self.label.fontSize)
// depending on the font you might want to add
// an additional y offset to place labels
// higher or lower within the node
let yOffset = (height - font.maxHeight) / 2)
let labelWidth = self.label.calculateAccumulatedFrame().width
let labelFrame = CGRect(
x: 0,
y: 0,
width: labelWidth,
height: height
)
self.path = CGPath(roundedRect: labelFrame, cornerWidth: 5, cornerHeight: 5, transform: nil)
self.label.position = CGPoint(x: labelFrame.width / 2, y: yOffset)
P.S.:如果您不想创建单独的 Font
类并且您仍然希望代码在 iOS 和 macOS 上正常工作,您可以创建NSFont
和 UIFont
的类型别名。由于您可以使用相同的构造函数,因此您只需要添加一个扩展来计算字体的最大高度 (ascender + abs(descender)
)。
我更喜欢创建一个类,以便在无法正确创建字体时抛出错误。
关于ios - SpriteKit : Is there a way to centre a SKLabelNode according to its baseline,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38850592/