Bordered UITextView

Question

I want to have a thin gray border around a UITextView. I have gone through the Apple documentation but couldn't find any property there. Please help.

Answer 1

#import <QuartzCore/QuartzCore.h>

....

// typically inside of the -(void) viewDidLoad method
self.yourUITextView.layer.borderWidth = 5.0f;
self.yourUITextView.layer.borderColor = [[UIColor grayColor] CGColor];

Answer 2

Add the following for rounded corners:

self.yourUITextview.layer.cornerRadius = 8; 

Answer 3

Here's the code I used, to add a border around my TextView control named "tbComments" :

self.tbComments.layer.borderColor = [[UIColor grayColor] CGColor];
self.tbComments.layer.borderWidth = 1.0;
self.tbComments.layer.cornerRadius = 8;

And here's what it looks like:

Easy peasy.

Answer 4

I add UIImageView as a subview of the UITextView. This matches the native border on a UITextField, including the gradient from top to bottom:

textView.backgroundColor = [UIColor clearColor];
UIImageView *borderView = [[UIImageView alloc] initWithFrame: CGRectMake(0, 0, textView.frame.size.width, textView.frame.size.height)];
borderView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
UIImage *textFieldImage = [[UIImage imageNamed:@"TextField.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(15, 8, 15, 8)];
borderView.image = textFieldImage;
[textField addSubview: borderView];
[textField sendSubviewToBack: borderView];

These are the png images I use, and a jpg representation:

@1x

@2x

Answer 5

Works great, but the color should be a CGColor, not UIColor:

view.layer.borderWidth = 5.0f;
view.layer.borderColor = [[UIColor grayColor] CGColor];

Answer 6

I believe the above answers are for the previous versions of Swift. I Googled a bit and the below code works for Swift 4. Just sharing it for whoever it may benefit.

self.textViewName.layer.borderColor = UIColor.lightGray.cgColor
self.textViewName.layer.borderWidth = 1.0
self.textViewName.layer.cornerRadius = 8

Happy Coding!

Answer 7

for Swift Programming, use this

tv_comment.layer.borderWidth = 2
tv_comment.layer.borderColor = UIColor(red: 0.2, green: 0.2, blue: 0.2, alpha: 1).CGColor

Answer 8

this is as close as I could from an original UITextField

func updateBodyTextViewUI() {
    let borderColor = UIColor.init(red: 212/255, green: 212/255, blue: 212/255, alpha: 0.5)

    self.bodyTextView.layer.borderColor = borderColor.CGColor
    self.bodyTextView.layer.borderWidth = 0.8
    self.bodyTextView.layer.cornerRadius = 5
}

Answer 9

you can add border to UITextView from the Storyboard - Identity Inspector - User Defined Runtime Attribute

Answer 10

As of iOS 8 and Xcode 6, I now find the best solution is to subclass UITextView and mark the subclass as an IB_DESIGNABLE, which will allow you to view the border in storyboard.

Header:

#import <UIKit/UIKit.h>

IB_DESIGNABLE

@interface BorderTextView : UITextView

@end

Implementation:

#import "BorderTextView.h"

@implementation BorderTextView

- (void)drawRect:(CGRect)rect
{
    self.layer.borderWidth = 1.0;
    self.layer.borderColor = [UIColor blackColor].CGColor;
    self.layer.cornerRadius = 5.0f;
}

@end

Then just drag out your UITextView in storyboard and set its class to BorderTextView

Answer 11

The thing that made it work (in addition to following the answers here) is adding the borderStyle attribute:

#import <QuartzCore/QuartzCore.h>
..

phoneTextField.layer.borderWidth = 1.0f;
phoneTextField.layer.borderColor = [[UIColor blueColor] CGColor];
phoneTextField.borderStyle = UITextBorderStyleNone;

Answer 12

Just a small addition. If you make the border a bit wider, it will interfere with the left and right side of text. To avoid that, I added the following line:

self.someTextView.textContainerInset = UIEdgeInsetsMake(8.0, 8.0, 8.0, 8.0);

Answer 13

In Swift 3, you may use the following two lines:

myText.layer.borderColor = UIColor.lightGray.cgColor

myText.layer.borderWidth = 1.0

Answer 14

An elegant solution would be to insert a real UITextField on the bottom and prevent it to scroll with the content. This way you have even the correct dark mode borders.

class BorderedTextView: UITextView {

  let textField = UITextField()

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

  override init(frame: CGRect, textContainer: NSTextContainer?) {
    super.init(frame: frame, textContainer: textContainer)
    insertTextField()
  }

  convenience init() {
    self.init(frame: .zero, textContainer: nil)
  }

  private func insertTextField() {
    delegate = self
    textField.borderStyle = .roundedRect
    insertSubview(textField, at: 0)
  }

  override func layoutSubviews() {
    super.layoutSubviews()
    textField.frame = bounds
  }
}

extension BorderedTextView: UITextViewDelegate {

  func scrollViewDidScroll(_ scrollView: UIScrollView) {
    textField.frame = bounds
  }
}

Answer 15

I solved this problem in storyboard by putting a fully disabled UIButton behind the UITextView and making the background color of the UITextView clearColor. This works without requiring extra code or packages.