Core Graphics — bu nima, ishlash prinsiplari va 2D grafikasi uchun freymvork

Core Graphics nima?

Core Graphics (Quartz 2D nomi bilan ham tanilgan) — Apple-ning 2D grafik dvigatelini amalga oshiradigan freymvork. U portativ Quartz grafik kutubxonasiga asoslangan va sahifaga asoslangan chizish modelidan (page-based) foydalanadi, bunda har bir harakat qog'ozga chizishni eslatuvchi ketma-ketlikdagi buyruqdir. Core Graphics anti-aliasing, shaffoflik (alpha compositing) va ICC rang fazolarini qo'llab-quvvatlaydi.

Core Graphics arxitekturasi grafik kontekst (CGContext) atrofida qurilgan bo'lib, u maqsadli chiqish qurilmasini — ekran, printer, PDF hujjat yoki rastr buferini inkapsulyatsiya qiladi. Kontekst joriy sozlamalarni boshqaradi: rang, chiziq qalinligi, transformatsiya, kesish maydoni va shriftlar. Bunday yondashuv chizish kodini o'zgartirmasdan turli chiqish qurilmalari uchun yagona API ni ta'minlaydi.

Core Graphics asosan CPU da ishlaydi, vektor modelidan (resolution-independent) foydalanadi. Bu shuni anglatadiki, chiziqlar va egri chiziqlar renderlash vaqtida qurilmaning joriy rezolyutsiyasida rastrlashtiriladi. Metal dan farqli o'laroq, Core Graphics GPU resurslarini aniq boshqarishni talab qilmaydi — barcha optimallashtirishni tizim o'z zimmasiga oladi. Ko'pgina 2D vazifalari (grafikalar, diagrammalar, maxsus UI elementlari) uchun Core Graphics samaradorligi 60 FPS ni ushlab turish uchun yetarli.

Arxitektura va asosiy turlar

Core Graphics taxminan 50 ta asosiy turni (opaque types) o'z ichiga oladi, ularning har biri ma'lum funksionallik uchun javobgardir. Barcha turlar Core Foundation xotira boshqaruvi qoidalariga amal qiladi: nomida Create bo'lgan funksiyalar orqali yaratiladi, CGRelease chaqiruvini talab qiladi va Objective-C da ARC-ga mos kelmaydi (ammo Swift CF_RETURNS_RETAINED annotatsiyalari orqali xotirani avtomatik boshqaradi).

Core Graphics ning asosiy turlari

CGContext — chizish konteksti, freymvorkning markaziy turi. CGPath — o'zgartirilmaydigan vektor konturi. CGColor — rang fazosi ko'rsatilgan rang. CGGradient — gradient to'ldirish. CGImage — rastr tasviri. CGLayer — takroriy chizish uchun optimallashtirilgan oflayn bufer. CGDataProvider — tasvirlar uchun ma'lumot manbai. CGColorSpace — rang fazosi (sRGB, Display P3, Gray).

Har bir tur minimal overhead uchun yaratilgan: CGPath turli kontekstlar o'rtasida keshlanishi va qayta ishlatilishi mumkin, CGColor uzatilganda GPU ning apparat ko'rinishiga aylantiriladi, CGLayer oldindan rastrlashtirilgan tarkibni saqlaydi. Bunday arxitektura Core Graphics ga oddiy UI vazifalarida ham, professional grafik muharrirlarida ham samarali ishlashga imkon beradi.

CGPath: vektor konturlari va ularni optimallashtirish

CGPath — geometrik segmentlar ketma-ketligini tavsiflovchi o'zgartirilmaydigan obyekt: to'g'ri chiziqlar, Bezier egri chiziqlari, yoylar va yopilishlar. UIBezierPath dan farqli o'laroq, CGPath chizish usullarini o'z ichiga olmaydi — u faqat geometriyani saqlaydi. Chizish uchun CGPath kontekstga qo'shiladi (CGContextAddPath) va keyin strokePath yoki fillPath orqali chiziladi. O'zgartirilmaslik, thread xavfsizligi va keshlash imkoniyatini kafolatlaydi.

Konturlarni yaratish va optimallashtirish

CGPathCreateMutable bosqichma-bosqich qurish uchun o'zgaruvchan yo'l (CGMutablePathRef) yaratadi. Yakuniy yig'ilishdan so'ng, u o'zgartirilmaydigan CGPathRef ga aylanadi. Apple CGPath dagi nuqtalar sonini minimallashtirishni tavsiya qiladi — juda murakkab konturlar (1000 dan ortiq segmentlar) rastrlashtirishni sekinlashtiradi. Optimallashtirish uchun ortiqcha kollinear nuqtalarni olib tashlaydigan CGPathCreateCopyBySimplifyingPath dan foydalaning.

Ikki CGPath o'rtasida shakl animatsiyasi uchun CAShapeLayer ning path xususiyatida CABasicAnimation dan foydalanish mumkin. Cheklov: ikkala CGPath bir xil miqdordagi segmentlarga (controls points) ega bo'lishi kerak. CGPathApply funksiyasi yo'lning barcha elementlarini o'tish va ularning tuzilishini solishtirish imkonini beradi. Agar segmentlar mos kelmasa, animatsiya silkinishli bo'ladi — bu holda nuqtalarni qo'lda interpolyatsiya qilish uchun CADisplayLink dan foydalaning.

// o'zgaruvchan yo'l yarat
let mutablePath = CGMutablePath()
mutablePath.moveTo(to: CGPoint(x: 0, y: 0))
mutablePath.addLine(to: CGPoint(x: 100, y: 0))
mutablePath.addLine(to: CGPoint(x: 100, y: 100))
mutablePath.closeSubpath()

// xavfsiz keshlash uchun o'zgartirilmaydigan ga aylantir
let immutablePath: CGPath = mutablePath
CATransaction.perform {
    shapeLayer.path = immutablePath
}

Gradientlar: CGGradient va CGShading

CGGradient — ikki yoki undan ortiq ranglar orasidagi silliq o'tishni to'g'ri chiziq bo'ylab (chiziqli gradient) yoki markazdan chekkalarga (radial gradient) belgilaydigan obyekt. CGGradient rang fazosi, CGColorRef massivi va 0.0 dan 1.0 gacha bo'lgan to'xtash pozitsiyalari massivi ko'rsatilgan holda yaratiladi. Yaratilgandan so'ng, gradient turli kontekstlarda bir necha marta ishlatilishi mumkin.

Ilg'or gradientlar uchun CGShading

CGShading — yo'l bo'ylab rang o'zgarishi funksiyasini belgilash imkonini beradigan kuchli mexanizm. Ruxsat etilgan ranglar to'plami bilan ishlaydigan CGGradient dan farqli o'laroq, CGShading har bir nuqtada rangni hisoblaydigan callback funksiyasidan (CGFunctionRef) foydalanadi. Bu chiziqli bo'lmagan o'tishlar va murakkab rang sxemalari bilan murakkab gradientlar yaratishga imkon beradi.

Shakl ichida gradient chizish uchun ushbu shaklning konturida clip talab qilinadi. Tartib: kontekstga yo'l qo'shing, CGContextClip ni chaqiring, so'ng gradientni chizing. Clipsiz gradient butun kontekstni to'ldiradi. iOS da oddiyroq va samarali variant sifatida CGGradient dan foydalanish tavsiya etiladi — CGShading faqat nostandart rang o'zgarishi funksiyalari uchun asoslanadi.

func drawGradient(ctx: CGContext, rect: CGRect) {
    let colors = [UIColor.red.cgColor, UIColor.blue.cgColor] as CFArray
    guard let gradient = CGGradient(
        colorsSpace: CGColorSpaceCreateDeviceRGB(),
        colors: colors,
        locations: [0.0, 1.0]
    ) else { return }

    ctx.saveGState()
    ctx.addEllipse(in: rect)
    ctx.clip()
    ctx.drawLinearGradient(
        gradient,
        start: CGPoint(x: rect.midX, y: rect.minY),
        end: CGPoint(x: rect.midX, y: rect.maxY),
        options: []
    )
    ctx.restoreGState()
}

Tasvirlar bilan ishlash: CGImage va CGLayer

CGImage — Core Graphics dagi rastr tasviri, u fayldan yuklanishi, dasturiy ravishda yaratilishi yoki UIImage dan olinishi mumkin. CGImage piksel ma'lumotlari, rang fazosi, o'lcham, bit chuqurligi va ma'lumotlarning joylashuvi haqidagi ma'lumotlarni o'z ichiga oladi. UIImage dan farqli o'laroq, CGImage Retina uchun masshtablashni boshqarmaydi — bu mas'uliyatni dasturchi scale parametri orqali o'z zimmasiga oladi.

CGLayer — takroriy chizishni optimallashtirish

CGLayer — statik tarkibni oldindan rastrlashtirish uchun oflayn bufer. Agar bir xil grafik buyruqlar to'plami bir necha marta chizilsa (masalan, fon namunasi), CGLayer uni bir marta rastrlashtiradi va keyin oddiygina kontekstga nusxalaydi. Apple ma'lumotlariga ko'ra, CGLayer dan foydalanish takroriy chizishni CPU da 2–5 marta, apparat tezlashtirishi bilan 10 martagacha tezlashtirishi mumkin.

Tasvirlarni yuklash uchun CGImageSource dan foydalaning — metadata, miniatyuralar va GIF/APNG dan alohida kadrlarni o'qish uchun kuchli API. CGImageSource tasvirni progressiv yuklash va faqat kerakli qismlarni olish imkonini beradi. Katta tasvirlar bilan (ekran o'lchamidan oshib ketadigan) ishlashda diskda keshlash opsiyasi bilan CGImageSource yaratish va kichiklashtirilgan versiyani ko'rsatish uchun CGImageSourceCreateThumbnailAtIndex dan foydalanish tavsiya etiladi.

func createLayer(ctx: CGContext, size: CGSize) -> CGLayer? {
    guard let layer = CGLayer(ctx, size: size, auxiliaryInfo: nil) else { return nil }
    let layerCtx = layer.context !

    // bir marta chiz
    layerCtx.setFillColor(UIColor.lightGray.cgColor)
    layerCtx.addEllipse(in: CGRect(origin: .zero, size: size))
    layerCtx.fillPath()
    return layer
}

// draw() da foydalanish
for i in 0..<20 {
    ctx.draw(layer, at: CGPoint(x: CGFloat(i) * 30, y: 0))
}

Core Graphics bilan ishlash namunasi

Core Graphics dan foydalanib tasvirda suv belgisini ko'rsatish uchun maxsus View yaratamiz. Suv belgisi asl tasvir ustiga qo'yilgan yarim shaffof matn va vektor logotipni o'z ichiga oladi. Kod bir kontekstda CGContext, CGImage, matn va shaffoflik bilan ishlashni namoyish etadi.

class WatermarkView: UIView {

    private let watermarkText = "IT Sectr"
    private let watermarkOpacity: CGFloat = 0.3

    override func draw(_ rect: CGRect) {
        guard let ctx = UIGraphicsGetCurrentContext() else { return }

        // fon tasvirini chiz
        UIImage(named: "background")?.draw(in: rect)

        // suv belgisi shaffofligini sozla
        ctx.saveGState()
        ctx.translateBy(x: rect.midX, y: rect.midY)
        ctx.rotate(by: -.pi / 6)

        // yarim shaffof matn
        let attributes: NSAttributedString.Attributes = [
            .font: UIFont.boldSystemFont(ofSize: 48),
            .foregroundColor: UIColor.white.withAlphaComponent(watermarkOpacity)
        ]
        let textSize = watermarkText.size(withAttributes: attributes)
        watermarkText.draw(
            at: CGPoint(x: -textSize.width / 2, y: -textSize.height / 2),
            withAttributes: attributes
        )

        // matn ostida vektor ikonka (doira xoch bilan)
        ctx.setStrokeColor(UIColor.white.withAlphaComponent(watermarkOpacity).cgColor)
        ctx.setLineWidth(3)
        ctx.addEllipse(in: CGRect(x: -25, y: -75, width: 50, height: 50))
        ctx.strokePath()
        ctx.moveTo(x: -15, y: -50)
        ctx.addLineTo(x: 15, y: -50)
        ctx.moveTo(x: 0, y: -65)
        ctx.addLineTo(x: 0, y: -35)
        ctx.strokePath()

        ctx.restoreGState()
    }
}

Kodda Core Graphics ning asosiy imkoniyatlaridan foydalanilgan: saveGState/restoreGState suv belgisi effektlarini fondan ajratish uchun, translateBy va rotate joylashtirish va aylantirish uchun, withAlphaComponent orqali yarim shaffof matn va addEllipse va addLineTo orqali vektor ikonka. Butun suv belgisi fon tasviridan keyin yagona kompozitsiya sifatida chiziladi.

Ishlab chiqarishda fotosuratlar uchun suv belgilarini yaratishda samaradorlikni hisobga olish muhim. Agar tasvir ekrandan katta bo'lsa, suv belgisini qo'llashdan oldin uni CGImageSourceCreateThumbnailAtIndex orqali kichiklashtiring. Core Graphics barcha operatsiyalarni CPU da qayta ishlaydi — o'nlab tasvirlarning ommaviy qayta ishlanishi uchun UI bloklanishining oldini olish maqsadida fon navbati va CGBitmapContext dan foydalaning.