Как настроить UITextview как текстовое поле Rounded Rect?
Я использую текстовое представление как композитор комментария.
В инспекторе свойств я не могу найти ничего похожего на свойство стиля границы, чтобы я мог использовать закругленный прямоугольник, что-то вроде UITextField
.
Итак, возникает вопрос: как я могу стилизовать UITextView
как UITextField
с закругленным прямоугольником?
Ответы
Ответ 1
Нет неявного стиля, который вам нужно выбрать, он включает в себя запись небольшого кода с помощью рамки QuartzCore
:
//first, you
#import <QuartzCore/QuartzCore.h>
//.....
//Here I add a UITextView in code, it will work if it added in IB too
UITextView *textView = [[UITextView alloc] initWithFrame:CGRectMake(50, 220, 200, 100)];
//To make the border look very close to a UITextField
[textView.layer setBorderColor:[[[UIColor grayColor] colorWithAlphaComponent:0.5] CGColor]];
[textView.layer setBorderWidth:2.0];
//The rounded corner part, where you specify your view corner radius:
textView.layer.cornerRadius = 5;
textView.clipsToBounds = YES;
Он работает только на OS 3.0 и выше, но теперь я думаю, что это платформа de facto.
Ответ 2
этот код работал хорошо для меня:
[yourTextView.layer setBackgroundColor: [[UIColor whiteColor] CGColor]];
[yourTextView.layer setBorderColor: [[UIColor grayColor] CGColor]];
[yourTextView.layer setBorderWidth: 1.0];
[yourTextView.layer setCornerRadius:8.0f];
[yourTextView.layer setMasksToBounds:YES];
Ответ 3
версия Swift 3
После настройки текстового вида в построителе интерфейса.
@IBOutlet weak var textView: UITextView!
override func viewDidLoad() {
super.viewDidLoad()
textView.layer.cornerRadius = 5
textView.layer.borderColor = UIColor.gray.withAlphaComponent(0.5).cgColor
textView.layer.borderWidth = 0.5
textView.clipsToBounds = true
}
Версия Swift 2.2
@IBOutlet weak var textView: UITextView!
override func viewDidLoad() {
super.viewDidLoad()
textView.layer.cornerRadius = 5
textView.layer.borderColor = UIColor.grayColor().colorWithAlphaComponent(0.5).CGColor
textView.layer.borderWidth = 0.5
textView.clipsToBounds = true
}
Ответ 4
Изменить: вам нужно импортировать
#import <QuartzCore/QuartzCore.h>
для использования радиуса угла.
Попробуйте это, он будет работать наверняка
UITextView* txtView = [[UITextView alloc] initWithFrame:CGRectMake(50, 50, 300, 100)];
txtView.layer.cornerRadius = 5.0;
txtView.clipsToBounds = YES;
Как
Роб понял, что если вы хотите, чтобы цвет рамки был похож на UITextField
, тогда вам нужно изменить ширину рамки на 2.0 и цвет на серый, добавив следующую строку
[textView.layer setBorderColor:[[[UIColor grayColor] colorWithAlphaComponent:0.5] CGColor]];
[textView.layer setBorderWidth:2.0];
Ответ 5
Мне нужна реальная сделка, поэтому я добавляю UIImageView
в качестве поднабора UITextView
. Это соответствует внутренней границе на UITextField
, включая градиент сверху вниз:
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];
Это изображения, которые я использую:
![enter image description here]()
![enter image description here]()
Ответ 6
Одним из решений является добавить UITextField под UITextView, сделать фон UITextView
прозрачным и отключить любое взаимодействие пользователя с UITextField
. Затем в коде измените кадр UITextField
с чем-то вроде этого
self.textField.frame = CGRectInset(self.textView.frame, 0, -2);
У вас будет тот же вид, что и текстовое поле.
И как предложено Jon, вы должны поместить этот фрагмент кода внутри [UIViewController viewDidLayoutSubviews]
в iOS 5.0 +.
Ответ 7
Для лучшего эффекта вам нужно использовать пользовательское (растягиваемое) фоновое изображение. Это также то, как обращается округленная граница UITextField
.
Ответ 8
Один из способов, который я нашел, чтобы сделать это без программирования, - сделать прозрачный текстовый фон, затем поместить вокруг него круглую кнопку Rect. Не забудьте изменить настройки кнопки, чтобы отключить его, и снимите флажок Disable adjusts image
.
Ответ 9
Вы можете проверить мою библиотеку под названием DCKit.
Вы можете сделать прямоугольное текстовое представление (а также текстовое поле/кнопка/обычная UIView
) непосредственно из Interface Builder
:
![DCKit: bordered UITextView]()
Он также имеет много других полезных функций, таких как текстовые поля с проверкой, элементы управления с границами, пунктирные границы, круговые и вырезки и т.д.
Ответ 10
Я знаю, что уже есть много ответов на этот вопрос, но я действительно не нашел их достаточным (по крайней мере, в Свифте). Я хотел найти решение, которое обеспечивало бы ту же самую границу, что и UITextField (а не приближенное, похожее на то, что выглядит прямо сейчас, но похожее на него и всегда будет выглядеть точно так же). Мне нужно было использовать UITextField для возврата UITextView для фона, но не хотелось создавать его отдельно каждый раз.
Нижеприведенное решение представляет собой UITextView, который снабжает его собственным UITextField для границы. Это сокращенная версия моего полного решения (которое аналогично добавляет поддержку "заполнителя" для UITextView) и было опубликовано здесь: fooobar.com/questions/12726/...
// This class implements a UITextView that has a UITextField behind it, where the
// UITextField provides the border.
//
class TextView : UITextView, UITextViewDelegate
{
var textField = TextField();
required init?(coder: NSCoder)
{
fatalError("This class doesn't support NSCoding.")
}
override init(frame: CGRect, textContainer: NSTextContainer?)
{
super.init(frame: frame, textContainer: textContainer);
self.delegate = self;
// Create a background TextField with clear (invisible) text and disabled
self.textField.borderStyle = UITextBorderStyle.RoundedRect;
self.textField.textColor = UIColor.clearColor();
self.textField.userInteractionEnabled = false;
self.addSubview(textField);
self.sendSubviewToBack(textField);
}
convenience init()
{
self.init(frame: CGRectZero, textContainer: nil)
}
override func layoutSubviews()
{
super.layoutSubviews()
// Do not scroll the background textView
self.textField.frame = CGRectMake(0, self.contentOffset.y, self.frame.width, self.frame.height);
}
// UITextViewDelegate - Note: If you replace delegate, your delegate must call this
func scrollViewDidScroll(scrollView: UIScrollView)
{
// Do not scroll the background textView
self.textField.frame = CGRectMake(0, self.contentOffset.y, self.frame.width, self.frame.height);
}
}
Ответ 11
Существует отличное фоновое изображение, которое идентично UITextView
, используемому для отправки текстовых сообщений в приложении iPhone Messages. Вам понадобится Adobe Illustrator, чтобы получить и изменить его.
элементы вектора iphone ui
Ответ 12
Один из способов, который я нашел, чтобы сделать это без программирования, - сделать прозрачный текстовый фон, затем поместить вокруг него круглую кнопку Rect. Не забудьте изменить настройки кнопки, чтобы отключить его, и снимите флажок Отключить настройку изображения.
Пробовал код Quartzcore и обнаружил, что это вызвало задержку в моем старом 3G (я использую для тестирования). Не большая проблема, но если вы хотите быть максимально возможными для разных ios и аппаратных средств, я рекомендую ответить Andrew_L выше - или создайте свои собственные изображения и примените соответственно.
Ответ 13
#import <QuartzCore/QuartzCore.h>
- (void)viewDidLoad{
UITextView *textView = [[UITextView alloc] initWithFrame:CGRectMake(50, 220, 200, 100)];
textView.layer.cornerRadius = 5;
textView.clipsToBounds = YES;
[textView.layer setBackgroundColor: [[UIColor whiteColor] CGColor]];
[textView.layer setBorderColor: [[UIColor grayColor] CGColor]];
[textView.layer setBorderWidth: 1.0];
[textView.layer setCornerRadius:8.0f];
[textView.layer setMasksToBounds:YES];
[self.view addSubView:textview];
}
Ответ 14
Вы можете создать текстовое поле, которое не принимает никаких событий поверх текстового вида:
CGRect frameRect = descriptionTextField.frame;
frameRect.size.height = 50;
descriptionTextField.frame = frameRect;
descriptionTextView.frame = frameRect;
descriptionTextField.backgroundColor = [UIColor clearColor];
descriptionTextField.enabled = NO;
descriptionTextView.layer.cornerRadius = 5;
descriptionTextView.clipsToBounds = YES;
Ответ 15
Если вы хотите, чтобы ваш код контроллера был чистым, вы можете подклассифицировать UITextView, как показано ниже, и изменить имя класса в Interface Builder.
RoundTextView.h
#import <UIKit/UIKit.h>
@interface RoundTextView : UITextView
@end
RoundTextView.m
#import "RoundTextView.h"
#import <QuartzCore/QuartzCore.h>
@implementation RoundTextView
-(id) initWithCoder:(NSCoder *)aDecoder {
if (self = [super initWithCoder:aDecoder]) {
[self.layer setBorderColor:[[[UIColor grayColor] colorWithAlphaComponent:0.333] CGColor]];
[self.layer setBorderWidth:1.0];
self.layer.cornerRadius = 5;
self.clipsToBounds = YES;
}
return self;
}
@end
Ответ 16
Я не думаю, что это возможно. но вы можете сделать UITableView
(сгруппированы) с 1 секцией и 1 пустой ячейкой и использовать ее в качестве контейнера для UITextView
.
Ответ 17
Это старый вопрос, и я также искал ответ на этот вопрос. Ответ luvieeres на 100% правильный, а позже Роб добавил код. Это отлично, но я нашел третью сторону в другом ответе на вопросы, который мне очень помогает. Я не только искал аналогичный внешний вид UITextField
поверх UITextView
, но также искал многострочную поддержку. ChatInputSample удовлетворены обоими. Вот почему я думаю, что эта третья сторона может быть полезной для других. Также благодаря Тимуру он упомянул этот открытый источник в здесь.
Ответ 18
В iOS7 следующие совпадения UITextField границы (по крайней мере, на мой взгляд):
textField.layer.borderColor = [[[UIColor grayColor] colorWithAlphaComponent:0.5] CGColor];
textField.layer.borderWidth = 0.5;
textField.layer.cornerRadius = 5;
textField.clipsToBounds = YES;
Не нужно ничего импортировать.
Благодаря @uvieere и @hanumanDev, ответы на которые идут мне почти там:)
Ответ 19
Вот мое решение:
- (void)viewDidLoad {
[super viewDidLoad];
self.textView.text = self.messagePlaceholderText;
self.textView.layer.backgroundColor = [[UIColor whiteColor] CGColor];
self.textView.layer.borderColor = [[[UIColor grayColor] colorWithAlphaComponent:0.3] CGColor];
self.textView.layer.borderWidth = 0.5;
self.textView.layer.cornerRadius = 5.5f;
self.textView.layer.masksToBounds = YES;
self.textView.textColor = [[UIColor grayColor] colorWithAlphaComponent:0.4];
}
- (void)textViewDidBeginEditing:(UITextView *)textView {
if (textView == self.tvMessage) {
// Delete placeholder text
if ([self.textView.text isEqualToString:self.messagePlaceholderText]) {
self.textView.text = @"";
self.textView.textColor = [UIColor blackColor];
}
}
}
- (void)textViewDidEndEditing:(UITextView *)textView {
if (textView == self.tvMessage) {
// Write placeholder text
if (self.textView.text.length == 0) {
self.textView.text = self.messagePlaceholderText;
self.textView.textColor = [[UIColor grayColor] colorWithAlphaComponent:0.4];
}
}
}
Ответ 20
Как насчет просто:
UITextField *textField = [[UITextField alloc] initWithFrame:CGRectMake(20, 20, 280, 32)];
textField.borderStyle = UITextBorderStyleRoundedRect;
[self addSubview:textField];