Core Graphics — यह क्या है, कार्य सिद्धांत और 2D ग्राफिक्स के लिए फ्रेमवर्क

Core Graphics क्या है?

Core Graphics (Quartz 2D के रूप में भी जाना जाता है) एक फ्रेमवर्क है जो Apple के 2D ग्राफिक्स इंजन को लागू करता है। यह Quartz पोर्टेबल ग्राफिक्स लाइब्रेरी पर आधारित है और पेज-आधारित ड्राइंग मॉडल का उपयोग करता है, जहां प्रत्येक क्रिया एक अनुक्रम में एक कमांड है जो कागज पर ड्राइंग जैसा दिखता है। Core Graphics एंटीअलियासिंग, पारदर्शिता (अल्फा कंपोजिटिंग) और ICC रंग स्थानों का समर्थन करता है।

Core Graphics आर्किटेक्चर एक ग्राफिक्स संदर्भ (CGContext) के चारों ओर बनाया गया है जो लक्ष्य आउटपुट डिवाइस — स्क्रीन, प्रिंटर, PDF दस्तावेज़ या रास्टर बफर को एनकैप्सुलेट करता है। संदर्भ वर्तमान सेटिंग्स प्रबंधित करता है: रंग, रेखा मोटाई, रूपांतरण, क्लिपिंग क्षेत्र और फ़ॉन्ट। यह दृष्टिकोण ड्राइंग कोड को बदले बिना विभिन्न आउटपुट डिवाइसों के लिए एक समान API प्रदान करता है।

Core Graphics मुख्य रूप से CPU पर काम करता है, वेक्टर मॉडल (रेज़ोल्यूशन-स्वतंत्र) का उपयोग करके। इसका मतलब है कि रेखाएं और वक्र ड्राइंग करते समय वर्तमान डिवाइस रेज़ोल्यूशन पर रास्टराइज़ किए जाते हैं। Metal के विपरीत, Core Graphics को स्पष्ट GPU संसाधन प्रबंधन की आवश्यकता नहीं है — सिस्टम सभी अनुकूलन संभालता है। अधिकांश 2D कार्यों (ग्राफिक्स, चार्ट, कस्टम UI तत्व) के लिए, Core Graphics का प्रदर्शन 60 FPS बनाए रखने के लिए पर्याप्त है।

आर्किटेक्चर और मुख्य प्रकार

Core Graphics में लगभग 50 बेस प्रकार (अपारदर्शी प्रकार) शामिल हैं, प्रत्येक विशिष्ट कार्यक्षमता के लिए जिम्मेदार है। सभी प्रकार Core Foundation मेमोरी प्रबंधन नियमों का पालन करते हैं: वे नाम में Create वाले फंक्शन के माध्यम से बनाए जाते हैं, CGRelease की कॉल की आवश्यकता होती है, और Objective-C में ARC-संगत नहीं हैं (हालांकि Swift CF_RETURNS_RETAINED एनोटेशन के माध्यम से स्वचालित रूप से मेमोरी प्रबंधित करता है)।

Core Graphics के मुख्य प्रकार

CGContext — ड्राइंग संदर्भ, फ्रेमवर्क का केंद्रीय प्रकार। CGPath — एक अपरिवर्तनीय वेक्टर पथ। CGColor — निर्दिष्ट रंग स्थान के साथ रंग। CGGradient — ग्रेडिएंट भरण। CGImage — एक रास्टर इमेज। CGLayer — बार-बार ड्राइंग के लिए अनुकूलित ऑफलाइन बफर। CGDataProvider — इमेज के लिए डेटा स्रोत। CGColorSpace — रंग स्थान (sRGB, Display P3, Gray)।

प्रत्येक प्रकार न्यूनतम ओवरहेड के लिए डिज़ाइन किया गया है: CGPath को कैश किया जा सकता है और विभिन्न संदर्भों में पुन: उपयोग किया जा सकता है, CGColor को पास करने पर GPU हार्डवेयर प्रतिनिधित्व में परिवर्तित किया जाता है, CGLayer पूर्व-रास्टराइज़्ड सामग्री संग्रहीत करता है। यह आर्किटेक्चर Core Graphics को सरल UI कार्यों और पेशेवर ग्राफिक्स संपादकों दोनों में कुशलतापूर्वक काम करने की अनुमति देता है।

CGPath: वेक्टर पथ और उनका अनुकूलन

CGPath एक अपरिवर्तनीय ऑब्जेक्ट है जो ज्यामितीय खंडों के अनुक्रम का वर्णन करता है: सीधी रेखाएं, बेज़ियर वक्र, चाप और बंद होना। UIBezierPath के विपरीत, CGPath में ड्राइंग विधियां नहीं हैं — यह केवल ज्यामिति संग्रहीत करता है। ड्राइंग के लिए, CGPath को संदर्भ में जोड़ा जाता है (CGContextAddPath) और फिर strokePath या fillPath के माध्यम से रेंडर किया जाता है। अपरिवर्तनीयता थ्रेड सुरक्षा और कैशेबिलिटी की गारंटी देती है।

पथ बनाना और अनुकूलित करना

CGPathCreateMutable चरण-दर-चरण निर्माण के लिए एक परिवर्तनीय पथ (CGMutablePathRef) बनाता है। अंतिम असेंबली के बाद, इसे एक अपरिवर्तनीय CGPathRef में परिवर्तित किया जाता है। Apple CGPath में बिंदुओं की संख्या कम करने की सिफारिश करता है — अत्यधिक जटिल पथ (1000 से अधिक खंड) रास्टराइज़ेशन को धीमा कर देते हैं। अनुकूलन के लिए, CGPathCreateCopyBySimplifyingPath का उपयोग करें, जो अनावश्यक कोलिनियर बिंदुओं को हटाता है।

दो CGPath ऑब्जेक्ट्स के बीच आकार एनिमेशन के लिए, आप CAShapeLayer की path प्रॉपर्टी पर CABasicAnimation का उपयोग कर सकते हैं। सीमा: दोनों CGPath में समान संख्या में खंड (नियंत्रण बिंदु) होने चाहिए। CGPathApply फ़ंक्शन आपको पथ के सभी तत्वों को ट्रैवर्स करने और उनकी संरचना की तुलना करने की अनुमति देता है। यदि खंड मेल नहीं खाते हैं, तो एनिमेशन झटकेदार होगा — इस मामले में, मैन्युअल बिंदु इंटरपोलेशन के लिए CADisplayLink का उपयोग करें।

// परिवर्तनीय पथ बनाएं
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()

// सुरक्षित कैशिंग के लिए अपरिवर्तनीय में बदलें
let immutablePath: CGPath = mutablePath
CATransaction.perform {
    shapeLayer.path = immutablePath
}

ग्रेडिएंट: CGGradient और CGShading

CGGradient एक ऑब्जेक्ट है जो एक सीधी रेखा (रैखिक ग्रेडिएंट) या केंद्र से किनारों तक (रेडियल ग्रेडिएंट) दो या अधिक रंगों के बीच सहज संक्रमण को परिभाषित करता है। CGGradient एक निर्दिष्ट रंग स्थान, CGColorRef की सरणी और 0.0 से 1.0 तक स्टॉप पोजीशन की सरणी के साथ बनाया जाता है। निर्माण के बाद, ग्रेडिएंट का विभिन्न संदर्भों में कई बार पुन: उपयोग किया जा सकता है।

उन्नत ग्रेडिएंट के लिए CGShading

CGShading एक अधिक शक्तिशाली तंत्र है जो पथ के साथ रंग परिवर्तन फ़ंक्शन को परिभाषित करने की अनुमति देता है। CGGradient के विपरीत, जो रंगों के एक निश्चित सेट के साथ काम करता है, CGShading एक कॉलबैक फ़ंक्शन (CGFunctionRef) का उपयोग करता है जो प्रत्येक बिंदु पर रंग की गणना करता है। यह गैर-रैखिक संक्रमण और मिश्रित रंग योजनाओं के साथ जटिल ग्रेडिएंट बनाने में सक्षम बनाता है।

आकृति के अंदर ग्रेडिएंट ड्राइंग के लिए, आकृति के पथ पर क्लिप की आवश्यकता होती है। क्रम: संदर्भ में पथ जोड़ें, CGContextClip को कॉल करें, फिर ग्रेडिएंट ड्रा करें। क्लिप के बिना, ग्रेडिएंट पूरे संदर्भ को भरता है। iOS में, CGGradient को सरल और अधिक प्रदर्शनशील विकल्प के रूप में अनुशंसित किया जाता है — CGShading केवल कस्टम रंग फ़ंक्शन के लिए उचित है।

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()
}

इमेज के साथ काम: CGImage और CGLayer

CGImage Core Graphics में एक रास्टर इमेज है जिसे फ़ाइल से लोड किया जा सकता है, प्रोग्रामेटिक रूप से बनाया जा सकता है, या UIImage से प्राप्त किया जा सकता है। CGImage में पिक्सेल डेटा, रंग स्थान जानकारी, आकार, बिट गहराई और डेटा लेआउट होता है। UIImage के विपरीत, CGImage Retina स्केलिंग का प्रबंधन नहीं करता — यह जिम्मेदारी डेवलपर पर scale पैरामीटर के माध्यम से आती है।

CGLayer — बार-बार ड्राइंग का अनुकूलन

CGLayer स्थिर सामग्री के पूर्व-रास्टराइज़ेशन के लिए एक ऑफलाइन बफर है। यदि ड्राइंग कमांड का एक ही सेट बार-बार निष्पादित किया जाता है (उदाहरण के लिए, पृष्ठभूमि पैटर्न), तो CGLayer इसे एक बार रास्टराइज़ करता है और फिर इसे संदर्भ में कॉपी करता है। Apple के अनुसार, CGLayer का उपयोग बार-बार ड्राइंग को CPU पर 2–5 गुना और हार्डवेयर त्वरण के साथ 10 गुना तक तेज कर सकता है।

इमेज लोड करने के लिए, CGImageSource का उपयोग करें — GIF/APNG से मेटाडेटा, थंबनेल और अलग-अलग फ्रेम पढ़ने के लिए एक शक्तिशाली API। CGImageSource प्रगतिशील लोडिंग और केवल आवश्यक भागों को प्राप्त करने की अनुमति देता है। बड़ी इमेज (स्क्रीन आकार से अधिक) के साथ काम करते समय, डिस्क कैशिंग के साथ CGImageSource बनाने और छोटा संस्करण प्रदर्शित करने के लिए CGImageSourceCreateThumbnailAtIndex का उपयोग करने की अनुशंसा की जाती है।

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

    // एक बार ड्रा करें
    layerCtx.setFillColor(UIColor.lightGray.cgColor)
    layerCtx.addEllipse(in: CGRect(origin: .zero, size: size))
    layerCtx.fillPath()
    return layer
}

// draw() में उपयोग
for i in 0..<20 {
    ctx.draw(layer, at: CGPoint(x: CGFloat(i) * 30, y: 0))
}

Core Graphics के साथ कोड उदाहरण

आइए Core Graphics का उपयोग करके इमेज पर वॉटरमार्क प्रदर्शित करने के लिए एक कस्टम View बनाएं। वॉटरमार्क में शामिल है मूल इमेज के ऊपर अर्ध-पारदर्शी टेक्स्ट और एक वेक्टर लोगो। कोड एक ही संदर्भ में CGContext, CGImage, टेक्स्ट और पारदर्शिता के साथ काम प्रदर्शित करता है।

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 }

        // पृष्ठभूमि इमेज ड्रा करें
        UIImage(named: "background")?.draw(in: rect)

        // वॉटरमार्क पारदर्शिता कॉन्फ़िगर करें
        ctx.saveGState()
        ctx.translateBy(x: rect.midX, y: rect.midY)
        ctx.rotate(by: -.pi / 6)

        // अर्ध-पारदर्शी टेक्स्ट
        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
        )

        // टेक्स्ट के नीचे वेक्टर आइकन (क्रॉस के साथ सर्कल)
        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()
    }
}

कोड Core Graphics की प्रमुख क्षमताओं का उपयोग करता है: पृष्ठभूमि से वॉटरमार्क प्रभावों को अलग करने के लिए saveGState/restoreGState, स्थिति और घूर्णन के लिए translateBy और rotate, withAlphaComponent के माध्यम से अर्ध-पारदर्शी टेक्स्ट, और addEllipse और addLineTo के माध्यम से वेक्टर आइकन। पूरा वॉटरमार्क पृष्ठभूमि इमेज के बाद एक एकल रचना के रूप में ड्रा किया जाता है।

उत्पादन में फ़ोटो के लिए वॉटरमार्क बनाते समय, प्रदर्शन पर विचार करना महत्वपूर्ण है। यदि इमेज स्क्रीन से बड़ी है, तो वॉटरमार्क लगाने से पहले CGImageSourceCreateThumbnailAtIndex का उपयोग करके इसे छोटा करें। Core Graphics सभी ऑपरेशन CPU पर संभालता है — दर्जनों इमेज के बैच प्रोसेसिंग के लिए, UI को ब्लॉक करने से बचने के लिए बैकग्राउंड क्यू और CGBitmapContext का उपयोग करें।