Как процедурно нарисовать прямоугольник / линии в swift с помощью CGContext

Я тралил интернет в течение нескольких дней, пытаясь найти простейшие примеры кода о том, как рисовать прямоугольник или линии процедурно в Swift. Я видел, как это сделать, переопределив команду DrawRect. Я считаю, что вы можете создать CGContext, а затем нарисовать изображение, но мне бы хотелось увидеть несколько простых примеров кода. Или это ужасный подход? Спасибо.

class MenuController: UIViewController 
{

    override func viewDidLoad() 
    {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        self.view.backgroundColor = UIColor.blackColor()

        var logoFrame = CGRectMake(0,0,118,40)
        var imageView = UIImageView(frame: logoFrame)
        imageView.image = UIImage(named:"Logo")
        self.view.addSubview(imageView)

        //need to draw a rectangle here
    }
}

3 ответов


вот пример, который создает пользовательский UIImage, содержащий прозрачный фон и красный прямоугольник с линиями, пересекающими его по диагонали.

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad();

        let imageSize = CGSize(width: 200, height: 200)
        let imageView = UIImageView(frame: CGRect(origin: CGPoint(x: 100, y: 100), size: imageSize))
        self.view.addSubview(imageView)
        let image = drawCustomImage(size: imageSize)
        imageView.image = image
    }
}

func drawCustomImage(size: CGSize) -> UIImage {
    // Setup our context
    let bounds = CGRect(origin: .zero, size: size)
    let opaque = false
    let scale: CGFloat = 0
    UIGraphicsBeginImageContextWithOptions(size, opaque, scale)
    let context = UIGraphicsGetCurrentContext()!

    // Setup complete, do drawing here
    context.setStrokeColor(UIColor.red.cgColor)
    context.setLineWidth(2)

    context.stroke(bounds)

    context.beginPath()
    context.move(to: CGPoint(x: bounds.minX, y: bounds.minY))
    context.addLine(to: CGPoint(x: bounds.maxX, y: bounds.maxY))
    context.move(to: CGPoint(x: bounds.maxX, y: bounds.minY))
    context.addLine(to: CGPoint(x: bounds.minX, y: bounds.maxY))
    context.strokePath()

    // Drawing complete, retrieve the finished image and cleanup
    let image = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return image!
}

обновленный ответ с использованием Swift 3.0

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad();

        let imageSize = CGSize(width: 200, height: 200)
        let imageView = UIImageView(frame: CGRect(origin: CGPoint(x: 100, y: 100), size: imageSize))
        self.view.addSubview(imageView)
        let image = drawCustomImage(size: imageSize)
        imageView.image = image
    }
}

func drawCustomImage(size: CGSize) -> UIImage? {
    // Setup our context
    let bounds = CGRect(origin: CGPoint.zero, size: size)
    let opaque = false
    let scale: CGFloat = 0
    UIGraphicsBeginImageContextWithOptions(size, opaque, scale)
    guard let context = UIGraphicsGetCurrentContext() else { return nil }

    // Setup complete, do drawing here
    context.setStrokeColor(UIColor.red.cgColor)
    context.setLineWidth(5.0)

    // Would draw a border around the rectangle
    // context.stroke(bounds)

    context.beginPath()
    context.move(to: CGPoint(x: bounds.maxX, y: bounds.minY))
    context.addLine(to: CGPoint(x: bounds.minX, y: bounds.maxY))
    context.strokePath()

    // Drawing complete, retrieve the finished image and cleanup
    let image = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return image
}

let imageSize = CGSize(width: 200, height: 200)
let imageView = UIImageView(frame: CGRect(origin: CGPoint(x: 100, y: 100), size: imageSize))
let image = drawCustomImage(size: imageSize)
imageView.image = image

я использовал принятый ответ для рисования линий в игре Tic Tac Toe, когда один из игроков выиграл. Спасибо, приятно знать, что это сработало. К сожалению, я столкнулся с некоторыми проблемами, заставляя его работать на разных размерах iPhones и iPads одновременно. Это, вероятно, то, что должно было быть рассмотрено. В принципе, я говорю, что это может не стоить того, чтобы беспокоиться обо всем этом коде, в зависимости от вашего случая.

мое альтернативное решение-просто сделать настроенная, лучше выглядящая линия в Photoshop, а затем загрузите ее с помощью UIImageView. Для меня это было намного проще, работает лучше, и выглядит лучше. Очевидно, это действительно зависит от того, для чего вам это нужно.

действия:

1: Загрузите или создайте изображение (желательно сохранить как .PNG)

2: перетащите его в ваш проект

3: перетащите представление UIImage в раскадровку

4: кликните на изображение и выберите изображение в атрибутах инспектор!--2-->

5: Ctrl нажмите и перетащите изображение на ваш .swift файл для объявления выхода

6: установите ограничения автозапуска, чтобы он работал на всех устройствах легко

анимация, вращение и преобразование изображений на экране и вне экрана также, возможно, проще

сменить изображение:

yourImageViewOutletName.image = UIImage(named: "ImageNameHere")