I have really great wish to set my own color to UITextField border. But so far I could find out how to change the border line style only.
I've used background property to set background color in such way:
self.textField.backgroundColor = textFieldColor;
But I have to change color of UITextField border too. And my question was about how to change the border color.
This question is related to
ios
colors
uikit
uitextfield
border
To simplify this actions from accepted answer, you can also create Category for UIView
(since this works for all subclasses of UIView, not only for textfields:
UIView+Additions.h:
#import <Foundation/Foundation.h>
@interface UIView (Additions)
- (void)setBorderForColor:(UIColor *)color
width:(float)width
radius:(float)radius;
@end
UIView+Additions.m:
#import "UIView+Additions.h"
@implementation UIView (Additions)
- (void)setBorderForColor:(UIColor *)color
width:(float)width
radius:(float)radius
{
self.layer.cornerRadius = radius;
self.layer.masksToBounds = YES;
self.layer.borderColor = [color CGColor];
self.layer.borderWidth = width;
}
@end
Usage:
#import "UIView+Additions.h"
//...
[textField setBorderForColor:[UIColor redColor]
width:1.0f
radius:8.0f];
Here's a Swift implementation. You can make an extension so that it will be usable by other views if you like.
extension UIView {
func addBorderAndColor(color: UIColor, width: CGFloat, corner_radius: CGFloat = 0, clipsToBounds: Bool = false) {
self.layer.borderWidth = width
self.layer.borderColor = color.cgColor
self.layer.cornerRadius = corner_radius
self.clipsToBounds = clipsToBounds
}
}
Call this like:
email.addBorderAndColor(color: UIColor.white, width: 0.5, corner_radius: 5, clipsToBounds: true)
.
Update for swift 5.0
textField.layer.masksToBounds = true
textField.layer.borderColor = UIColor.blue.cgColor
textField.layer.borderWidth = 1.0
Try this:
UITextField *theTextFiels=[[UITextField alloc]initWithFrame:CGRectMake(40, 40, 150, 30)];
theTextFiels.borderStyle=UITextBorderStyleNone;
theTextFiels.layer.cornerRadius=8.0f;
theTextFiels.layer.masksToBounds=YES;
theTextFiels.backgroundColor=[UIColor redColor];
theTextFiels.layer.borderColor=[[UIColor blackColor]CGColor];
theTextFiels.layer.borderWidth= 1.0f;
[self.view addSubview:theTextFiels];
[theTextFiels release];
and import QuartzCore:
#import <QuartzCore/QuartzCore.h>
If you use a TextField with rounded corners use this code:
self.TextField.layer.cornerRadius=8.0f;
self.TextField.layer.masksToBounds=YES;
self.TextField.layer.borderColor=[[UIColor redColor]CGColor];
self.TextField.layer.borderWidth= 1.0f;
To remove the border:
self.TextField.layer.masksToBounds=NO;
self.TextField.layer.borderColor=[[UIColor clearColor]CGColor];
borderColor on any view(or UIView Subclass) could also be set using storyboard with a little bit of coding and this approach could be really handy if you're setting border color on multiple UI Objects.
Below are the steps how to achieve it,
P.S: Remember, Categories can't have stored properties. 'borderUIColor' is used as a calculated property, just as a reference to achieve what we're focusing on.
Please have a look at the below code sample;
Objective C:
Interface File:
#import <QuartzCore/QuartzCore.h>
#import <UIKit/UIKit.h>
@interface CALayer (BorderProperties)
// This assigns a CGColor to borderColor.
@property (nonatomic, assign) UIColor* borderUIColor;
@end
Implementation File:
#import "CALayer+BorderProperties.h"
@implementation CALayer (BorderProperties)
- (void)setBorderUIColor:(UIColor *)color {
self.borderColor = color.CGColor;
}
- (UIColor *)borderUIColor {
return [UIColor colorWithCGColor:self.borderColor];
}
@end
Swift 2.0:
extension CALayer {
var borderUIColor: UIColor {
set {
self.borderColor = newValue.CGColor
}
get {
return UIColor(CGColor: self.borderColor!)
}
}
}
And finally go to your storyboard/XIB, follow the remaining steps;
You've to set layer.borderWidth property value to at least 1 to see the border color.
Build and Run. Happy Coding. :)
Import the following class:
#import <QuartzCore/QuartzCore.h>
//Code for setting the grey color for the border of the text field
[[textField layer] setBorderColor:[[UIColor colorWithRed:171.0/255.0
green:171.0/255.0
blue:171.0/255.0
alpha:1.0] CGColor]];
Replace 171.0
with the respective color number as required.
this question shows up pretty high on a Google search and worked for the most part! I did find that Salman Zaidi's answer was partially correct for iOS 7.
You need to make a modification to the "reverting" code. I found that the following for reverting worked perfectly:
textField.layer.cornerRadius = 0.0f;
textField.layer.masksToBounds = YES;
textField.layer.borderColor = [[UIColor blackColor] CGColor];
textField.layer.borderWidth = 0.0f;
I understand that this is most likely due to changes in iOS 7.
Import QuartzCore
framework in you class:
#import <QuartzCore/QuartzCore.h>
and for changing the border color use the following code snippet (I'm setting it to redColor),
textField.layer.cornerRadius=8.0f;
textField.layer.masksToBounds=YES;
textField.layer.borderColor=[[UIColor redColor]CGColor];
textField.layer.borderWidth= 1.0f;
For reverting back to the original layout just set border color to clear color,
serverField.layer.borderColor=[[UIColor clearColor]CGColor];
in swift code
textField.layer.borderWidth = 1
textField.layer.borderColor = UIColor.whiteColor().CGColor
Source: Stackoverflow.com