ইউআইভিউয়ের চারপাশে ড্যাশড লাইন বর্ডার

Question

আমি কীভাবে চারদিকে ড্যাশযুক্ত লাইন বর্ডার যুক্ত করব UIView।

এটার মতো কিছু

Comments

আমি মনে করি যে স্ট্যাকওভারফ্লো / প্রশ্নগুলি

— লুইস

একটি ডটেড লাইন জন্য .. stackoverflow.com/q/26018302/294884

— Fattie

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];

সুইফট ৩.১

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

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

— জ্যাকি

@ জ্যাকি: একটি উচ্চতর রেজোলিউশন চিত্র ব্যবহার করুন। :)

— অলি

ছবিটির উদাহরণ কী?

— টম রোগেরো

আপনি কি চিত্রটির উদাহরণ দিতে পারেন?

— Jonguo

জঙ্গুও উদাহরণস্বরূপ, আপনি যদি যথাযথ রেজোলিউশনের মতো কোনও চিত্র যুক্ত করেন তবে ধরুন আপনার সাধারণ চিত্রের আকার 120x120 এবং এটির নাম test.png তবে 240x240 আকারের টেস্ট@2x.png এবং [e-mail] নামে আরও দুটি চিত্র তৈরি করুন and 360x360 যা সম্পর্কিত সম্পর্কিত নামের সাথে সমস্ত অ্যাপল ডিভাইসে স্বয়ংক্রিয়ভাবে ব্যবহৃত হয়। (অর্থাত test.png আইফোন 4-এ ব্যবহারের হয়, পরীক্ষা @ 2x হবে আইফোন 4S, 5, 5s, 6, 6s জন্য দরকারী এবং twst @ 3x হবে প্লাস আইফোন 6 প্লাস, 6s জন্য দরকারী।

— পরশ জোশী

Answer 2

আরেকটি পদ্ধতি যদি আপনি সাবলেয়ারগুলি পছন্দ করেন। আপনার কাস্টম ভিউ'র দীক্ষায় এটি রাখুন (_ সীমান্তটি একটি আইভার):

_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;

— এভারটন কুনহা

দুঃখিত! আমি পাই না। কোন উদাহরণ? @ এভারটনকুনহা

— ই জিয়াং

@ ভানডুট্রান প্রথম স্নিপেটে_border.lineWidth = 3

— ক্রিস

আরে আমি এই কোডটি টেবিল ভিউ সেলটিতে লেবেলে প্রয়োগ করেছি তবে এটি ছোট আকারের সীমানা দেয় যে আমি কীভাবে এটি সংশোধন করতে পারি।

— চৌধুরী চৌধুরী অঙ্কিত দেশওয়াল

সুইফট 3: border = CAShapeLayer() border.strokeColor = yourColor border.fillColor = nil border.lineDashPattern = [4, 2] self.layer.addSublayer(border)

— গিগ 20

Answer 3

আপনারা যারা সুইফটে কাজ করছেন, তাদের জন্য ইউআইভিউতে এই শ্রেণীর বর্ধন সহজ করে তোলে। এটি সানশাইনদেবের উত্তরের উপর ভিত্তি করে তৈরি হয়েছিল।

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

দুর্দান্ত টুকরো কোড! একটি মাত্র ইস্যু, যখন আমি এটি কোনও ইউআইআইভিউভিউতে প্রয়োগ করি তবে এটি এর সম্পূর্ণ প্রস্থাকে স্বীকৃতি দেয় না, এটি এর প্রায় ৮০% হয়ে যায়।

— arielcr

আমি মনে করি আপনি সম্ভবত অ্যাডড্যাশবার্ডারটিকে খুব তাড়াতাড়ি কল করছেন, এটিকে ডায়ালআউটসউভভিউস

— গডফাদার

আমি একটি কাস্টম ইউআইভিউ তৈরি করেছি এবং এই এক্সটেনশনটি ভিতরে রেখেছি। তারপর আমি নামক addDashedBorder()সময় didMoveToSuperview()চিন্তা স্বয়ংক্রিয়-বহির্বিন্যাস তারপর সম্পূর্ণ হবে এবং ফ্রেম আকার সঠিক হবে কিন্তু এটি ছিল না। ড্যাশযুক্ত সীমানার প্রস্থ ভিউটির প্রস্থের বাইরে beyond ড্যাশড লাইনটি এত সুন্দর দেখাচ্ছে! self.frame.sizeসঠিক নয়।

— লেবিবোস্টিয়ান

self.layer.masksToBounds = সত্য সীমানার বাইরে চলে গেলে এটি ব্যবহার করুন

— অঙ্কিত জৈন

@ আরমুনি একসিল্যান্ট কাজ করেছেন তবে সমস্যাটি যখন আপনি স্ট্রিটবোর্ডের স্তর হিসাবে বিবেচিত স্তরটিকে কোনও ইউআইটিএবলভিউ গতিশীল কক্ষে সাবলেয়ার যুক্ত করেন এবং এটি কোনও কাস্টমসেলের সাথে কাজ করে না তবে আপনার স্টোরিবোর্ডের প্রস্থ ৩5৫ পিক্সেল যদি এটি সর্বদা সীমানাকে বিবেচনা করে তবে আকারটি আলাদা হবে আকার এবং এটি 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

আশ্চর্য হোন যে এটিতে আরও বেশি কিছু নেই। এই উত্তরটি অন্যান্য উত্তরের সাথে তুলনা করে অটো-লেআউট দিয়ে সবচেয়ে ভাল কাজ করে।

— ইউচেন ঝং

Answer 5

প্রসাদ জি যা পরামর্শ দিয়েছেন তার উপর ভিত্তি করে আমি নিম্নলিখিতটি দিয়ে একটি ইউআইআইজেজ এক্সট্রা ক্লাসের মধ্যে একটি পদ্ধতি তৈরি করেছি:

- (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) হিসাবে সংজ্ঞায়িত করেন তবে সীমানার নীচের কোণটি চিত্রের কেন্দ্রে স্থাপন করা হবে, সে কারণেই আমি এটিকে সেট করেছি: (ফ্রেমসাইজ.উইথথ / ২, ফ্রেমসাইজ .height / 2)

তারপরে আমি আমার ইউআইআইমেজভিউয়ের ইউআইআইএমজি ব্যবহার করে ড্যাশযুক্ত সীমানা পেতে আমার পদ্ধতিটি ব্যবহার করি এবং ক্যাশিপলায়ারকে ইউআইআইমেজভিউ স্তরের সাবলেয়ার হিসাবে যুক্ত করব:

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

Answer 6

সিজি কনটেক্সটসেটলাইনড্যাশ () পদ্ধতিটি ব্যবহার করুন।

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

এখানে একটি ইউআইভিউ সাবক্লাস যা কোনও প্রকল্পের জন্য কাজ করতে পারে, এটি রাউন্ড ভিউয়ের জন্যও কাজ করে :

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 Setডটেডপ্যাটার্ন তৈরি করুন
• পরিবর্তন 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 কনস্ট্রাক্টর ব্যবহার করার জন্য আপনাকে অবশ্যই নাম স্পেস কোরএ্যানিমেশন ব্যবহার করতে হবে।

— jnel899

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

আমি @ ক্রিস কিছু বাস্তবায়ন ব্যবহার করে আইবি ডিজাইনেবল তৈরি শেষ করেছি:

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

কাস্টম ক্লাসের সাথে স্যুইফ্ট সলিউশন অটোলেআউট নিয়ে কাজ করেছে

@ আইইন স্মিথ থেকে কাস্টমাইজড

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

আপনি কেবল এই জাতীয় আইবি ডিজাইনযোগ্য ক্লাস তৈরি করতে পারেন:

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()
    }

}

তারপরে আপনার কোডটি এক্সকোড থেকে বর্ডারভিউয়ের সাথে সাবক্লাস করুন। এইভাবে আপনি ইন্টারফেস বিল্ডারের কাছ থেকে খুব সহজেই সীমানা রঙ এবং সীমানা প্রস্থ সেট করতে পারেন!

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

Ift সুইফট 5

Auto অটোলেআউট নিয়ে কাজ করে

The কোণার ব্যাসার্ধের সাথে কাজ করে

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

আপনি যদি এটি কোণার রেডিওতে কাজ করতে চান তবে এটি চেষ্টা করুন try

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)