2011-09-19 14 views
6

पर चिकना लेखन मैं वर्तमान में एक आईपैड प्रोजेक्ट पर काम कर रहा हूं जहां मुझे उपयोगकर्ता को स्टाइलस के साथ कागज के टुकड़े पर लिखने की कार्यक्षमता की आवश्यकता है।आईपैड

मैंने कुछ स्टाइलस का परीक्षण किया है और पता चला है कि बांस सबसे अच्छा था। उनके पास एक नि: शुल्क एप्लिकेशन भी है जिसका उपयोग आप लिखने के लिए कर सकते हैं।

मुझे जिस समस्या का सामना करना पड़ रहा है वह यह है कि मैं जिस विधि का उपयोग करता हूं वह चिकनी घटता नहीं प्रदान करता है। बांस पेपर ऐप सही दिखने वाली लाइनें प्रदान करता है। यह कोड मेरे पास अब तक है:

- (void)drawRect:(CGRect)rect 
{ 
    CGContextRef context = UIGraphicsGetCurrentContext(); 
    UIGraphicsBeginImageContext(self.frame.size); 

    // draw accumulated lines 
    if ([self.lines count] > 0) { 
     for (Line *tempLine in self.lines){ 
      CGContextSetAlpha(context, tempLine.opacity); 
      CGContextSetStrokeColorWithColor(context, tempLine.lineColor.CGColor); 
      CGContextSetLineWidth(context, tempLine.lineWidth); 
      CGContextSetLineCap(context, kCGLineCapRound); 
      CGContextSetLineJoin(context, kCGLineJoinRound); 
      CGContextAddPath(context, tempLine.linePath); 
      CGContextStrokePath(context); 

      } 
    } 

    //draw current line 
    CGContextSetAlpha(context, self.currentLine.opacity); 


    CGContextSetStrokeColorWithColor(context, self.currentLine.lineColor.CGColor); 
    CGContextSetLineWidth(context, self.currentLine.lineWidth); 
    CGContextSetLineCap(context, kCGLineCapRound); 
    CGContextSetLineJoin(context, kCGLineJoinRound); 
    CGContextBeginPath(context); 
    CGContextAddPath(context, self.currentLine.linePath); 
    CGContextStrokePath(context); 


    UIGraphicsEndImageContext(); 


} 

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { 
    UITouch *touch = [touches anyObject]; 
    CGPoint cPoint = [touch locationInView:self]; 

    CGPathMoveToPoint(self.currentLine.linePath, NULL, cPoint.x, cPoint.y); 

    [self setNeedsDisplay]; 
} 

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event { 
    UITouch *touch = [touches anyObject]; 
    CGPoint currentPoint = [touch locationInView:self]; 

    CGPathAddLineToPoint(self.currentLine.linePath, NULL, currentPoint.x, currentPoint.y); 

    [self setNeedsDisplay]; 
} 

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { 
    UITouch *touch = [touches anyObject]; 
    CGPoint cPoint = [touch locationInView:self]; 
    CGPathAddLineToPoint(self.currentLine.linePath, NULL, cPoint.x, cPoint.y); 

    [self setNeedsDisplay]; 
    [self.lines addObject:self.currentLine]; 
    Line *nextLine = [[Line alloc] initWithOptions:self.currentLine.lineWidth color:self.currentLine.lineColor opacity:self.currentLine.opacity]; 
    self.currentLine = nextLine; 
    [nextLine release]; 
} 

यहां छवियां हैं जो यह स्पष्ट करती हैं कि मुझे किस समस्या का सामना करना पड़ रहा है।

enter image description here

यह अगर मैं Mamboo कागज एप्लिकेशन पर एक ही बात लिखने छवि है:: इस छवि को क्या उत्पन्न हो जाता है जब ऊपर दिया गया कोड के साथ लिखित रूप है

enter image description here

करता है किसी को भी यह पता है कि मम्बो ऐप में अच्छा लेखन कैसे प्राप्त किया जाए? CGPathAddCurveToPoint या CGPathAddQuadCurveToPoint:

+0

[iPhone चिकनी स्केच ड्राइंग एल्गोरिथ्म] के संभावित डुप्लिकेट (http://stackoverflow.com/questions/5076622/iphone-smooth-sketch-drawing-algorithm) –

+0

भी देखें [मैं कैसे छूने पर उंगली आंदोलन ट्रेस कर सकते हैं चिकनी घटता ड्राइंग के लिए?] (http://stackoverflow.com/questions/1052119/how-can-i-trace-the-finger-movement-on-touch-for-drawing-smooth-curves)। –

+0

नमूना https: // github देखें।com/yusenhan/चिकना-रेखा-दृश्य –

उत्तर

7
इसके बजाय सीधी रेखाएं ( CGPathAddLineToPoint) आप बेज़ियर घटता का उपयोग कर प्रयास करना चाहिए का उपयोग कर बिंदुओं को जोड़ने की

यह स्मूथिंग करेगा।


आप Bézier घटता, आप शायद the wikipedia page about Bézier curves दिलचस्प (नहीं विशेष रूप से गणित के समीकरण, लेकिन नमूने और एनिमेटेड छवियों को देखने) मिलेगा साथ familliar नहीं कर रहे हैं। यह आपके सामान्य विचार देगा कि नियंत्रण बिंदु आपकी रेखा के प्रमुख बिंदुओं के चारों ओर लाइनों की चिकनीता को कैसे प्रभावित करते हैं।

आपके मामले के लिए, क्वाड्रैटिक वक्र (आपके दो मुख्य बिंदुओं के बीच प्रत्येक उपधारा के लिए केवल एक नियंत्रण बिंदु) पर्याप्त होना चाहिए।

Construction of a quadratic Bézier curve - Source: Wikipedia (एक P0 से P1 के लिए लाइन, नियंत्रण बिंदु पी 1 का उपयोग कर समतल)


एक उदाहरण (बॉक्स से बाहर है, मेरे मन में से केवल एक सुझाव है, कभी नहीं परीक्षण किया है, अनुकूलन गुणांक की गणना करने के लिए) इस नियंत्रण बिंदु की गणना करने के लिए अपने प्रत्येक कीपॉइंट्स ए के बीच सी एसी को एबी की लंबाई के 2/3, और (एबी, एसी) को 30 डिग्री के कोण बनाने या कहने के लिए है, एसएचजी समान है।

आप स्लाइडर के साथ चिकनाई स्ट्रेन्ग समायोजित करने के लिए अपने ऐप की सेटिंग्स में भी प्रस्ताव दे सकते हैं, जो प्रत्येक नियंत्रण बिंदु की गणना करने के लिए आपके द्वारा चुने गए मानों को प्रभावित करेगा और देखें कि कौन से गुणांक सर्वोत्तम फिट बैठते हैं।

+0

ठीक है, मैंने कभी भी आईओएस एप्लिकेशन में बेजियर वक्र का उपयोग नहीं किया (अगर मैंने इसे सही याद किया तो मैंने उन्हें कुछ साल पहले जावा गेम के लिए इस्तेमाल किया था) मैं कुछ अच्छे उदाहरणों के लिए इंटरनेट खोजूंगा । यदि आपके कुछ अच्छे उदाहरण हैं, तो कृपया मुझे बताएं: डी आपके उत्तर के लिए धन्यवाद! (लाइनपैथ ऑब्जेक्ट जो अब मैं उपयोग करता हूं वह एक CGMutablePathRef है) – CyberK

+0

यह सुनिश्चित नहीं है कि आपने इसे देखा है लेकिन मैंने कुछ सुझावों के साथ पहले उत्तर के बाद से अपना उत्तर संपादित किया है;) – AliSoftware

+0

हाँ मैंने इसे देखा है ;-) – CyberK