Swift - 游乐场 - 核心图形/核心文本/自定义视图

Question

题

我正试图在swift playground中创建一个自定义的UIView组件.我已经能够弄清楚除正确渲染文本之外的所有事情.我不确定我是否应该通过Core Graphics或Core Text执行此操作,或者确切地知道如何使其正常工作.

正如您在下图中所看到的,我想在自定义View Component的任意一侧上下颠倒和正面渲染文本

我已经尝试了各种方法来使文本工作,但我一直搁浅.如果有人能够告诉我如何修改我的游乐场以添加一些非常棒的文本渲染.

游乐场代码

// Playground - noun: a place where people can play

import Foundation
import UIKit

class RunwayView : UIView {


    var northText : String?
    var southText : String?


    ///Draws the "runway"
    override func drawRect(rect: CGRect) {

        // Setup graphics context
        var ctx = UIGraphicsGetCurrentContext()


        // clear context
        CGContextClearRect(ctx, rect)
        let parentVieBounds = self.bounds
        let width = CGRectGetWidth(parentVieBounds)
        let height = CGRectGetHeight(parentVieBounds)


        // Setup the heights
        let endZoneHeight : CGFloat = 40


        /* Remember y is negative and 0,0 is upper left*/


        //Create EndZones
        CGContextSetRGBFillColor(ctx, 0.8, 0.8, 0.8, 1)
        CGContextFillRect(ctx, CGRectMake(0, 0, width, endZoneHeight))
        CGContextFillRect(ctx, CGRectMake(0, height-endZoneHeight, width, endZoneHeight))


        var northString = NSMutableAttributedString(string: "36")
        var attrs = [NSFontAttributeName : UIFont.systemFontOfSize(16.0)]
        var gString = NSMutableAttributedString(string:"g", attributes:attrs);


        var line = CTLineCreateWithAttributedString(gString)

        CGContextSetTextPosition(ctx, 10, 50);
        CTLineDraw(line, ctx);

        // Clean up

    }

}


var outerFrame : UIView = UIView(frame: CGRectMake(20,20,400,400))
var runway1 : RunwayView = RunwayView(frame: CGRectMake(0,0,30,260))
var runway2 : RunwayView = RunwayView(frame: CGRectMake(80,0,30,340))

runway1.transform = CGAffineTransformConcat(CGAffineTransformMakeTranslation(20, 200),
    CGAffineTransformMakeRotation(-0.785398163))
outerFrame.addSubview(runway1)

runway2.transform = CGAffineTransformConcat(CGAffineTransformMakeTranslation(120, 140),
    CGAffineTransformMakeRotation(-0.585398163))

outerFrame.addSubview(runway2)



outerFrame.backgroundColor = UIColor.yellowColor()
outerFrame.clipsToBounds = true


// View these elements
runway1
outerFrame
runway1

Answer 1

我为我的应用程序编写了一个实用程序函数来绘制文本CoreText.它返回文本大小以供进一步处理:

func drawText(context: CGContextRef, text: NSString, attributes: [String: AnyObject], x: CGFloat, y: CGFloat) -> CGSize {
    let font = attributes[NSFontAttributeName] as UIFont
    let attributedString = NSAttributedString(string: text, attributes: attributes)

    let textSize = text.sizeWithAttributes(attributes)

    // y: Add font.descender (its a negative value) to align the text at the baseline
    let textPath    = CGPathCreateWithRect(CGRect(x: x, y: y + font.descender, width: ceil(textSize.width), height: ceil(textSize.height)), nil)
    let frameSetter = CTFramesetterCreateWithAttributedString(attributedString)
    let frame       = CTFramesetterCreateFrame(frameSetter, CFRange(location: 0, length: attributedString.length), textPath, nil)

    CTFrameDraw(frame, context)

    return textSize
}

这样称呼它:

var textAttributes: [String: AnyObject] = [
    NSForegroundColorAttributeName : UIColor(white: 1.0, alpha: 1.0).CGColor,
    NSFontAttributeName : UIFont.systemFontOfSize(17)
]

drawText(ctx, text: "Hello, World!", attributes: textAttributes, x: 50, y: 50)

希望对你有所帮助.