প্রোগ্রামিয়ালি রঙের গ্রেডিয়েন্ট সহ একটি ইউআইভিউ তৈরি করুন


292

আমি রানটাইমে গ্রেডিয়েন্ট কালার ব্যাকগ্রাউন্ড (স্বচ্ছ একটি রঙ থেকে স্বচ্ছ) সহ একটি ভিউ জেনার চেষ্টা করছি। এটা করার কোন উপায় আছে?


2
এই সহায়ক সামান্য সরঞ্জাম যা করার জন্য আপনাকে গ্রেডিয়েন্ট কোড সৃষ্টি করে itunes.apple.com/gb/app/gradient-creator/id1031070259?mt=12
burrGGG

ক্যাগ্রাডিয়েন্টলায়ার অ্যাপকোডা
সর্বাধিক

উত্তর:


694

উদ্দেশ্য গ:

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 50)];
CAGradientLayer *gradient = [CAGradientLayer layer];

gradient.frame = view.bounds;
gradient.colors = @[(id)[UIColor whiteColor].CGColor, (id)[UIColor blackColor].CGColor];

[view.layer insertSublayer:gradient atIndex:0];

সুইফট:

let view = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 50))
let gradient = CAGradientLayer()

gradient.frame = view.bounds
gradient.colors = [UIColor.white.cgColor, UIColor.black.cgColor]

view.layer.insertSublayer(gradient, at: 0)

তথ্য : গ্রেডিয়েন্টের দিক পরিবর্তন করতে স্টার্টপয়েন্ট এবং শেষ পয়েন্ট ব্যবহার করুন ।

এই সম্মুখের যোগ অন্য কোন মতামত থাকে তাহলে UIView(যেমন একটি হিসাবে UILabel), আপনি ঐ পটভূমির রঙ সেটিং কথা বিবেচনা করতে পারেন UIView'থেকে গুলি [UIColor clearColor]তাই গ্রেডিয়েন্ট দৃশ্য সাব দেখা পটভূমির রঙ বদলে উপস্থাপন করা হয়। ব্যবহারের ক্ষেত্রে clearColorসামান্য পারফরম্যান্স হিট হয়েছে।


13
সমস্ত সমাধানের মধ্যে সংক্ষিপ্ত পরিমাণের কোডের জন্য +1। আমি শুধু আমার বর্তমান দৃশ্য নিয়ামক যোগ করা, এর 2 refs পরিবর্তিত viewকরতে self.viewএবং এটি একটি যাদুমন্ত্র মত :) কাজ
Ergin

4
এছাড়াও এই কোডটি যুক্ত করার ক্ষেত্রে প্রাসঙ্গিক। এটি কাজ করার জন্য আমার নিম্নলিখিত পোস্টের প্রয়োজন ছিল: stackoverflow.com/a/20059268/1480518
গ্যারেট ডিস্ক

13
এটি আমাকে অনেক সাহায্য করেছে! অন্য কোথাও সিজি কালার অংশ মিস করেছেন! ধন্যবাদ
গাইফিস

48
গ্রেডিয়েন্ট দিক পরিবর্তন করতে 'স্টার্ট পয়েন্ট' এবং 'এন্ডপয়েন্ট' ব্যবহার করতে ভুলবেন না। ডিফল্ট মানগুলি হ'ল (0.5, 0) এবং (0.5,1) - উপরে থেকে নীচের দিকে।
ভ্যালেন্টাইন শামারদিন

12
আমার ইউআইভিউ যখন অটোলআউট ব্যবহার করছে তখন আমাকেও কল করতে gradient.frame = view.boundsহয়েছিল viewDidAppear()এবং didRotateFromInterfaceOrientation()অন্যথায় গ্রেডিয়েন্টটি সঠিকভাবে আকারযুক্ত হবে না।
এরিকরবার্টব্রেয়ার

70

আপনি একটি কাস্টম ক্লাস তৈরি করতে পারেন GradientView:

সুইফট 5

class GradientView: UIView {
    override open class var layerClass: AnyClass {
       return CAGradientLayer.classForCoder()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        let gradientLayer = layer as! CAGradientLayer
        gradientLayer.colors = [UIColor.white.cgColor, UIColor.black.cgColor]
    }
}

স্টোরিবোর্ডে, গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড থাকতে চান এমন কোনও দৃশ্যে শ্রেণীর ধরণ সেট করুন:

এখানে চিত্র বর্ণনা লিখুন

এটি নিম্নলিখিত উপায়ে আরও ভাল:

  • ফ্রেম সেট করার দরকার নেই CLayer
  • NSConstraintযথারীতি ব্যবহার করুনUIView
  • সাবলেয়ার তৈরি করার দরকার নেই (কম স্মৃতি ব্যবহার)

1
সুইফ্ট 3-এ layerClassআর কোনও ফাংশন নয়, এটি একটি সম্পত্তি তাই আপনাকে এটি কোনও সম্পত্তির মতো ওভাররাইড করতে হবে: স্ট্যাকওভারফ্লো / প্রশ্নগুলি / 28786597/… । এছাড়াও আপনাকে বাস্তবায়ন করতে হবে override init(frame: CGRect), এই উত্তরটি পরীক্ষা করুন: স্ট্যাকওভারফ্লো / প্রশ্নগুলি / 27374330/… । ধন্যবাদ!
লাললোপ

হ্যালো @ লালোলুপ, মন্তব্যের জন্য ধন্যবাদ! আমি কোড আপডেট করেছি। আমি মনে করি না init(frame:CGRect)যদিও আমাকে ওভাররাইড করতে হবে । আমি আপডেট কোডটি পরীক্ষা করেছি এবং এটি ঠিকঠাক কাজ করে।
Yuchen Zhong

@ ইউচেন ঝং এটি আইবিতে ক্র্যাশ হচ্ছে, তবে অ্যাপটিতে কাজ করে। আইবিতে রেন্ডার না হওয়ার কোনও কারণ যদি @IBDesignableব্যবহার করা হয়?
আলেকজান্ডার ভোলকভ

@ আলেকজান্ডারভোলকভ সম্ভবত অন্য কোনও সমস্যা? আমরা স্টোরিবোর্ডে এটি এর মতো ব্যবহার করে আসছি এবং যদিও কোনও সমস্যা আছে বলে মনে হয় না। আপনি আপনার স্টোরিবোর্ডটি ডিবাগ করতে পারেন এবং কোন লাইনটি ক্র্যাশ করছে তা দেখতে পারেন।
Yuchen Zhong

1
সবচেয়ে ভালো সমাধান !
বারাণ এমরে

40

এটি চেষ্টা করুন এটি আমার জন্য কবজির মতো কাজ করেছে,

উদ্দেশ্য গ

আমি আরজিবি গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড কালার ইউআইভিউতে সেট করেছি

   UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0,0,320,35)];
   CAGradientLayer *gradient = [CAGradientLayer layer];
   gradient.frame = view.bounds;
   gradient.startPoint = CGPointZero;
   gradient.endPoint = CGPointMake(1, 1);
   gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor colorWithRed:34.0/255.0 green:211/255.0 blue:198/255.0 alpha:1.0] CGColor],(id)[[UIColor colorWithRed:145/255.0 green:72.0/255.0 blue:203/255.0 alpha:1.0] CGColor], nil];
   [view.layer addSublayer:gradient];

এখানে চিত্র বর্ণনা লিখুন

আপডেট করা: - সুইফট 3 +

কোড : -

 var gradientView = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 35))
 let gradientLayer:CAGradientLayer = CAGradientLayer()
 gradientLayer.frame.size = self.gradientView.frame.size
 gradientLayer.colors = 
 [UIColor.white.cgColor,UIColor.red.withAlphaComponent(1).cgColor] 
//Use diffrent colors
 gradientView.layer.addSublayer(gradientLayer)

এখানে চিত্র বর্ণনা লিখুন

আপনি গ্রেডিয়েন্ট রঙের শুরু এবং শেষ পয়েন্ট যুক্ত করতে পারেন।

  gradientLayer.startPoint = CGPoint(x: 0.0, y: 1.0)
  gradientLayer.endPoint = CGPoint(x: 1.0, y: 1.0)

এখানে চিত্র বর্ণনা লিখুন

আরও বিশদ বিবরণের জন্য CAGradientLayer ডক দেখুন

আশা করি এটি কারওর জন্য সহায়ক।


36

এটি আমার প্রস্তাবিত পদ্ধতি।

পুনঃব্যবহারযোগ্যতা প্রচার করতে, আমি বলব একটি বিভাগ তৈরি CAGradientLayerকরুন এবং শ্রেণি পদ্ধতি হিসাবে আপনার পছন্দসই গ্রেডিয়েন্ট যুক্ত করুন। এগুলি headerফাইলে তাদের নির্দিষ্ট করুন :

#import <QuartzCore/QuartzCore.h>

@interface CAGradientLayer (SJSGradients)

+ (CAGradientLayer *)redGradientLayer;
+ (CAGradientLayer *)blueGradientLayer;
+ (CAGradientLayer *)turquoiseGradientLayer;
+ (CAGradientLayer *)flavescentGradientLayer;
+ (CAGradientLayer *)whiteGradientLayer;
+ (CAGradientLayer *)chocolateGradientLayer;
+ (CAGradientLayer *)tangerineGradientLayer;
+ (CAGradientLayer *)pastelBlueGradientLayer;
+ (CAGradientLayer *)yellowGradientLayer;
+ (CAGradientLayer *)purpleGradientLayer;
+ (CAGradientLayer *)greenGradientLayer;

@end

তারপরে আপনার বাস্তবায়ন ফাইলে, এই সিনট্যাক্স সহ প্রতিটি গ্রেডিয়েন্ট নির্দিষ্ট করুন:

+ (CAGradientLayer *)flavescentGradientLayer
{
    UIColor *topColor = [UIColor colorWithRed:1 green:0.92 blue:0.56 alpha:1];
    UIColor *bottomColor = [UIColor colorWithRed:0.18 green:0.18 blue:0.18 alpha:1];

    NSArray *gradientColors = [NSArray arrayWithObjects:(id)topColor.CGColor, (id)bottomColor.CGColor, nil];
    NSArray *gradientLocations = [NSArray arrayWithObjects:[NSNumber numberWithInt:0.0],[NSNumber numberWithInt:1.0], nil];

    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.colors = gradientColors;
    gradientLayer.locations = gradientLocations;

    return gradientLayer;
}

তারপরে কেবল আপনার ViewControllerবা অন্য প্রয়োজনীয় কোনও ক্ষেত্রে এই বিভাগটি আমদানি করুন subclassএবং এটি ব্যবহার করুন:

CAGradientLayer *backgroundLayer = [CAGradientLayer purpleGradientLayer];
backgroundLayer.frame = self.view.frame;
[self.view.layer insertSublayer:backgroundLayer atIndex:0];

কোডটি এটি ব্যবহার করার জন্য আপনার কোথায় রাখা উচিত? জীবনচক্র পদ্ধতি কি? ভিডিডিপ্পিয়ার এটিকে একটি দ্বিতীয় দেরীতেও উপস্থিত করে তোলে। ভিউডিডলোড এবং ভিউডিডাপিয়ারের কারণে এটি ঘোরার সময় কাজ করে না। ভিডিডিলেআউটআউজভিউগুলি ঘোরার জন্য আরও ভাল কাজ করে তবে কিছুটা চপ্পল খুঁজছে।
অ্যাডাম জনস

আমি ব্যক্তিগতভাবে এটি রেখেছিviewDidLoad
স্যাম ফিশার

1
আমি যখন viewDidLoadএটি রেখেছি, অ্যাপটি ল্যান্ডস্কেপ অভিযোজনে চালু করা থাকলে এটি কাজ করে না। অন্যান্য সমাধানের জন্য ক্ষতিপূরণ দেওয়ার জন্য আমার সমাধানটি ভিউ.ফ্রেমের চেয়ে ব্যাকগ্রাউন্ড স্তর ফ্রেমকে আরও প্রশস্ত করা হয়েছিল।
অ্যাডাম জনস

2
ভিউডিডলড কাজ করে, আপনাকে কেবল [ব্যাকগ্রাউন্ডলায়ার সেটঅটোরাইজিং ম্যাস্ক: ইউআইভিউআউটোরিজাইজিং ফ্লেসিবিউইথ | ইউআইভিউএইটোরাইজিংফ্ল্যাক্সহাইট] ব্যবহার করে অটোরিসাইজিংম্যাক সেট করতে হবে;
ekscrypto

21

যেহেতু আমার অ্যাপ্লিকেশনটিতে আমার কেবল এক ধরণের গ্রেডিয়েন্টের প্রয়োজন ছিল তাই আমি ইউআইভিউয়ের একটি সাবক্লাস তৈরি করেছি এবং স্থির রংগুলির সাথে প্রারম্ভিককরণের উপর গ্রেডিয়েন্ট স্তরটি পূর্বনির্ধারিত করেছি। UIView এর initializers কল configureGradientLayer -method, যা CAGradientLayer কনফিগার:

DDGradientView.h:

#import <UIKit/UIKit.h>

@interface DDGradientView : UIView {

}
@end

DDGradientView.m:

#import "DDGradientView.h"

@implementation DDGradientView

// Change the views layer class to CAGradientLayer class
+ (Class)layerClass
{
    return [CAGradientLayer class];
}

- (instancetype)initWithCoder:(NSCoder *)aDecoder {
    self = [super initWithCoder:aDecoder];
    if(self) {
        [self configureGradientLayer];
    }
    return self;
}

- (instancetype)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if(self) {
        [self configureGradientLayer];
    }
    return self;
}

// Make custom configuration of your gradient here   
- (void)configureGradientLayer {
    CAGradientLayer *gLayer = (CAGradientLayer *)self.layer;
    gLayer.colors = [NSArray arrayWithObjects:(id)[[UIColor whiteColor] CGColor], (id)[[UIColor lightGrayColor] CGColor], nil];
}
@end

পদ্ধতির নামটি initGradientLayerএকটি ইনিশিয়ালাইজারের মতো। আমি এটি খুব উপযুক্ত মনে করি না।
ডনসং

@ ডনসং শুভ পয়েন্ট, আমি এটিকে 'কনফিগার গ্রেডিয়েন্টলায়ার'-এ পরিবর্তন করেছি।
ব্লুজাহান

12

সুইফ্ট বাস্তবায়ন:

var gradientLayerView: UIView = UIView(frame: CGRectMake(0, 0, view.bounds.width, 50))
var gradient: CAGradientLayer = CAGradientLayer()
gradient.frame = gradientLayerView.bounds
gradient.colors = [UIColor.grayColor().CGColor, UIColor.clearColor().CGColor]
gradientLayerView.layer.insertSublayer(gradient, atIndex: 0)
self.view.layer.insertSublayer(gradientLayerView.layer, atIndex: 0)

11

আমি সুইফটের এক্সটেনশন কার্যকারিতা পাশাপাশি একটি এনাম ব্যবহার করে গ্রহণযোগ্য উত্তরটি কিছুটা বাড়িয়েছি।

ওহ এবং আপনি যদি আমার মতো স্টোরিবোর্ড ব্যবহার করে থাকেন তবে অবশ্যই কলটি করতে ভুলবেন gradientBackground(from:to:direction:)নাviewDidLayoutSubviews() বা পরে।

সুইফট 3

enum GradientDirection {
    case leftToRight
    case rightToLeft
    case topToBottom
    case bottomToTop
}

extension UIView {
    func gradientBackground(from color1: UIColor, to color2: UIColor, direction: GradientDirection) {
        let gradient = CAGradientLayer()
        gradient.frame = self.bounds
        gradient.colors = [color1.cgColor, color2.cgColor]

        switch direction {
        case .leftToRight:
            gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
            gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
        case .rightToLeft:
            gradient.startPoint = CGPoint(x: 1.0, y: 0.5)
            gradient.endPoint = CGPoint(x: 0.0, y: 0.5)
        case .bottomToTop:
            gradient.startPoint = CGPoint(x: 0.5, y: 1.0)
            gradient.endPoint = CGPoint(x: 0.5, y: 0.0)
        default:
            break
        }

        self.layer.insertSublayer(gradient, at: 0)
    }
}

10

আমি এটিকে এক্সটেনশন সহ দ্রুত বাস্তবায়িত করেছি:

সুইফট 3

extension UIView {
    func addGradientWithColor(color: UIColor) {
        let gradient = CAGradientLayer()
        gradient.frame = self.bounds
        gradient.colors = [UIColor.clear.cgColor, color.cgColor]

        self.layer.insertSublayer(gradient, at: 0)
    }
}

সুইফট 2.2

extension UIView {
    func addGradientWithColor(color: UIColor) {
        let gradient = CAGradientLayer()
        gradient.frame = self.bounds
        gradient.colors = [UIColor.clearColor().CGColor, color.CGColor]

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

না আমি এই মত প্রতিটি ভিউতে গ্রেডিয়েন্ট সেট করতে পারি না:

myImageView.addGradientWithColor(UIColor.blue)

সুইফট 3 কলটি অবশ্যই হবে: মাই আইজামভিউ.এডডি গ্রেডিয়েন্ট উইথ কালার (রঙ: UIColor.blue)
mgyky

8

একটি দ্রুত পদ্ধতির

এই উত্তরটি উপরের উত্তরের উপর ভিত্তি করে এবং ঘূর্ণনের সময় গ্রেডিয়েন্টের যথাযথ প্রয়োগ না করা সম্পর্কিত সমস্যা মোকাবেলায় বাস্তবায়ন সরবরাহ করে। এটি গ্রেডিয়েন্ট স্তরটিকে একটি স্কোয়ারে পরিবর্তন করে এই সমস্যাটিকে সন্তুষ্ট করে যাতে সমস্ত দিকের আবর্তন সঠিক গ্রেডিয়েন্টের ফলস্বরূপ। ফাংশন স্বাক্ষরটিতে একটি সুইফ্ট বৈকল্পিক যুক্তি অন্তর্ভুক্ত যা একজনকে প্রয়োজনীয় হিসাবে অনেকগুলি সিজি কালারআরফের (সিজি কলর) পাস করতে দেয় (নমুনার ব্যবহার দেখুন)। এছাড়াও সুইফট এক্সটেনশন হিসাবে একটি উদাহরণ দেওয়া হয়েছে যাতে যে কোনও ইউআইভিউতে গ্রেডিয়েন্ট প্রয়োগ করতে পারে।

   func configureGradientBackground(colors:CGColorRef...){

        let gradient: CAGradientLayer = CAGradientLayer()
        let maxWidth = max(self.view.bounds.size.height,self.view.bounds.size.width)
        let squareFrame = CGRect(origin: self.view.bounds.origin, size: CGSizeMake(maxWidth, maxWidth))
        gradient.frame = squareFrame

        gradient.colors = colors
        view.layer.insertSublayer(gradient, atIndex: 0)
    }

ব্যবহার করা:

ভিডডিলোডে ...

  override func viewDidLoad() {
        super.viewDidLoad()
        configureGradientBackground(UIColor.redColor().CGColor, UIColor.whiteColor().CGColor)
  }

সম্প্রসারণ বাস্তবায়ন

extension CALayer {


    func configureGradientBackground(colors:CGColorRef...){

        let gradient = CAGradientLayer()

        let maxWidth = max(self.bounds.size.height,self.bounds.size.width)
        let squareFrame = CGRect(origin: self.bounds.origin, size: CGSizeMake(maxWidth, maxWidth))
        gradient.frame = squareFrame

        gradient.colors = colors

        self.insertSublayer(gradient, atIndex: 0)
    }

}

এক্সটেনশন ব্যবহারের ক্ষেত্রে উদাহরণ:

 override func viewDidLoad() {
        super.viewDidLoad()

        self.view.layer.configureGradientBackground(UIColor.purpleColor().CGColor, UIColor.blueColor().CGColor, UIColor.whiteColor().CGColor)
 }

যার অর্থ গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড এখন যে কোনও ইউআইসিএন্ট্রোলটিতে প্রয়োগ করা যেতে পারে যেহেতু সমস্ত নিয়ন্ত্রণগুলি ইউআইভিউ (বা একটি সাবক্লাস) এবং সমস্ত ইউআইভিউ'র ক্যালায়ার রয়েছে।

সুইফট 4

সম্প্রসারণ বাস্তবায়ন

extension CALayer {
    public func configureGradientBackground(_ colors:CGColor...){

        let gradient = CAGradientLayer()

        let maxWidth = max(self.bounds.size.height,self.bounds.size.width)
        let squareFrame = CGRect(origin: self.bounds.origin, size: CGSize(width: maxWidth, height: maxWidth))
        gradient.frame = squareFrame

        gradient.colors = colors

        self.insertSublayer(gradient, at: 0)
    }    
}

এক্সটেনশন ব্যবহারের ক্ষেত্রে উদাহরণ:

override func viewDidLoad() {
    super.viewDidLoad()

    self.view.layer.configureGradientBackground(UIColor.purple.cgColor, UIColor.blue.cgColor, UIColor.white.cgColor)
}

5

আপনি যা খুঁজছেন তা হ'ল CAGradientLayer। প্রত্যেকের UIViewএকটি স্তর থাকে - সেই স্তরটিতে আপনি সাবলেয়ারগুলি যুক্ত করতে পারেন, ঠিক তেমনি আপনি সাবভিউ যুক্ত করতে পারেন। একটি নির্দিষ্ট প্রকারটি হ'ল CAGradientLayer, যেখানে আপনি এটিকে গ্রেড করার জন্য রঙের একটি অ্যারে দেন।

গ্রেডিয়েন্ট দর্শনের জন্য একটি উদাহরণ এই সাধারণ মোড়ক:

http://oleb.net/blog/2010/04/obgradientview-a-simple-uiview-wrapper-for-cagradientlayer/

নোট করুন যে কোনও ইউআইভিউর সমস্ত স্তর অংশ অ্যাক্সেস করার জন্য আপনার কোয়ার্টজেকোর ফ্রেমওয়ার্কটি অন্তর্ভুক্ত করতে হবে।


4

সুইফট 4:

আইবিতে সঠিকভাবে গ্রেডিয়েন্ট দেখায়:

@IBDesignable public class GradientView: UIView {

    override open class var layerClass: AnyClass {
        return CAGradientLayer.classForCoder()
    }

    required public init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        configureGradientLayer()
    }

    public override init(frame: CGRect) {
        super.init(frame: frame)
        configureGradientLayer()
    }

    func configureGradientLayer() {
        let gradientLayer = layer as! CAGradientLayer
        gradientLayer.colors = [UIColor(hex: 0x003399).cgColor, UIColor(hex: 0x00297b).cgColor]
    }
}

4
extension UIView {

    func applyGradient(isVertical: Bool, colorArray: [UIColor]) {
        if let sublayers = layer.sublayers {
            sublayers.filter({ $0 is CAGradientLayer }).forEach({ $0.removeFromSuperlayer() })
        }

        let gradientLayer = CAGradientLayer()
        gradientLayer.colors = colorArray.map({ $0.cgColor })
        if isVertical {
            //top to bottom
            gradientLayer.locations = [0.0, 1.0]
        } else {
            //left to right
            gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.5)
            gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.5)
        }

        backgroundColor = .clear
        gradientLayer.frame = bounds
        layer.insertSublayer(gradientLayer, at: 0)
    }

}

, USAGE

someView.applyGradient(isVertical: true, colorArray: [.green, .blue])

3

ইউচেনের সংস্করণের উপর ভিত্তি করে সরল সুইফ্ট ভিউ

class GradientView: UIView {
    override class func layerClass() -> AnyClass { return CAGradientLayer.self }

    lazy var gradientLayer: CAGradientLayer = {
        return self.layer as! CAGradientLayer
    }()

    override init(frame: CGRect) {
        super.init(frame: frame)
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }

}

তারপরে আপনি এভাবে আরম্ভের পরে গ্রেডিয়েন্টলায়ার ব্যবহার করতে পারেন ...

someView.gradientLayer.colors = [UIColor.whiteColor().CGColor, UIColor.blackColor().CGColor]

3

আমার সমাধান হ'ল পঠনযোগ্য সম্পত্তি হিসাবে অ্যাক্সেসযোগ্য UIViewসহ সাবক্লাস তৈরি করা CAGradientLayer। এটি আপনাকে কীভাবে আপনার গ্রেডিয়েন্টটি কাস্টমাইজ করতে দেয় এবং আপনাকে নিজেরাই লেআউট পরিবর্তনগুলি পরিচালনা করতে হবে না। সাবক্লাস বাস্তবায়ন:

@interface GradientView : UIView

@property (nonatomic, readonly) CAGradientLayer *gradientLayer;

@end

@implementation GradientView

+ (Class)layerClass
{
    return [CAGradientLayer class];
}

- (CAGradientLayer *)gradientLayer
{
    return (CAGradientLayer *)self.layer;
}

@end

ব্যবহার:

self.iconBackground = [GradientView new];
[self.background addSubview:self.iconBackground];
self.iconBackground.gradientLayer.colors = @[(id)[UIColor blackColor].CGColor, (id)[UIColor whiteColor].CGColor];
self.iconBackground.gradientLayer.startPoint = CGPointMake(1.0f, 1.0f);
self.iconBackground.gradientLayer.endPoint = CGPointMake(0.0f, 0.0f);


2

সুইফট 3

আপনার দৃষ্টিতে গ্রেডিয়েন্ট স্তর যুক্ত করতে

  • আপনার দর্শন নালীটি আবদ্ধ করুন

    @IBOutlet var YOURVIEW : UIView!
  • CAGradientLayer () সংজ্ঞায়িত করুন

    var gradient = CAGradientLayer()
  • আপনার ভিউডিডোডে আপনাকে যে কোডটি লিখতে হবে তা এখানে

    YOURVIEW.layoutIfNeeded()

    gradient.startPoint = CGPoint(x: CGFloat(0), y: CGFloat(1)) gradient.endPoint = CGPoint(x: CGFloat(1), y: CGFloat(0)) gradient.frame = YOURVIEW.bounds gradient.colors = [UIColor.red.cgColor, UIColor.green.cgColor] gradient.colors = [ UIColor(red: 255.0/255.0, green: 56.0/255.0, blue: 224.0/255.0, alpha: 1.0).cgColor,UIColor(red: 86.0/255.0, green: 13.0/255.0, blue: 232.0/255.0, alpha: 1.0).cgColor,UIColor(red: 16.0/255.0, green: 173.0/255.0, blue: 245.0/255.0, alpha: 1.0).cgColor] gradient.locations = [0.0 ,0.6 ,1.0] YOURVIEW.layer.insertSublayer(gradient, at: 0)


1
আমি এই দৃষ্টিভঙ্গিটি ব্যবহার করেছি, আমার দৃশ্যের জন্য আমার শীর্ষস্থানীয় এর নাম "শীর্ষস্থান" পরিবর্তন করে। আমি "অনুসন্ধান ভিউ" লাইনটি মুছে ফেলেছি।
জেসি

ভাল পরিকল্পনা - সম্ভবত এটিও নোট করুন যে আপনি গ্রেডিয়েন্ট.colors সেট আপগুলি ব্যবহার করতে পারেন। সুতরাং, যদি আপনি নামযুক্ত ইউআই রঙগুলি ব্যবহার করে সাধারণ গ্রেডিয়েন্ট.colors মন্তব্য করেন তবে চিত্রটি একই, তবে আপনি যদি অন্যটির বাইরে মন্তব্য করেন তবে রঙ গ্রেডিয়েন্টটি পরে লাল থেকে সবুজ রঙের উপর নির্ভর করে। ব্যবহারকারীরা যে কোনও একটি করতে পারেন।
জেসি

1

সুইফ্ট ৩.১ এ আমি এই এক্সটেনশনটি ইউআইভিউতে যুক্ত করেছি

import Foundation
import UIKit
import CoreGraphics


extension UIView {
    func gradientOfView(withColours: UIColor...) {

        var cgColours = [CGColor]()

        for colour in withColours {
            cgColours.append(colour.cgColor)
        }
        let grad = CAGradientLayer()
        grad.frame = self.bounds
        grad.colors = cgColours
        self.layer.insertSublayer(grad, at: 0)
    }
}

যা আমি পরে কল

    class OverviewVC: UIViewController {

        override func viewDidLoad() {
            super.viewDidLoad()

            self.view.gradientOfView(withColours: UIColor.red,UIColor.green, UIColor.blue)

        }
}

0

আমি আমার কোডে এটি প্রয়োগ করেছি।

UIView *view1 = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, self.view.frame.size.width, 31.0f)];
view1.backgroundColor = [UIColor clearColor];
CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = view1.bounds;
UIColor *topColor = [UIColor colorWithRed:132.0/255.0 green:222.0/255.0 blue:109.0/255.0 alpha:1.0];
UIColor *bottomColor = [UIColor colorWithRed:31.0/255.0 green:150.0/255.0 blue:99.0/255.0 alpha:1.0];
gradient.colors = [NSArray arrayWithObjects:(id)[topColor CGColor], (id)[bottomColor CGColor], nil];


[view1.layer insertSublayer:gradient atIndex:0];

এখন আমি আমার দৃষ্টিতে গ্রেডিয়েন্ট দেখতে পাচ্ছি।


0

ইউআইভিউকে গ্রেডিয়েন্ট রঙ দেওয়ার জন্য (দ্রুত ৪.২)

func makeGradientLayer(`for` object : UIView, startPoint : CGPoint, endPoint : CGPoint, gradientColors : [Any]) -> CAGradientLayer {
        let gradient: CAGradientLayer = CAGradientLayer()
        gradient.colors = gradientColors
        gradient.locations = [0.0 , 1.0]
        gradient.startPoint = startPoint
        gradient.endPoint = endPoint
        gradient.frame = CGRect(x: 0, y: 0, w: object.frame.size.width, h: object.frame.size.height)
        return gradient
    }

ব্যবহারবিধি

let start : CGPoint = CGPoint(x: 0.0, y: 1.0)
let end : CGPoint = CGPoint(x: 1.0, y: 1.0)

let gradient: CAGradientLayer = makeGradientLayer(for: cell, startPoint: start, endPoint: end, gradientColors: [
                    UIColor(red:0.92, green:0.07, blue:0.4, alpha:1).cgColor,
                    UIColor(red:0.93, green:0.11, blue:0.14, alpha:1).cgColor
                    ])

self.vwTemp.layer.insertSublayer(gradient, at: 0)
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.