UIView के चारों ओर डैश लाइन

Question

मैं आस-पास की डेश्ड लाइन बॉर्डर को कैसे जोड़ूं UIView।

कुछ इस तरह

Comments

मुझे लगता है कि stackoverflow.com/questions/5431035/… अपना प्रश्न पूछें

— लुइस

DOTTED लाइन के लिए .. stackoverflow.com/q/26018302/294884

— फेटी

lukagabric.com/…

— तरुण सेरा

Answer 1

आप नीचे दिए गए उदाहरणों की तरह लेयर और बेज़ियर पथ का उपयोग करके इस सीमा के साथ सीमा निर्धारित कर सकते हैं।

उद्देश्य सी

CAShapeLayer *yourViewBorder = [CAShapeLayer layer];
yourViewBorder.strokeColor = [UIColor blackColor].CGColor;
yourViewBorder.fillColor = nil;
yourViewBorder.lineDashPattern = @[@2, @2];
yourViewBorder.frame = yourView.bounds;
yourViewBorder.path = [UIBezierPath bezierPathWithRect:yourView.bounds].CGPath;
[yourView.layer addSublayer:yourViewBorder];

स्विफ्ट 3.1

var yourViewBorder = CAShapeLayer()
yourViewBorder.strokeColor = UIColor.black.cgColor
yourViewBorder.lineDashPattern = [2, 2]
yourViewBorder.frame = yourView.bounds
yourViewBorder.fillColor = nil
yourViewBorder.path = UIBezierPath(rect: yourView.bounds).cgPath
yourView.layer.addSublayer(yourViewBorder)

आप नीचे दिए गए उदाहरण जैसे पैटर्न छवि का उपयोग करके विभिन्न प्रकार के डिज़ाइन भी सेट कर सकते हैं।

[yourView.layer setBorderWidth:5.0];
[yourView.layer setBorderColor:[[UIColor colorWithPatternImage:[UIImage imageNamed:@"DotedImage.png"]] CGColor]];///just add image name and create image with dashed or doted drawing and add here

यहां आपको <QuartzCore/QuartzCore>प्रोजेक्ट में फ्रेमवर्क जोड़ना है और इसे YourViewController.mफाइल में नीचे की पंक्ति के साथ आयात करना है ।

#import <QuartzCore/QuartzCore.h>

Comments

iPhone6 ​​प्लस के बारे में बात करते समय यह एक सही तरीका नहीं है। बिंदीदार रेखा धुंधली हो सकती है।

— जैकी

@ जैकी: एक उच्च संकल्प छवि का उपयोग करें। :)

— Olie

छवि का एक उदाहरण क्या है?

— टॉम रोजगारो

क्या आप छवि का एक उदाहरण दे सकते हैं?

— जोंगुओ

Jonguo उदाहरण के लिए, यदि आप उचित रिज़ॉल्यूशन वाली कोई छवि जोड़ते हैं जैसे मान लें कि आपकी सामान्य छवि का आकार 120x120 है और इसका नाम test.png है तो नाम के साथ एक और दो छवि बनाएँ [e-mail] और [e-mail] जिनका आकार 240x240 और 360x360 जो सभी ऐप्पल डिवाइस में उपयोग किया जाता है स्वचालित रूप से संबंधित नाम के साथ। (यानी test.png का उपयोग iPhone 4 में किया जाता है, test @ 2x iPhone 4s, 5, 5s, 6, 6s और twst के लिए उपयोगी होगा @ 3x iPhone 6 प्लस, 6s प्लस के लिए उपयोगी होगा।

— पारस जोशी

Answer 2

एक और तरीका है अगर आप सबलेयर्स को पसंद करते हैं। अपने कस्टम दृश्य के init में, इसे डालें (_border is ivar):

_border = [CAShapeLayer layer];
_border.strokeColor = [UIColor colorWithRed:67/255.0f green:37/255.0f blue:83/255.0f alpha:1].CGColor;
_border.fillColor = nil;
_border.lineDashPattern = @[@4, @2];
[self.layer addSublayer:_border];

और अपने लेआउट साक्षात्कार में, इसे डालें:

_border.path = [UIBezierPath bezierPathWithRect:self.bounds].CGPath;
_border.frame = self.bounds;

Comments

अच्छा! आप एक गोल प्रभाव के लिए कुछ इस तरह का भी उपयोग कर सकते हैं:_border.path = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:5.f].CGPath;

— एवर्टन कुन्हा

माफ़ करना! मुझे नहीं मिला। कोई उदाहरण? @EvertonCunha

— यी जियांग

@VanDuTran पहले स्निपेट में,_border.lineWidth = 3

— क्रिस

हे मैं इस कोड को टेबल व्यू सेल पर लेबल करने के लिए लागू किया था, लेकिन यह सीमा का छोटा आकार देता है कि मैं इसे कैसे सही कर सकता हूं।

— चौधरी अंकित देशवाल

स्विफ्ट 3: border = CAShapeLayer() border.strokeColor = yourColor border.fillColor = nil border.lineDashPattern = [4, 2] self.layer.addSublayer(border)

— गीक 20

Answer 3

आप में से जो लोग स्विफ्ट में काम कर रहे हैं, उनके लिए UIView पर यह क्लास एक्सटेंशन आसान बनाता है। यह सनशाइनडेव के उत्तर पर आधारित था।

extension UIView {
  func addDashedBorder() {
    let color = UIColor.red.cgColor

    let shapeLayer:CAShapeLayer = CAShapeLayer()
    let frameSize = self.frame.size
    let shapeRect = CGRect(x: 0, y: 0, width: frameSize.width, height: frameSize.height)

    shapeLayer.bounds = shapeRect
    shapeLayer.position = CGPoint(x: frameSize.width/2, y: frameSize.height/2)
    shapeLayer.fillColor = UIColor.clear.cgColor
    shapeLayer.strokeColor = color
    shapeLayer.lineWidth = 2
    shapeLayer.lineJoin = CAShapeLayerLineJoin.round
    shapeLayer.lineDashPattern = [6,3]
    shapeLayer.path = UIBezierPath(roundedRect: shapeRect, cornerRadius: 5).cgPath

    self.layer.addSublayer(shapeLayer)
    }
}

इसके प्रयेाग के लिए:

anyView.addDashedBorder()

Comments

कोड के महान टुकड़ा! बस एक मुद्दा, जब मैं इसे UIImageView पर लागू करता हूं तो यह इसकी पूरी चौड़ाई को नहीं पहचानता है, यह इसका लगभग 80% है।

— एरियलक्र

मुझे लगता है कि आप शायद addDashBorder बुला रहे हैं बहुत जल्दी, didLayoutSubviews अंदर बुला की कोशिश

— गॉडफादर

मैंने एक कस्टम UIView बनाया और इस विस्तार को अंदर रखा। तब मैंने सोच के addDashedBorder()दौरान कहा था कि didMoveToSuperview()ऑटोलैयट तब तक पूरा हो जाएगा और फ्रेम का आकार सही होगा लेकिन ऐसा नहीं था। धराशायी सीमा की चौड़ाई दृश्य की चौड़ाई से आगे जाती है। धराशायी लाइन वैसे भी बहुत अच्छी लगती है! self.frame.sizeसही नहीं है।

— लेविबॉस्टियन

self.layer.masksToBounds = सच का उपयोग करें अगर यह सीमा से बाहर चला जाता है

— अंक जैन जैन

@rmooney ने xcellent पर काम किया लेकिन समस्या यह है कि जब आप UITableView डायनेमिक सेल में एक सबलेयर जोड़ते हैं तो लेयर को स्टोरीबोर्ड की परत माना जाता है और यह कस्टमसेल में काम नहीं कर रहा है, यह आकार में भिन्न है यदि आपकी स्टोरीबोर्ड की चौड़ाई 375px है तो इसे हमेशा बॉर्डर माना जाएगा। आकार और यह 414px जैसे बड़े उपकरण में काम नहीं करेगा और इसी तरह।

— अज़हरहुसैन शेख

Answer 4

स्विफ्ट 3 :

import UIKit

class UIViewWithDashedLineBorder: UIView {

    override func draw(_ rect: CGRect) {

        let path = UIBezierPath(roundedRect: rect, cornerRadius: 0)

        UIColor.purple.setFill()
        path.fill()

        UIColor.orange.setStroke()
        path.lineWidth = 5

        let dashPattern : [CGFloat] = [10, 4]
        path.setLineDash(dashPattern, count: 2, phase: 0)
        path.stroke()
    }
}

स्टोरीबोर्ड में उपयोग करें (कस्टम वर्ग के रूप में) या सीधे कोड में:

let v = UIViewWithDashedLineBorder(frame: CGRect(x: 0, y: 0, width: 100, height: 100))

परिणाम:

Comments

आश्चर्य है कि इस पर अधिक upvotes नहीं हैं। यह समाधान अन्य उत्तरों की तुलना में ऑटो-लेआउट के साथ सबसे अच्छा काम करता है।

— युकेन झोंग

Answer 5

प्रसाद जी ने जो सुझाव दिया है, उस पर चलते हुए मैंने एक UIImage Extras वर्ग के अंदर एक विधि बनाई है जिसमें निम्नलिखित हैं:

- (CAShapeLayer *) addDashedBorderWithColor: (CGColorRef) color {
    CAShapeLayer *shapeLayer = [CAShapeLayer layer];

    CGSize frameSize = self.size;

    CGRect shapeRect = CGRectMake(0.0f, 0.0f, frameSize.width, frameSize.height);
    [shapeLayer setBounds:shapeRect];
    [shapeLayer setPosition:CGPointMake( frameSize.width/2,frameSize.height/2)];

    [shapeLayer setFillColor:[[UIColor clearColor] CGColor]];
    [shapeLayer setStrokeColor:color];
    [shapeLayer setLineWidth:5.0f];
    [shapeLayer setLineJoin:kCALineJoinRound];
    [shapeLayer setLineDashPattern:
     [NSArray arrayWithObjects:[NSNumber numberWithInt:10],
      [NSNumber numberWithInt:5],
      nil]];
    UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:shapeRect cornerRadius:15.0];
    [shapeLayer setPath:path.CGPath];

    return shapeLayer;
}

यह इंगित करना महत्वपूर्ण है कि यदि आप अपने आकार की स्थिति को (0,0) के रूप में परिभाषित करते हैं, तो सीमा के निचले कोने को छवि के केंद्र में रखा जाएगा, इसीलिए मैं इसे सेट करता हूं: (फ्रेमसाइज़ / एक्सपोज़र / 2, फ्रेमसाइज़ .height / 2)

फिर मैं अपने UIImageView के UIImage का उपयोग करके धराशायी सीमा प्राप्त करने के लिए अपने तरीके का उपयोग करता हूं और CAShapeLayer को UIImageView परत के उप-परत के रूप में जोड़ता हूं:

[myImageView.layer addSublayer:[myImageView.image addDashedBorderWithColor:[[UIColor whiteColor] CGColor]]];

Answer 6

CGContextSetLineDash () विधि का उपयोग करें।

CGFloat dashPattern[]= {3.0, 2};

context =UIGraphicsGetCurrentContext();
CGContextSetRGBStrokeColor(context, 1.0, 1.0, 1.0, 1.0);
// And draw with a blue fill color
CGContextSetRGBFillColor(context, 0.0, 0.0, 1.0, 1.0);
// Draw them with a 2.0 stroke width so they are a bit more visible.
CGContextSetLineWidth(context, 4.0);
CGContextSetLineDash(context, 0.0, dashPattern, 2);

CGContextAddRect(context, self.bounds);

// Close the path
CGContextClosePath(context);

CGContextStrokePath(context);

// Fill & stroke the path
CGContextDrawPath(context, kCGPathFillStroke);

मुझे लगता है कि यह आपके लिए मददगार होगा।

Comments

यहाँ संदर्भ क्या है?

— अविनाश शर्मा

Answer 7

यहाँ एक UIView उपवर्ग है जो किसी भी परियोजना के लिए काम कर सकता है, इसके लिए भी काम करता है गोल विचारों के :

import UIKit

class CustomDashedView: UIView {

    @IBInspectable var cornerRadius: CGFloat = 0 {
        didSet {
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = cornerRadius > 0
        }
    }
    @IBInspectable var dashWidth: CGFloat = 0
    @IBInspectable var dashColor: UIColor = .clear
    @IBInspectable var dashLength: CGFloat = 0
    @IBInspectable var betweenDashesSpace: CGFloat = 0

    var dashBorder: CAShapeLayer?

    override func layoutSubviews() {
        super.layoutSubviews()
        dashBorder?.removeFromSuperlayer()
        let dashBorder = CAShapeLayer()
        dashBorder.lineWidth = dashWidth
        dashBorder.strokeColor = dashColor.cgColor
        dashBorder.lineDashPattern = [dashLength, betweenDashesSpace] as [NSNumber]
        dashBorder.frame = bounds
        dashBorder.fillColor = nil
        if cornerRadius > 0 {
            dashBorder.path = UIBezierPath(roundedRect: bounds, cornerRadius: cornerRadius).cgPath
        } else {
            dashBorder.path = UIBezierPath(rect: bounds).cgPath
        }
        layer.addSublayer(dashBorder)
        self.dashBorder = dashBorder
    }
}

इस तरह आप स्टोरीबोर्ड से इस तरह से संपादित कर सकते हैं:

परिणामों की एक जोड़ी:

Answer 8

इसके लिए आपको उस विशेष ऑब्जेक्ट के लिए CAShapeLayer जोड़ना होगा

 CAShapeLayer * dotborder = [CAShapeLayer layer];
    dotborder.strokeColor = [UIColor redColor].CGColor;//your own color
    dotborder.fillColor = nil;
    dotborder.lineDashPattern = @[@4, @2];//your own patten 
    [codeBtn.layer addSublayer:dotborder];
    dotborder.path = [UIBezierPath bezierPathWithRect:codeBtn.bounds].CGPath;
    dotborder.frame = codeBtn.bounds;

Answer 9

स्विफ्ट 4.2

UIViewडिफ़ॉल्ट मान सेट करने वाले कॉन्फ़िगरेशन पैरामीटर के साथ एक्सटेंशन के रूप में rmooney के उत्तर के आधार पर ।

ध्यान दें कि अगर दृश्य है तो यह काम नहीं करता है self.translatesAutoresizingMaskIntoConstraints = false

extension UIView {
  func addDashedBorder(_ color: UIColor = UIColor.black, withWidth width: CGFloat = 2, cornerRadius: CGFloat = 5, dashPattern: [NSNumber] = [3,6]) {

    let shapeLayer = CAShapeLayer()

    shapeLayer.bounds = bounds
    shapeLayer.position = CGPoint(x: bounds.width/2, y: bounds.height/2)
    shapeLayer.fillColor = nil
    shapeLayer.strokeColor = color.cgColor
    shapeLayer.lineWidth = width
    shapeLayer.lineJoin = CAShapeLayerLineJoin.round // Updated in swift 4.2
    shapeLayer.lineDashPattern = dashPattern
    shapeLayer.path = UIBezierPath(roundedRect: bounds, cornerRadius: cornerRadius).cgPath

    self.layer.addSublayer(shapeLayer)
  }
}

Comments

shapeLayer.lineJoin = CAShapeLayerLineJoin.roundहोना चाहिएyourViewBorder.lineJoin = kCALineJoinRound

— pw2

Answer 10

क्वार्ट्जकोर जवाब का स्विफ्ट संस्करण।

import QuartzCore    

let dottedPattern = UIImage(named: "dottedPattern")
myView.layer.borderWidth = 1
myView.layer.borderColor = UIColor(patternImage: dottedPattern!).CGColor

CAShapeLayerदृष्टिकोण काम करता है, लेकिन QuartzCore दृष्टिकोण एक तालिका दृश्य पुनः लोड से निपटने, अगर बेहतर हैUIView एक सेल के अंदर है।

छवि के लिए, आप इस तरह से कुछ का उपयोग कर सकते हैं (यह वास्तव में छोटा है):

जब मैं इससे दूर हो सकता हूं तो मैं पीएनजी पर वेक्टर पसंद करना चाहता हूं:

• स्केच के भीतर, एक 4x4 पिक्सेल आयत बनाएँ।
• इनमें से कुल चार बनाओ
• उन्हें एक चौके में बारी-बारी से रंग दें
• समूह को पीडीएफ के रूप में निर्यात करें
• भीतर Images.xcassets, एक New Image SetdottedPattern कहा जाता है
• बदले Scale Factorsके लिएSingle Vector
• अपनी पीडीएफ में ड्रॉप करें

Answer 11

Xamarin.iOS के लिए धराशायी / बिंदीदार सीमा।

        dottedLayer = new CAShapeLayer();
        dottedLayer.StrokeColor = UIColor.FromRGB(202, 202, 208).CGColor; 
        dottedLayer.FillColor = null;
        dottedLayer.LineDashPattern = new[] { new NSNumber(4), new NSNumber(2) };

        dottedLayer.Path = UIBezierPath.FromRect(YourView.Bounds).CGPath; //for square
        dottedLayer.Path = UIBezierPath.FromRoundedRect(YourView.Bounds, 5).CGPath; //for rounded corners

        dottedLayer.Frame = YourView.Bounds;
        YourView.Layer.AddSublayer(dottedLayer);

Comments

कृपया कोड स्निपेट डालने के बजाय अपने उत्तर को थोड़ा विस्तृत करें।

— काबीरबैद्य

भविष्य के पाठकों के लिए ध्यान दें: आपको CAShapeLayer कंस्ट्रक्टर का उपयोग करने के लिए नामस्थान CoreAnimation का उपयोग करना चाहिए।

— jline899

Answer 12

में स्विफ्ट 3

let border = CAShapeLayer();
border.strokeColor = UIColor.black.cgColor;
border.fillColor = nil;
border.lineDashPattern = [4, 4];
border.path = UIBezierPath(rect: theView.bounds).cgPath
border.frame = theView.bounds;
theView.layer.addSublayer(border);

Answer 13

यह है अगर आप इसे स्विफ्ट 2 में चाहते थे

func addDashedLineBorderWithColor(color:UIColor) {
    let _ = self.sublayers?.filter({$0.name == "DashedBorder"}).map({$0.removeFromSuperlayer()})
    let  border = CAShapeLayer();
    border.name = "DashedBorder"
    border.strokeColor = color.CGColor;
    border.fillColor = nil;
    border.lineDashPattern = [4, 4];
    border.path = UIBezierPath(rect: self.bounds).CGPath
    border.frame = self.bounds;
    self.addSublayer(border);

}

Answer 14

बेली कोड का प्रयास करें

- (void)drawRect:(CGRect)rect {
    //// Color Declarations
    UIColor* fillColor = [UIColor colorWithRed: 1 green: 1 blue: 1 alpha: 1];
    UIColor* strokeColor = [UIColor colorWithRed: 0.29 green: 0.565 blue: 0.886 alpha: 1];

    //// Rectangle Drawing
    UIBezierPath* rectanglePath = [UIBezierPath bezierPathWithRoundedRect:rect cornerRadius: 6];
    [fillColor setFill];
    [rectanglePath fill];
    [strokeColor setStroke];
    rectanglePath.lineWidth = 1;
    CGFloat rectanglePattern[] = {6, 2, 6, 2};
    [rectanglePath setLineDash: rectanglePattern count: 4 phase: 0];
    [rectanglePath stroke];
    [super drawRect:rect];
}

एक जैसे बोले के लिए

Comments

कॉर्न्स घुमावदार नहीं हो रहे हैं।

— विवेक त्यागी

Answer 15

स्विफ्ट 5 के लिए

extension UIView {
    func addDashBorder() {
        let color = UIColor.white.cgColor

        let shapeLayer:CAShapeLayer = CAShapeLayer()

        let frameSize = self.frame.size
        let shapeRect = CGRect(x: 0, y: 0, width: frameSize.width, height: frameSize.height)

        shapeLayer.bounds = shapeRect
        shapeLayer.name = "DashBorder"
        shapeLayer.position = CGPoint(x: frameSize.width/2, y: frameSize.height/2)
        shapeLayer.fillColor = UIColor.clear.cgColor
        shapeLayer.strokeColor = color
        shapeLayer.lineWidth = 1.5
        shapeLayer.lineJoin = .round
        shapeLayer.lineDashPattern = [2,4]
        shapeLayer.path = UIBezierPath(roundedRect: shapeRect, cornerRadius: 10).cgPath

        self.layer.masksToBounds = false

        self.layer.addSublayer(shapeLayer)
    }
}

कैसे जोड़ना है

vw.addDashBorder()

सीमा को फिर से कैसे हटाया जाए

let _ = vw.layer.sublayers?.filter({$0.name == "DashBorder"}).map({$0.removeFromSuperlayer()})

Answer 16

मैंने @Chris कार्यान्वयन में से कुछ का उपयोग करके एक आईबी डिज़ाइन बनाने का कार्य समाप्त किया:

CurvedDashedBorderUIVIew.h:

#import <UIKit/UIKit.h>

IB_DESIGNABLE
@interface CurvedDashedBorderUIVIew : UIView

@property (nonatomic) IBInspectable CGFloat cornerRadius;
@property (nonatomic) IBInspectable UIColor *borderColor;
@property (nonatomic) IBInspectable int dashPaintedSize;
@property (nonatomic) IBInspectable int dashUnpaintedSize;

@property (strong, nonatomic) CAShapeLayer *border;

@end

CurvedDashedBorderUIVIew.m:

#import "CurvedDashedBorderUIVIew.h"

@implementation CurvedDashedBorderUIVIew

- (instancetype)init
{
    self = [super init];
    if (self) {
        [self setup];
    }
    return self;
}

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

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

-(void)setup
{
    _border = [CAShapeLayer layer];
    [self.layer addSublayer:_border];
}

-(void)layoutSubviews {
    [super layoutSubviews];
    self.layer.cornerRadius = self.cornerRadius;

    _border.strokeColor = self.borderColor.CGColor;
    _border.fillColor = nil;
    _border.lineDashPattern = @[[NSNumber numberWithInt:_dashPaintedSize],
                                [NSNumber numberWithInt:_dashUnpaintedSize]];
    _border.path = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:self.cornerRadius].CGPath;
    _border.frame = self.bounds;
}

@end

इसके बाद इसे xib / स्टोरीबोर्ड में सेट करें:

Answer 17

कस्टम वर्ग के साथ स्विफ्ट सॉल्यूशन ने ऑटोलेयूट के साथ काम किया

@Iain स्मिथ से अनुकूलित

class DashedBorderView: UIView {

    @IBInspectable var cornerRadius: CGFloat = 4
    @IBInspectable var borderColor: UIColor = UIColor.black
    @IBInspectable var dashPaintedSize: Int = 2
    @IBInspectable var dashUnpaintedSize: Int = 2

    let dashedBorder = CAShapeLayer()

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

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

    private func commonInit() {
        //custom initialization
        self.layer.addSublayer(dashedBorder)
        applyDashBorder()
    }

    override func layoutSublayers(of layer: CALayer) {
        super.layoutSublayers(of: layer)
        applyDashBorder()
    }

    func applyDashBorder() {
        dashedBorder.strokeColor = borderColor.cgColor
        dashedBorder.lineDashPattern = [NSNumber(value: dashPaintedSize), NSNumber(value: dashUnpaintedSize)]
        dashedBorder.fillColor = nil
        dashedBorder.cornerRadius = cornerRadius
        dashedBorder.path = UIBezierPath(rect: self.bounds).cgPath
        dashedBorder.frame = self.bounds
    }
}

Answer 18

आप बस इस तरह एक IBDesignable वर्ग बना सकते हैं:

import UIKit

@IBDesignable
class BorderedView: UIView {

    @IBInspectable var cornerRadius: CGFloat = 0

    @IBInspectable var borderWidth: CGFloat = 0

    @IBInspectable var borderColor: UIColor = UIColor.clear

    override func draw(_ rect: CGRect) {
        let path = UIBezierPath(roundedRect: rect, cornerRadius: cornerRadius)
        path.lineWidth = borderWidth

        borderColor.setStroke()

        let dashPattern : [CGFloat] = [10, 4]
        path.setLineDash(dashPattern, count: 2, phase: 0)
        path.stroke()
    }

}

फिर बस Xcode से BorderedView के साथ अपने विचार को उपवर्गित करें। इस तरह से आप इंटरफ़ेस बिल्डर से बहुत आसानी से बॉर्डर रंग और बॉर्डर चौड़ाई सेट कर सकते हैं!

Answer 19

extension UIView{
func addDashedLineBorder() {
    let color = UIColor.black.cgColor

    let shapeLayer:CAShapeLayer = CAShapeLayer()
    let frameSize = (self.frame.size)
    let shapeRect = CGRect(x: 0, y: 0, width: self.frame.width, height: self.frame.height)

    shapeLayer.bounds = shapeRect
    shapeLayer.position = CGPoint(x: frameSize.width/2, y: frameSize.height/2)
    shapeLayer.fillColor = UIColor.clear.cgColor
    shapeLayer.strokeColor = color
    shapeLayer.lineWidth = 1
    shapeLayer.lineJoin = kCALineJoinRound
    shapeLayer.lineDashPattern = [2,2]
    shapeLayer.path = UIBezierPath(rect: shapeRect).cgPath

    self.layer.addSublayer(shapeLayer)
}

} और इस कार्य को देरी से () में देखें:

DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) { 
            // Your code with delay
            self.YourView.addDashedBorder()
        }

Comments

यह आपके विचार का 100% हिस्सा कवर करेगा।

— आयुष दीक्षित

Answer 20

• स्विफ्ट 5

• ऑटोलाययूट के साथ काम करता है

• कोने त्रिज्या के साथ काम करता है

import UIKit

    class DashedBorderView: UIView {

    private let dashedLineColor = UIColor.black.cgColor
    private let dashedLinePattern: [NSNumber] = [6, 3]
    private let dashedLineWidth: CGFloat = 4

    private let borderLayer = CAShapeLayer()

    init() {
        super.init(frame: CGRect.zero)

        borderLayer.strokeColor = dashedLineColor
        borderLayer.lineDashPattern = dashedLinePattern
        borderLayer.backgroundColor = UIColor.clear.cgColor
        borderLayer.fillColor = UIColor.clear.cgColor
        borderLayer.lineWidth = dashedLineWidth
        layer.addSublayer(borderLayer)
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func draw(_ rect: CGRect) {
        borderLayer.frame = bounds
        borderLayer.path = UIBezierPath(roundedRect: rect, cornerRadius: layer.cornerRadius).cgPath
    }
}

Answer 21

स्विफ्ट 4 में मैंने निम्न फ़ंक्शन के साथ एक यूआईईवीवाई एक्सटेंशन बनाया:

func borderDash(withRadius cornerRadius: Float, borderWidth: Float, borderColor: UIColor, dashSize: Int) {
    let currentFrame = self.bounds
    let shapeLayer = CAShapeLayer()
    let path = CGMutablePath()
    let radius = CGFloat(cornerRadius)

    // Points - Eight points that define the round border. Each border is defined by two points.
    let topLeftPoint = CGPoint(x: radius, y: 0)
    let topRightPoint = CGPoint(x: currentFrame.size.width - radius, y: 0)
    let middleRightTopPoint = CGPoint(x: currentFrame.size.width, y: radius)
    let middleRightBottomPoint = CGPoint(x: currentFrame.size.width, y: currentFrame.size.height - radius)
    let bottomRightPoint = CGPoint(x: currentFrame.size.width - radius, y: currentFrame.size.height)
    let bottomLeftPoint = CGPoint(x: radius, y: currentFrame.size.height)
    let middleLeftBottomPoint = CGPoint(x: 0, y: currentFrame.size.height - radius)
    let middleLeftTopPoint = CGPoint(x: 0, y: radius)

    // Points - Four points that are the center of the corners borders.
    let cornerTopRightCenter = CGPoint(x: currentFrame.size.width - radius, y: radius)
    let cornerBottomRightCenter = CGPoint(x: currentFrame.size.width - radius, y: currentFrame.size.height - radius)
    let cornerBottomLeftCenter = CGPoint(x: radius, y: currentFrame.size.height - radius)
    let cornerTopLeftCenter = CGPoint(x: radius, y: radius)

    // Angles - The corner radius angles.
    let topRightStartAngle = CGFloat(Double.pi * 3 / 2)
    let topRightEndAngle = CGFloat(0)
    let bottomRightStartAngle = CGFloat(0)
    let bottmRightEndAngle = CGFloat(Double.pi / 2)
    let bottomLeftStartAngle = CGFloat(Double.pi / 2)
    let bottomLeftEndAngle = CGFloat(Double.pi)
    let topLeftStartAngle = CGFloat(Double.pi)
    let topLeftEndAngle = CGFloat(Double.pi * 3 / 2)

    // Drawing a border around a view.
    path.move(to: topLeftPoint)
    path.addLine(to: topRightPoint)
    path.addArc(center: cornerTopRightCenter,
                radius: radius,
                startAngle: topRightStartAngle,
                endAngle: topRightEndAngle,
                clockwise: false)
    path.addLine(to: middleRightBottomPoint)
    path.addArc(center: cornerBottomRightCenter,
                radius: radius,
                startAngle: bottomRightStartAngle,
                endAngle: bottmRightEndAngle,
                clockwise: false)
    path.addLine(to: bottomLeftPoint)
    path.addArc(center: cornerBottomLeftCenter,
                radius: radius,
                startAngle: bottomLeftStartAngle,
                endAngle: bottomLeftEndAngle,
                clockwise: false)
    path.addLine(to: middleLeftTopPoint)
    path.addArc(center: cornerTopLeftCenter,
                radius: radius,
                startAngle: topLeftStartAngle,
                endAngle: topLeftEndAngle,
                clockwise: false)

    // Path is set as the shapeLayer object's path.
    shapeLayer.path = path;
    shapeLayer.backgroundColor = UIColor.clear.cgColor
    shapeLayer.frame = currentFrame
    shapeLayer.masksToBounds = false
    shapeLayer.setValue(0, forKey: "isCircle")
    shapeLayer.fillColor = UIColor.clear.cgColor
    shapeLayer.strokeColor = borderColor.cgColor
    shapeLayer.lineWidth = CGFloat(borderWidth)
    shapeLayer.lineDashPattern = [NSNumber(value: dashSize), NSNumber(value: dashSize)]
    shapeLayer.lineCap = kCALineCapRound

    self.layer.addSublayer(shapeLayer)
    self.layer.cornerRadius = radius;
}

Answer 22

यदि आप चाहते हैं कि कोनेरेडियस के साथ काम करें तो यह प्रयास करें

tagView.clipsToBounds = YES;
tagView.layer.cornerRadius = 20.0f;
tagView.backgroundColor = [UIColor groupTableViewBackgroundColor];

CAShapeLayer *yourViewBorder = [CAShapeLayer layer];
yourViewBorder.strokeColor = [UIColor blackColor].CGColor;
yourViewBorder.fillColor = nil;
yourViewBorder.lineDashPattern = @[@2, @2];
yourViewBorder.frame = tagView.bounds;

// Create the path for to make circle
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:tagView.bounds
                                               byRoundingCorners:UIRectCornerAllCorners
                                                     cornerRadii:CGSizeMake(20, 20)];


yourViewBorder.path = maskPath.CGPath;

[tagView.layer addSublayer:yourViewBorder];

Answer 23

स्विफ्ट 5+

import UIKit

class DashedBorderView: UIView {

    private let borderLayer = CAShapeLayer()

    init(color: UIColor, width: CGFloat = 1) {
        super.init(frame: CGRect.zero)

        let pattern: [NSNumber] = [NSNumber(value: Float(5 * width)), NSNumber(value: Float(3 * width))]

        borderLayer.backgroundColor = nil
        borderLayer.fillColor = nil
        borderLayer.lineDashPattern = pattern
        borderLayer.lineWidth = width
        borderLayer.strokeColor = color.cgColor

        layer.addSublayer(borderLayer)
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func draw(_ rect: CGRect) {
        borderLayer.frame = bounds
        borderLayer.path = UIBezierPath(roundedRect: rect, cornerRadius: layer.cornerRadius).cgPath
    }
}

कैसे इस्तेमाल करे:

// f.e. inside UIViewController

let viewWithDashedBorder = DashedBorderView(color: .red, width: 2)
view.addSubview(viewWithDashedBorder)