Core Graphics से कस्टम ड्रॉइंग
draw(_:) में पथ और आकार बनाइए।
Core Graphics से कस्टम ड्रॉइंग, CoddyKit पर Swift Academy का एक निःशुल्क पाठ है। यह 4 में से 4वाँ पाठ है। इस अध्ययन पथ के 3 तक कोई भी पाठ पूरा पढ़ना निःशुल्क है — इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ व्यावहारिक अभ्यास भी उपलब्ध कराता है। यह Swift Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। Swift Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
कस्टम सामग्री कब बनाएँ
जब परतें और चित्र किसी आकृति को व्यक्त करने के लिए पर्याप्त न हों—जैसे चार्ट, हस्ताक्षर या कस्टम नियंत्रण—तो Core Graphics (Quartz 2D) की सहायता से उसे स्वयं बनाएँ।
draw(_:) को ओवरराइड करना
UIView की उपकक्षा बनाएँ और draw(_:) को ओवरराइड करें। UIKit इसे कॉन्फ़िगर किए गए संदर्भ के साथ कॉल करता है; आप वहीं आरेखन आदेश जारी करते हैं।
import UIKit
final class ChartView: UIView {
override func draw(_ rect: CGRect) {
// drawing commands go here
}
}ग्राफ़िक्स संदर्भ
draw(_:) के अंदर वर्तमान CGContext प्राप्त करें। यह एक स्थिति-सचेत कैनवास है: पहले रंग और रेखा की चौड़ाई सेट करें, फिर रेखांकन या भराव करें।
override func draw(_ rect: CGRect) {
guard let ctx = UIGraphicsGetCurrentContext() else { return }
ctx.setFillColor(UIColor.systemTeal.cgColor)
ctx.fill(rect)
}पथ बनाना
CGPath (या UIBezierPath) रेखाओं, वक्रों और आकृतियों का वर्णन करता है। आरंभिक बिंदु पर जाएँ, फिर रेखाएँ और वक्र जोड़ें।
let path = UIBezierPath()
path.move(to: CGPoint(x: 0, y: 0))
path.addLine(to: CGPoint(x: 100, y: 50))
path.addLine(to: CGPoint(x: 0, y: 100))
path.close()रेखांकन और भराव
रेखांकन किसी पथ की बाहरी सीमा बनाता है; भराव उसके अंदरूनी भाग को रंगता है। रंग और चौड़ाई सेट करें, फिर stroke() या fill() कॉल करें।
UIColor.systemRed.setStroke()
let line = UIBezierPath()
line.lineWidth = 3
line.move(to: CGPoint(x: 10, y: 10))
line.addLine(to: CGPoint(x: 90, y: 90))
line.stroke()वक्र
कंट्रोल बिंदु निर्दिष्ट करके द्विघाती (addQuadCurve) या घन (addCurve) बेज़ियर खंडों से चिकने वक्र जोड़ें।
let p = UIBezierPath()
p.move(to: CGPoint(x: 0, y: 100))
p.addCurve(to: CGPoint(x: 200, y: 100),
controlPoint1: CGPoint(x: 50, y: 0),
controlPoint2: CGPoint(x: 150, y: 200))संदर्भ की स्थिति: सहेजना और पुनर्स्थापित करना
संदर्भ स्थिति-सचेत होता है। रूपांतरणों और क्लिपिंग को saveGState()/restoreGState() के बीच रखें, ताकि बदलाव बाद के आरेखन में अनचाहे रूप से लागू न हों।
ctx.saveGState()
ctx.translateBy(x: 50, y: 50)
ctx.rotate(by: .pi / 4)
// draw rotated content
ctx.restoreGState()ग्रेडिएंट और छायाएँ
Core Graphics ग्रेडिएंट (CGGradient के साथ drawLinearGradient) और छायाएँ (setShadow(offset:blur:color:)) सीधे संदर्भ में बना सकता है।
ctx.setShadow(offset: CGSize(width: 0, height: 2),
blur: 4,
color: UIColor.black.cgColor)क्लिपिंग
एक पथ जोड़ें और clip() कॉल करके उसके बाद होने वाले आरेखन को उस क्षेत्र तक सीमित करें—यह गोलाकार चित्रों या मास्क किए गए भराव के लिए उपयोगी है।
let clipPath = UIBezierPath(ovalIn: rect)
clipPath.addClip()
// drawing now constrained to the ovalप्रदर्शन और setNeedsDisplay
draw(_:) CPU पर चलता है और अपेक्षाकृत महँगा होता है। केवल आवश्यकता होने पर setNeedsDisplay() के माध्यम से फिर से आरेखन कराएँ और आरेखन कोड को संक्षिप्त रखें।
func updateData() {
self.data = newData
setNeedsDisplay() // schedule one redraw
}ऑफ़-स्क्रीन रेंडरिंग
पुनः उपयोग किए जा सकने वाले बिटमैप के लिए हर फ़्रेम में फिर से आरेखन करने के बजाय UIGraphicsImageRenderer की सहायता से किसी चित्र में रेंडर करें।
let renderer = UIGraphicsImageRenderer(size: CGSize(width: 100, height: 100))
let image = renderer.image { ctx in
UIColor.systemBlue.setFill()
ctx.fill(CGRect(x: 0, y: 0, width: 100, height: 100))
}त्वरित जाँच: Core Graphics
कस्टम आरेखन की अपनी समझ जाँचें।
पुनरावलोकन: Core Graphics से कस्टम आरेखन
draw(_:) को ओवरराइड करें और CGContext को आदेश दें: रेखाओं और बेज़ियर वक्रों से पथ बनाएँ, फिर उनका रेखांकन या भराव करें। saveGState()/restoreGState() से रूपांतरणों और क्लिपिंग को अलग रखें और ग्रेडिएंट, छायाएँ तथा क्लिप सीधे बनाएँ।
आरेखन CPU का काम है—केवल setNeedsDisplay() के माध्यम से फिर से आरेखन करें और UIGraphicsImageRenderer से पुनः उपयोग किए जा सकने वाले बिटमैप को कैश करें।
एआई शिक्षक के साथ Swift सीखें — निःशुल्क
अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।
- पाठ्यक्रम
- 122
- पाठ
- 409
अक्सर पूछे जाने वाले प्रश्न
क्या “Core Graphics से कस्टम ड्रॉइंग” पाठ निःशुल्क है?
हाँ — Swift Academy अध्ययन पथ के 3 तक कोई भी पाठ, जिसमें “Core Graphics से कस्टम ड्रॉइंग” भी शामिल है, यहाँ वेब पर पूरा पढ़ना निःशुल्क है। इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ इंटरैक्टिव अभ्यास भी उपलब्ध कराता है। Swift Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
“Core Graphics से कस्टम ड्रॉइंग” में मैं क्या सीखूँगा?
draw(_:) में पथ और आकार बनाइए। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ Swift Academy का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।
क्या Swift Academy शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?
पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर Swift Academy शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 4 में से 4वाँ पाठ है।
“Core Graphics से कस्टम ड्रॉइंग” पाठ पूरा करने में कितना समय लगता है?
CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।
क्या मैं इस Swift Academy पाठ में कोड लिख और चला सकता हूँ?
हाँ। हर Swift Academy पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।
इस पाठ्यक्रम के सभी पाठ
- CALayer की मूल बातें
- इम्प्लिसिट और एक्सप्लिसिट ऐनिमेशन
- ट्रांसफ़ॉर्म और 3D प्रभाव
- Core Graphics से कस्टम ड्रॉइंग