स्विफ्ट 2.1: CAGradientLayer रंग स्थान और वितरण

Question

मेरी आवश्यकता एक दृश्य में 3-रंगीन वितरण दिखाने के लिए है। तो मैं निम्नलिखित कोड का उपयोग कर रहा हूँ।

func drawWithGradientLayer() { 

     // total contains sum of all values contained in segmentValues variable. 
     // I'm using green -> Orange -> Red colors as colors 

     if total == 0 { 
      return 
     } 

     if gradientLayer.superlayer != nil { 
      gradientLayer.removeFromSuperlayer() 
     } 

     var previous: CGFloat = (CGFloat(segmentValues[0])/CGFloat(total)) 
     var locations: [NSNumber] = [previous] 

     for var i=1; i<segmentValues.count; i++ { 
      previous = previous + (CGFloat(segmentValues[i])/CGFloat(total)) 
      locations.append(previous) 
     } 

     locations.append(1.0) // Line may need to be commented 

     gradientLayer = CAGradientLayer() 
     gradientLayer.frame = CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.height) 

     gradientLayer.startPoint = CGPointMake(0.0, 0.5); 
     gradientLayer.endPoint = CGPointMake(1.0, 0.5); 

     gradientLayer.colors = colors 
     gradientLayer.locations = locations 

     self.layer.insertSublayer(gradientLayer, atIndex: 0) 
} 

लेकिन समस्या यह है कि ढाल रंग मेरी आवश्यकताओं के अनुसार वितरित नहीं होते हैं। उदा। यदि [1,0,1] मानों का मूल्य है तो बार को 50% लाल & 0% नारंगी और 50% लाल प्रदर्शित करना चाहिए। यदि मान [0,0,1] हैं तो केवल लाल रंग खींचा जाना चाहिए। ग्रिड लाइनों के बिना मैं इसे कैसे प्राप्त कर सकता हूं?

किसी अन्य बेहतर समाधान हमेशा सराहना की जाएगी :)

Answer 1

कुंजी यहाँ समझने के लिए locations CAGradientLayer काम में है:

ढाल बंद हो जाता है 0 और 1 के बीच मूल्यों के रूप में निर्दिष्ट कर रहे हैं। मूल्यों को एकान्त रूप से बढ़ाना चाहिए।

तो तुम [1, 0, 1] जैसे स्थानों निर्दिष्ट कर सकते हैं, बल्कि [0.0, 0.33, 0.67, 1.0] की तरह कुछ का उपयोग करना चाहिए, और स्थान की संख्या को महत्व देता अपने colors गिनती के समान होना चाहिए।

कम रंग बदलाव के साथ एक ढाल बनाने के लिए की तरह आपकी छवियों में, आप प्रत्येक रंग दो बार दोहरा सकते हैं और उपयुक्त स्थानों में बताने की:

कुछ तो अपने कोड होना चाहिए की तरह:

gradientLayer.colors = [ 
     UIColor.greenColor().CGColor, UIColor.greenColor().CGColor, 
     UIColor.orangeColor().CGColor, UIColor.orangeColor().CGColor, 
     UIColor.redColor().CGColor, UIColor.redColor().CGColor 
    ] 
    gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.5) 
    gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.5) 
    gradientLayer.locations = [0.0, 0.2, 0.3, 0.7, 0.8, 1.0] 

यदि आप अपने रंगों को नहीं बदलते समय 2-रंग ग्रेडियेंट प्राप्त करना चाहते हैं, तो आप startPoint.x के लिए 0 से कम मान 0 या endPoint.x के लिए 1 से अधिक मान सेट कर सकते हैं, और एकाधिक स्थानों को शून्य पर सेट कर सकते हैं, उदाहरण:

gradientLayer.startPoint = CGPoint(x: -0.01, y: 0.5) 
    gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.5) 
    gradientLayer.locations = [0.0, 0.0, 0.0, 0.0, 0.1, 1.0] 

जो एक परिणाम इस के समान देना होगा: