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.