Bordered UITextView


127

Chcę mieć cienką szarą ramkę wokół pliku UITextView. Przejrzałem dokumentację Apple, ale nie mogłem znaleźć tam żadnej własności. Proszę pomóż.

Odpowiedzi:


306
#import <QuartzCore/QuartzCore.h>

....

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

62
Nie sądziłem, że to naprawdę wymagało wiele wyjaśnień, widok to UITextView, a kod idzie wszędzie tam, gdzie ustawisz widok (awakeFromNib lub viewDidLoad to dwa możliwe miejsca). Ponieważ nie podano kodu, nie ma możliwości podania dobrego kontekstu w odpowiedzi.
Kendall Helmstetter Gelner

XCode nie pozwala mi ustawić obramowania dla warstwy. Mówi, że warstwa jest tylko do odczytu. Zrobiłem UIView (gdzie umieściłem kilka elementów) i próbowałem ustawić obramowanie na ten widok. Próbuję to zrobić self.myView.layer.borderWidth ..., ale jak powiedziałem, warstwa jest tylko do odczytu, więc warstwa nie ma żadnych metod ani zmiennych do ustawienia
Paulius Vindzigelskis

2
Czy zaimportowałeś QuartzCore? Możesz także spróbować pobrać CALayer z self.myView i ustawić na nim borderWidth. Można to ustawić.
Kendall Helmstetter Gelner

Więcej informacji o „warstwie” jako tylko do odczytu w UIView (właściwość warstwy to, ale można ustawić wartości w warstwie dla widoku): stackoverflow.com/questions/12837077/…
Kendall Helmstetter Gelner

42

Dodaj następujące informacje dla zaokrąglonych rogów:

self.yourUITextview.layer.cornerRadius = 8; 

23

Oto kod, którego użyłem, aby dodać obramowanie wokół mojej TextViewkontrolki o nazwie „tbComments”:

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

A oto jak to wygląda:

wprowadź opis obrazu tutaj

Bułka z masłem.


19

Dodaję UIImageViewjako podokres UITextView. To dopasowuje natywną ramkę na a UITextField, w tym gradient od góry do dołu:

wprowadź opis obrazu tutaj

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

Oto obrazy png, których używam, i reprezentacja jpg:

@ 1x

@ 2x

wprowadź opis obrazu tutaj


Dobre rozwiązanie. Czy te obrazy są Twoje? Czy możemy z nich korzystać?
James Webster

Te obrazy są „wzorowane” na obrazach używanych we własnych aplikacjach Apple. Prawdę mówiąc, wyodrębniłem je i dokonałem bardzo niewielu, jeśli w ogóle, zmian. Używaj na własne ryzyko. Celem było naśladowanie rodzimego wyglądu i stylu, więc trudno jest wymyślić coś, co wygląda zupełnie inaczej. Bez względu na to, co jest warte, wysłałem i otrzymałem zatwierdzone aplikacje używające tego obrazu bez problemu.
Ben Packard,

Wygląda na to, że pliki obrazu png zostały usunięte - nie zamierzam stale aktualizować tego o nową lokalizację obrazu, więc przepraszam, jeśli plik jpg nie działa dla Ciebie. Mogę ponownie przesłać jako i na żądanie w komentarzu.
Ben Packard,

3
Z załączonym obrazem działa to najlepiej: coderesizableImageWithCapInsets: UIEdgeInsetsMake (28, 14, 28, 14)
RefuX

Łącza WikiUpload (dla dwóch obrazów) nie znajdują teraz plików obrazów. ;-(
Mike Gledhill

18

Działa świetnie, ale kolor powinien być a CGColor, a nie UIColor:

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

4
#import <QuartzCore / QuartzCore.h>
kolinko

6

Uważam, że powyższe odpowiedzi dotyczą poprzednich wersji Swift. Wyszukałem trochę w Google i poniższy kod działa dla Swift 4. Po prostu udostępniam go komukolwiek, kto może skorzystać.

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

Miłego kodowania!


Dzięki Swift5 i trybowi ciemnemu możesz nawet używać kolorów systemowych:self.textViewName.layer.borderColor = UIColor.systemGray4.cgColor
mnóstwo

4

do szybkiego programowania użyj tego

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

Albo po prostuUIColor(white: 0.2, alpha: 1).CGColor
Leo

3

jest to tak blisko, jak tylko mogłem z oryginalnego 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
}

1

możesz dodać obramowanie do UITextView z Storyboard - Identity Inspector - User Defined Runtime Attribute

wprowadź opis obrazu tutaj


0

Począwszy od iOS 8 i Xcode 6, teraz uważam, że najlepszym rozwiązaniem jest podklasa UITextView i oznaczenie podklasy jako IB_DESIGNABLE, co pozwoli ci wyświetlić obramowanie w scenorysie.

Nagłówek:

#import <UIKit/UIKit.h>

IB_DESIGNABLE

@interface BorderTextView : UITextView

@end

Realizacja:

#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

Następnie po prostu przeciągnij swój UITextView w scenorysie i ustaw jego klasę na BorderTextView


0

To, co sprawiło, że zadziałało (oprócz podążania za odpowiedziami tutaj), to dodanie borderStyleatrybutu:

#import <QuartzCore/QuartzCore.h>
..

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

0

Tylko mały dodatek. Jeśli obramowanie zostanie nieco szersze, będzie to kolidować z lewą i prawą stroną tekstu. Aby tego uniknąć, dodałem następujący wiersz:

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

0

W Swift 3 możesz użyć następujących dwóch linii:

myText.layer.borderColor = UIColor.lightGray.cgColor

myText.layer.borderWidth = 1.0

-3

Rozwiązałem ten problem w scenorysie, umieszczając całkowicie wyłączony UIButtonza UITextViewi ustawiając kolor tła UITextViewclearColor. Działa to bez konieczności dodatkowego kodu lub pakietów.


3
Oczywiście to nie działa w iOS 7, ponieważ przyciski nie mają krawędzi (przyciski wyglądają teraz jak etykiety)
Mike Gledhill
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.