3

I want to created border dot line of text field of rounded corner. I sucessfully created a border of text field but i have some problem of rounded corner of border textfield.I need textfield of rounded corner with dotted line. Here is my code.

firstName.layer.borderColor =[UIColor clearColor].CGColor;

border = [CAShapeLayer layer];
border.strokeColor = [UIColor blueColor].CGColor;
border.fillColor = nil;
border.lineDashPattern = @[@4, @2];
border.path = [UIBezierPath bezierPathWithRect:firstName.bounds].CGPath;
border.frame = firstName.bounds;

[firstName.layer addSublayer:border];

2 Answers2

1

Following is the solution to remove gray color border of UITextField.

Problem

enter image description here

Solution

enter image description here

For that you need to use following one line of code Just change the border style

_firstName.borderStyle = UITextBorderStyleNone;

CAShapeLayer *border = [CAShapeLayer layer];
border.strokeColor = [UIColor gray].CGColor;
border.fillColor = nil;
border.lineDashPattern = @[@4, @2];
border.path = [UIBezierPath bezierPathWithRect:_firstName.bounds].CGPath;
border.frame = _firstName.bounds;

[_firstName.layer addSublayer:border];

_firstName.borderStyle = UITextBorderStyleNone;

UPDATE

For Rounded corner use following function.

- (void)drawDashedBorderAroundView:(UIView *)v
{
    //border definitions
    CGFloat cornerRadius = 10;
    CGFloat borderWidth = 2;
    NSInteger dashPattern1 = 8;
    NSInteger dashPattern2 = 8;
    UIColor *lineColor = [UIColor orangeColor];

    //drawing
    CGRect frame = v.bounds;

    CAShapeLayer *_shapeLayer = [CAShapeLayer layer];

    //creating a path
    CGMutablePathRef path = CGPathCreateMutable();

    //drawing a border around a view
    CGPathMoveToPoint(path, NULL, 0, frame.size.height - cornerRadius);
    CGPathAddLineToPoint(path, NULL, 0, cornerRadius);
    CGPathAddArc(path, NULL, cornerRadius, cornerRadius, cornerRadius, M_PI, -M_PI_2, NO);
    CGPathAddLineToPoint(path, NULL, frame.size.width - cornerRadius, 0);
    CGPathAddArc(path, NULL, frame.size.width - cornerRadius, cornerRadius, cornerRadius, -M_PI_2, 0, NO);
    CGPathAddLineToPoint(path, NULL, frame.size.width, frame.size.height - cornerRadius);
    CGPathAddArc(path, NULL, frame.size.width - cornerRadius, frame.size.height - cornerRadius, cornerRadius, 0, M_PI_2, NO);
    CGPathAddLineToPoint(path, NULL, cornerRadius, frame.size.height);
    CGPathAddArc(path, NULL, cornerRadius, frame.size.height - cornerRadius, cornerRadius, M_PI_2, M_PI, NO);

    //path is set as the _shapeLayer object's path
    _shapeLayer.path = path;
    CGPathRelease(path);

    _shapeLayer.backgroundColor = [[UIColor clearColor] CGColor];
    _shapeLayer.frame = frame;
    _shapeLayer.masksToBounds = NO;
    [_shapeLayer setValue:[NSNumber numberWithBool:NO] forKey:@"isCircle"];
    _shapeLayer.fillColor = [[UIColor clearColor] CGColor];
    _shapeLayer.strokeColor = [lineColor CGColor];
    _shapeLayer.lineWidth = borderWidth;
    _shapeLayer.lineDashPattern = [NSArray arrayWithObjects:[NSNumber numberWithInt:dashPattern1], [NSNumber numberWithInt:dashPattern2], nil];
    _shapeLayer.lineCap = kCALineCapRound;

    //_shapeLayer is added as a sublayer of the view, the border is visible
    [v.layer addSublayer:_shapeLayer];
    v.layer.cornerRadius = cornerRadius;
}

Call this function using below code.

_firstName.borderStyle = UITextBorderStyleNone;
[self drawDashedBorderAroundView:_firstName];

May this help lot.

Nimit Parekh
  • 16,776
  • 8
  • 50
  • 72
0

Try the below coding

- (void)viewDidLoad 
{
 [super viewDidLoad];
 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];
 [firstName.layer addSublayer:border];
}

-(void)viewDidLayoutSubviews
{
  border.path = [UIBezierPath bezierPathWithRect:firstName.bounds].CGPath;
  border.frame = firstName.bounds;
}

Please have a look at the below sources

UITextField Dotted Border with Rounded Corner

Dotted Line UITextField

Community
  • 1
  • 1
user3182143
  • 9,459
  • 3
  • 32
  • 39