কোকো টাচ: ইউআইভিউ'র সীমানার রঙ এবং ঘনত্ব কীভাবে পরিবর্তন করবেন?


275

আমি পরিদর্শকের মধ্যে দেখেছি যে আমি পটভূমির রঙ পরিবর্তন করতে পারি, তবে আমি সীমান্তের রঙ এবং ঘনত্বও পরিবর্তন করতে চাই, এটি কি সম্ভব?


উত্তর:


596

সীমানা সম্পত্তি সেট করতে আপনাকে ভিউয়ের স্তরটি ব্যবহার করতে হবে। উদাহরণ:

#import <QuartzCore/QuartzCore.h>
...
view.layer.borderColor = [UIColor redColor].CGColor;
view.layer.borderWidth = 3.0f;

এই কার্যকারিতাটি অ্যাক্সেস করতে আপনার কোয়ার্টজকোর.ফ্রেমওয়ার্কের সাথেও লিঙ্ক করতে হবে।


প্রতিটি পক্ষের জন্য আলাদা প্রস্থ / রঙ সেট করার কোনও উপায় আছে কি?
ল্যুইওমসনটারো

2
@ ললিওসোনটারো আমি ভীতাম আপনাকে ড্রআরেক্ট দিয়ে কাস্টম ইউআইভিউ তৈরি করতে হবে: এর জন্য পদ্ধতি
ভ্লাদিমির

1
যদি আমি এটি করি এবং এই দৃশ্যের শীর্ষে আমার কাছে একটি অ্যানিমেশন রয়েছে, যেমন একটি মডেল ইউআইএনএভিগেশন কন্ট্রোলারকে বরখাস্ত করা হচ্ছে, আমি অনেকগুলি বিভ্রান্তি দেখতে পাচ্ছি, এটি বর্ণনা করা শক্ত। যদি আমি সীমানাগুলি নিষ্ক্রিয় করি, তবে সমস্ত কিছু স্বাভাবিক হয়ে যায়।
নিকু সুরডু

5
অন্যদের জন্য একটি মাথা আপ। এক্সকোড ইউজিকালার ব্রিজ করার পরামর্শ দেয় সিজি কালারআরফ হিসাবে __bridge CGColorRef। এটা কাজ করে না. এটা তোলে হওয়া প্রয়োজন [UIColor blackColor].CGColorযেমন উত্তর উল্লেখ করেছে।
গুডএসপিএনডি 3

6
#import <QuartzCore/QuartzCore.h>আর দরকার নেই।
অর্থ-বিষয়গুলি

43

এক্সকোড 6 আপডেট

এক্সকোডের নতুন সংস্করণ যেহেতু এর আরও ভাল সমাধান আছে:

সঙ্গে @IBInspectableআপনি গুণাবলী থেকে সরাসরি সেট করতে পারেন মধ্যেAttributes Inspector

আমার কাস্টম ভিউ @ আইবিআই স্পেসিফিক বৈশিষ্ট্যগুলি

এটি আপনার User Defined Runtime Attributesজন্য সেট করে :

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

এটি সেট আপ করার জন্য দুটি পন্থা রয়েছে:

বিকল্প 1 (স্টোরিবোর্ডে লাইভ আপডেটিং সহ)

  1. তৈরি করুন MyCustomView
  2. এটি উত্তরাধিকার সূত্রে প্রাপ্ত UIView
  3. সেট করুন @IBDesignable(এটি ভিউ আপডেটটিকে লাইভ করে) *
  4. আপনার রানটাইম বৈশিষ্ট্য (সীমান্ত, ইত্যাদি) এর সাথে সেট করুন @IBInspectable
  5. আপনার ভিউ ক্লাসে পরিবর্তন করুন MyCustomView
  6. বৈশিষ্ট্য প্যানেলে সম্পাদনা করুন এবং স্টোরিবোর্ডে পরিবর্তনগুলি দেখুন :)

`

@IBDesignable
class MyCustomView: UIView {
    @IBInspectable var cornerRadius: CGFloat = 0 {
        didSet {
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = cornerRadius > 0
        }
    }
    @IBInspectable var borderWidth: CGFloat = 0 {
        didSet {
            layer.borderWidth = borderWidth
        }
    }
    @IBInspectable var borderColor: UIColor? {
        didSet {
            layer.borderColor = borderColor?.CGColor
        }
    }
}

* @IBDesignableশুধুমাত্র যখন শুরুতে সেট করা হয় তখন কাজ করেclass MyCustomView

বিকল্প 2 (সুইফট 1.2 থেকে কাজ করছে না, মন্তব্য দেখুন)

আপনার ইউআইভিউ ক্লাসটি প্রসারিত করুন:

extension UIView {
    @IBInspectable var cornerRadius: CGFloat = 0 {
        didSet {
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = cornerRadius > 0
        }
    }
    @IBInspectable var borderWidth: CGFloat = 0 {
        didSet {
            layer.borderWidth = borderWidth
        }
    }
    @IBInspectable var borderColor: UIColor? {
        didSet {
            layer.borderColor = borderColor?.CGColor
        }
    }
}

এইভাবে, আপনার ডিফল্ট ভিউটিতে সর্বদা সেই অতিরিক্ত সম্পাদনযোগ্য ক্ষেত্র থাকে Attributes Inspector। আরেকটি সুবিধা হ'ল আপনাকে MycustomViewপ্রতিবার ক্লাস পরিবর্তন করতে হবে না । যাইহোক, এটির একটি অসুবিধা হ'ল আপনি যখন নিজের অ্যাপটি চালাবেন কেবল তখনই আপনার পরিবর্তনগুলি দেখতে পাবেন।


1
আপনার এক্সটেনশানটি আজকের মতো এক্সকোডের সর্বশেষতম সংস্করণে কাজ করে না।
এডগার আরুটিউনিয়ান

1
আমি কেবলমাত্র অ্যাডগারআরটিউইয়ানিয়ানকেই নিশ্চিত করতে পারব যে সুইফট ১.২ এ দ্বিতীয় পদ্ধতিটি আর কাজ করে না
সের্গে গ্রিসচিয়েভ

উদ্দেশ্য-সি সম্পর্কে কী?
নিক কোভ

পরীক্ষা করে দেখুন spencery2 এর উত্তর : আরও নিচে, সে সময় উদ্দেশ্য সি এটা লিখতে নেন
MMachinegun

কোনও মান সংরক্ষণ না করে এক্সটেনশনটি আপডেট করুন এবং সেট (মান) {। ব্যবহার করুন এবং স্তরটি সরাসরি অ্যাক্সেস করতে get get পান, এটি তখন কাজ করে।
LightningStryk

17

আপনি নিজের ইচ্ছার রঙের সাথে সীমানাও তৈরি করতে পারেন ..

view.layer.borderColor = [UIColor colorWithRed:r/255.0 green:g/255.0 blue:b/255.0 alpha:1.0].CGColor;

* r, g, b হল 0 থেকে 255 এর মধ্যে মান।


6
এটি লক্ষণীয় r, gএবং bসম্ভবত ভাসমান হওয়া উচিত; ভাজক এছাড়াও ভাসে হওয়া উচিত: r / 255.0

না, সি সিনট্যাক্স আপনি যেমন বলেছেন তেমন নয়। r, g এবং b int হতে পারে, যেহেতু সি (এবং অবজেক্ট আইএস সি) পদোন্নতিগুলি যখন r = 128 করার সময় দ্বিগুণ হবে: r / 255.0। যাইহোক আপনি দ্বিগুণ হয়ে গেছেন, এবং কলং সিজিফ্লোয়েটে কাস্ট করবে।
ingconti

10

ইউআইভিউ এক্সটেনশনে নিম্নলিখিত আইবিআই স্পেসটেবলগুলি যুক্ত করুন

extension UIView {

  @IBInspectable var borderWidth: CGFloat {
    get {
      return layer.borderWidth
    }
    set(newValue) {
      layer.borderWidth = newValue
    }
  }

  @IBInspectable var borderColor: UIColor? {
    get {
      if let color = layer.borderColor {
        return UIColor(CGColor: color)
      }
      return nil
    }
    set(newValue) {
      layer.borderColor = newValue?.CGColor
    }
  }
}

এবং তারপরে আপনার অ্যাট্রিবিউট ইন্সপেক্টর থেকে সরাসরি বর্ডার কালার এবং বর্ডারউইথ অ্যাট্রিবিউট সেট করতে সক্ষম হওয়া উচিত। সংযুক্ত চিত্র দেখুন

বৈশিষ্ট্য পরিদর্শক


8

আমি যখন ভ্লাদিমিরের ক্যালিয়ার দ্রবণটি ব্যবহার করি এবং উপরে আমার কাছে একটি অ্যানিমেশন থাকে যেমন একটি মডেল ইউআইএনএভিগেশন কন্ট্রোলারকে বরখাস্ত করা হয়, আমি প্রচুর বিভ্রান্তি ঘটতে দেখি এবং অঙ্কনের পারফরম্যান্সের সমস্যা রয়েছে।

সুতরাং, এটি অর্জনের আরেকটি উপায়, তবে গ্লিটস এবং পারফরম্যান্স ক্ষতি না ছাড়াই একটি কাস্টম ইউআইভিউ তৈরি করা এবং drawRectবার্তাটি এভাবে প্রয়োগ করা :

- (void)drawRect:(CGRect)rect
{
    CGContextRef contextRef = UIGraphicsGetCurrentContext();
    CGContextSetLineWidth(contextRef, 1);
    CGContextSetRGBStrokeColor(contextRef, 255.0, 255.0, 255.0, 1.0);
    CGContextStrokeRect(contextRef, rect);    
}

@ কৃষ্শ আপনি রঙটি একটি চলকতে সঞ্চয় করেন এবং যখন আপনার সীমানার রঙ পরিবর্তন করার দরকার হয় তখন আপনি ভেরিয়েবলের মান পরিবর্তন করেন setNeedsDisplayএবং ভিউতে কল করুন। এটি ইউআইভিউর পুনর্নির্মাণকে বাধ্য করবে এবং সুস্পষ্টভাবে পুনরায় কল করবে drawRect। পরীক্ষা করা হয়নি, তবে ...
নিকু সুরডু



4

পারফরম্যান্স হিট হওয়ার কারণে আমি ড্রয়ারকে ওভাররাইড করার পরামর্শ দেব না।

পরিবর্তে, আমি নীচের মতো শ্রেণীর বৈশিষ্ট্যগুলি সংশোধন করব (আপনার কাস্টম ইউভিউতে):

  - (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
      self.layer.borderWidth = 2.f;
      self.layer.borderColor = [UIColor redColor].CGColor;
    }
  return self;

উপরোক্ত পদ্ধতির গ্রহণ করার সময় আমি কোনও ত্রুটি দেখতে পেলাম না - কেন নিশ্চিত নয় যে দীক্ষাথ্রে ফ্রেম লাগানো এইগুলি বন্ধ করে দেয় ;-)


3

আমি এটি একটি মন্তব্য হিসাবে @ মার্কজিংয়ের উত্তরে ( বিকল্প 1 ) যুক্ত করতে চেয়েছিলাম, তবে স্ট্যাকওভারফ্লোতে আমার ন্যূনতম অবস্থানটি এটি প্রতিরোধ করছে।

অবজেক্টিভ সিতে @ মার্কজিংয়ের জবাবের একটি বন্দর আমি করলাম মনোযোগের মতো কাজ করে, ধন্যবাদ @ মার্কজিং!

UIView + + Border.h:

#import <UIKit/UIKit.h>

IB_DESIGNABLE
@interface UIView (Border)

-(void)setBorderColor:(UIColor *)color;
-(void)setBorderWidth:(CGFloat)width;
-(void)setCornerRadius:(CGFloat)radius;

@end

UIView + + Border.m:

#import "UIView+Border.h"

@implementation UIView (Border)
// Note: cannot use synthesize in a Category

-(void)setBorderColor:(UIColor *)color
{
    self.layer.borderColor = color.CGColor;
}

-(void)setBorderWidth:(CGFloat)width
{
    self.layer.borderWidth = width;
}

-(void)setCornerRadius:(CGFloat)radius
{
    self.layer.cornerRadius = radius;
    self.layer.masksToBounds = radius > 0;
}

@end

2

@ আইবিআইএনস্পেক্টেবল আইওএস 9, সুইফট 2.0 তে আমার জন্য কাজ করছে

extension UIView {

@IBInspectable var borderWidth: CGFloat {
get {
        return layer.borderWidth
    }
    set(newValue) {
        layer.borderWidth = newValue
    }
}

@IBInspectable var cornerRadius: CGFloat {
    get {
        return layer.cornerRadius
    }
    set(newValue) {
        layer.cornerRadius = newValue
    }
}

@IBInspectable var borderColor: UIColor? {
    get {
        if let color = layer.borderColor {
            return UIColor(CGColor: color)
        }
        return nil
    }
    set(newValue) {
        layer.borderColor = newValue?.CGColor
    }
}

1

আপনি যদি কোনও ইউআইভিউর স্তরটি সম্পাদনা করতে না চান তবে আপনি সর্বদা অন্য দৃশ্যের মধ্যে ভিউ এম্বেড করতে পারেন। প্যারেন্ট ভিউটির সীমানা রঙে এর পটভূমি রঙ সেট করা থাকবে। আপনি সীমানাটি কত প্রশস্ত করতে চান তার উপর নির্ভর করে এটি কিছুটা বড়ও হবে।

অবশ্যই, এটি কেবল তখনই কার্যকর হয় যদি আপনার দৃষ্টিভঙ্গি স্বচ্ছ না হয় এবং আপনি কেবল একটি একক সীমানা রঙ চান। ওপি নিজেই ভিউটিতে সীমানা চেয়েছিল, তবে এটি একটি কার্যকর বিকল্প হতে পারে।


0

আপনি যদি বিভিন্ন দিকে বিভিন্ন সীমানা যুক্ত করতে চান তবে নির্দিষ্ট স্টাইলের সাথে একটি সাবউভি যুক্ত করা সহজ উপায় হ'ল সহজ উপায়।


0

দ্রুত 4.2 আইটেমের সীমানার রঙ:

let cell = tableView.dequeueReusableCell(withIdentifier: "Cell_lastOrderId") as! Cell_lastOrder
cell.layer.borderWidth = 1
cell.layer.borderColor = UIColor.white.cgColor
cell.layer.cornerRadius = 10
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.