iOS在形状中心绘制文本

Question

我想在iOS的形状的中心绘制文本,一个例子是微软办公的刀片形状看:https://www.dropbox.com/s/cgqyyuvy6hcv5g8/Screenshot%202014-01-21%2013.48.17巴纽

我有一个用于形成形状的坐标数组,可以很好地创建实际形状.

我的第一个策略是关注这个stackoverflow问题:在iOS上使用非对称形状的核心文本然而我只能在形状的底部绘制文本.有没有办法垂直和水平居中文本？

然后我看了一下新的TextKit,但是我不知道如何将NSTextContainer子类化为接受CGPath或坐标数组来创建要在其中绘制的文本容器.

我的备份解决方案是使用Core Text在形状的中心坐标处绘制文本,但这会导致文本在某些形状(如直角三角形)上绘制到形状之外.

或者,有没有其他方法可以用来在形状的中心稍微获得一些文字？

谢谢,

丹妮尔.

Answer 1

我从这些答案和相关问题中找到了答案 - 它们都没有真正令人满意 - 并提出了这个简单的解决方案:

    UIGraphicsBeginImageContext(CGSize.init(width: imageWidth, height: imageHeight))

    let string = "ABC" as NSString

    let attributes = [
            NSFontAttributeName : UIFont.systemFontOfSize(40),
            NSForegroundColorAttributeName : UIColor.redColor()
        ]

    // Get the width and height that the text will occupy.
    let stringSize = string.sizeWithAttributes(attributes)

    // Center a rect inside of the image
    // by going half the difference to the right and down.
    string.drawInRect(
        CGRectMake(
            (imageWidth - stringSize.width) / 2,
            (imageHeight - stringSize.height) / 2,
            stringSize.width,
            stringSize.height
        ),
        withAttributes: attributes
    )

    let newImage = UIGraphicsGetImageFromCurrentImageContext()

    UIGraphicsEndImageContext()

结果(没关系颜色):

Answer 2

Swift 3版Luca Davanzo的回答

struct UIUtility {

static func imageWithColor(color: UIColor, circular: Bool) -> UIImage? {
    let size: CGFloat = circular ? 100 : 1;
    let rect = CGRect(x: 0.0, y: 0.0, width: size, height: size)
    UIGraphicsBeginImageContext(rect.size)
    if let context = UIGraphicsGetCurrentContext() {
        context.setFillColor(color.cgColor)
        if(circular) {
            context.fillEllipse(in: rect)
        }
        else {
            context.fill(rect)
        }
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        return image
    }
    return nil
}

static func drawText(text: NSString, font: UIFont, image: UIImage, point: CGPoint, textColor: UIColor = UIColor.white) -> UIImage? {
    UIGraphicsBeginImageContext(image.size)
    image.draw(in: CGRect(x: 0, y: 0, width: image.size.width, height: image.size.height))
    let rect = CGRect(x: point.x, y: point.y, width: image.size.width, height: image.size.height)
    text.draw(in: rect.integral, withAttributes: [ NSFontAttributeName: font, NSForegroundColorAttributeName: textColor ])
    let newImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return newImage
}

static func circleImageWithText(text: String, font: UIFont, circleColor: UIColor, textColor: UIColor = UIColor.white) -> UIImage? {
    if let image = UIUtility.imageWithColor(color: circleColor, circular: true) {
        let textSize = NSString(string: text).size(attributes: [ NSFontAttributeName: font])
        let centerX = ((image.size.width) / 2.0) - (textSize.width / 2.0)
        let centerY = ((image.size.height) / 2.0) - (textSize.height / 2.0)
        let middlePoint = CGPoint(x: centerX, y: centerY)
        return UIUtility.drawText(text: text as NSString, font: font, image: image, point: middlePoint)
    }
    return nil
}
}

Answer 3

这有点棘手。首先你必须创建一个上下文。（bounds.size是图像的大小）

UIGraphicsBeginImageContext(bounds.size); 
CGContextRef context = UIGraphicsGetCurrentContext();

然后获取文本的边界框：（font是你要使用的字体）

CGSize textSize =
[yourText sizeWithAttributes:@{NSFontAttributeName:font}];

将文本绘制到上下文中（x 和 y 标记图像的中心）

[yourText drawAtPoint:CGPointMake(x, y) withAttributes:@{NSFontAttributeName:font}];

获取图像

UIImage *image = UIGraphicsGetImageFromCurrentImageContext(); 

结束图像上下文

UIGraphicsEndImageContext();

我还没有测试过，但这是要走的路。