UITextField Только верхняя и нижняя граница

Question

У меня в настоящее время есть регулярная граница. Я хотел бы, чтобы имел только верхнюю и нижнюю границу.

Как это сделать?

Используя UITextField «S layer свойства, у меня есть следующий код:

self.layer.borderColor = [[UIColor colorWithRed:160/255.0f green:160/255.0f blue:160/255.0f alpha:1.0f] CGColor]; 
    self.layer.borderWidth = 4.0f; 

я бы получил его на работу по делаю мой UITextField удлиненной, так что пользователь не видит левой и правой границ, но мне было просто интересно, есть ли лучший, менее хакерский способ сделать это?

меня проверил документы, и изменяя UITextField «s borderStyle не имеет такой опции.

С,

ИОС Первый таймер

Answer 1

Один подход, который я нашел, хорошо работает с использованием слоев. Вот фрагмент:

CALayer *bottomBorder = [CALayer layer]; 
bottomBorder.frame = CGRectMake(0.0f, self.frame.size.height - 1, self.frame.size.width, 1.0f); 
bottomBorder.backgroundColor = [UIColor blackColor].CGColor; 
[myTextField.layer addSublayer:bottomBorder]; 

Надеюсь, это поможет кому-то.

Answer 2

вы можете создать одно изображение, с верхней и нижней границы и установить его на фоне вашего UITextField:

yourTextField.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"yourBorderedImageName"]]; 

Answer 3

Я предлагаю вам поместите один вид в левой части текстового поля и один вид в правой части текстового поля, чтобы закрыть левую/правую границу.

UIView *v1 = [[UIView all] initWithFrame:CGRectMake(textfield.frame.origin.x - 5, textfield.frame.origin.y, 10, textifield.frame.size.height)]; 
UIView *v2 = [[UIView all] initWithFrame:CGRectMake(textfield.frame.origin.x + textfield.frame.size.with - 5, textfield.frame.origin.y, 10, textifield.frame.size.height)]; 

Answer 4

Вы также можете добавить виды сверху и снизу для использования в качестве границ.

// Top border 
UIView *topBorder = [[UIView alloc] 
    initWithFrame:CGRectMake(0, 
          0, 
          textfield.frame.size.width, 
          4.0f)]; 
topBorder.backgroundColor = [UIColor colorWithRed:160/255.0f 
              green:160/255.0f 
              blue:160/255.0f 
              alpha:1.0f]; 
[textfield addSubview:topBorder]; 

// Bottom border 
UIView *bottomBorder = [[UIView alloc] 
    initWithFrame:CGRectMake(0, 
          textfield.frame.origin.y + 
           textfield.frame.size.height - 4.0f, 
          textfield.frame.size.width, 
          4.0f)]; 
bottomBorder.backgroundColor = [UIColor colorWithRed:160/255.0f 
               green:160/255.0f 
               blue:160/255.0f 
               alpha:1.0f]; 
[textfield addSubview:bottomBorder]; 

Answer 5

Вы можете использовать слои для добавления линий/фигур в любой подкласс UIView. Этот код рисует две строки в верхней и нижней частях текстового поля. Вы можете добавить его в подкласс элемента управления или вызвать его непосредственно в родительском представлении/контроллере представления.

CGRect layerFrame = CGRectMake(0, 0, _usernameField.frame.size.width, _usernameField.frame.size.height); 
CGMutablePathRef path = CGPathCreateMutable(); 
CGPathMoveToPoint(path, NULL, 0, 0); 
CGPathAddLineToPoint(path, NULL, layerFrame.size.width, 0); // top line 
CGPathMoveToPoint(path, NULL, 0, layerFrame.size.height); 
CGPathAddLineToPoint(path, NULL, layerFrame.size.width, layerFrame.size.height); // bottom line 
CAShapeLayer * line = [CAShapeLayer layer]; 
line.path = path; 
line.lineWidth = 2; 
line.frame = layerFrame; 
line.strokeColor = [UIColor blackColor].CGColor; 
[_usernameField.layer addSublayer:line]; 

Answer 6

@ большого & простого примера user3075378 в Swift

var bottomBorder = CALayer() 
bottomBorder.frame = CGRectMake(0.0, textField.frame.size.height - 1, textField.frame.size.width, 1.0); 
bottomBorder.backgroundColor = UIColor.blackColor().CGColor 
textField.layer.addSublayer(bottomBorder) 

Answer 7

@Sebyddd зачем останавливаться? (;

EDIT: Существует проблема с линиями втягивается перед выполнением автоматической компоновки устанавливает правильную рамку для зрения, я редактировал свой ответ с исправлением: это в основном включает в себя вызов drawLines() в layoutSubviews():

class FramedTextField: UITextField { 

    @IBInspectable var linesWidth: CGFloat = 1.0 { didSet{ drawLines() } } 

    @IBInspectable var linesColor: UIColor = UIColor.blackColor() { didSet{ drawLines() } } 

    @IBInspectable var leftLine: Bool = false { didSet{ drawLines() } } 
    @IBInspectable var rightLine: Bool = false { didSet{ drawLines() } } 
    @IBInspectable var bottomLine: Bool = false { didSet{ drawLines() } } 
    @IBInspectable var topLine: Bool = false { didSet{ drawLines() } } 



    func drawLines() { 

     if bottomLine { 
      add(CGRectMake(0.0, frame.size.height - linesWidth, frame.size.width, linesWidth)) 
     } 

     if topLine { 
      add(CGRectMake(0.0, 0.0, frame.size.width, linesWidth)) 
     } 

     if rightLine { 
      add(CGRectMake(frame.size.width - linesWidth, 0.0, linesWidth, frame.size.height)) 
     } 

     if leftLine { 
      add(CGRectMake(0.0, 0.0, linesWidth, frame.size.height)) 
     } 

    } 

    typealias Line = CGRect 
    private func add(line: Line) { 
     let border = CALayer() 
     border.frame = line 
     border.backgroundColor = linesColor.CGColor 
     layer.addSublayer(border) 
    } 

    override func layoutSubviews() { 
     super.layoutSubviews() 
     drawLines() 
    } 

} 

Answer 8

Надеется, что это помогает, поместить это внутри класса TextField переопределения

UIView *view = [[UIView alloc] init]; 
     view.translatesAutoresizingMaskIntoConstraints = NO; 
     view.layer.borderWidth = 1; 
     view.backgroundColor = [UIColor blackColor]; 
     [self addSubview:view]; 

     [self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0]]; 
     [self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0.0]]; 
     [self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeHeight multiplier:1.0 constant:1.0]]; 
     [self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterX multiplier:1.0 constant:1.0]]; 

Answer 9

Благодаря user3075378. мой ответ основан на его. добавив направо и налево маленькие линии.

- (void)styleSearchTextField { 
    CALayer *bottomBorder = [CALayer layer], *leftBorder = [CALayer layer], *rightBorder = [CALayer layer]; 

    CGFloat thickness = 1.0f; 
    CGFloat side_height = 6.0f; 

    bottomBorder.frame = CGRectMake(0.0f, searchTextField.frame.size.height - 1, searchTextField.frame.size.width, thickness); 

    leftBorder.frame = CGRectMake(0.0f, searchTextField.frame.size.height - side_height, thickness, searchTextField.frame.size.height - 1); 

    rightBorder.frame = CGRectMake(searchTextField.frame.size.width - 1, searchTextField.frame.size.height - side_height, thickness, searchTextField.frame.size.height - 1); 

    bottomBorder.backgroundColor = [self.stylingDetails themeGrayColor].CGColor; 
    leftBorder.backgroundColor = [self.stylingDetails themeGrayColor].CGColor; 
    rightBorder.backgroundColor = [self.stylingDetails themeGrayColor].CGColor; 

    [searchTextField.layer addSublayer:bottomBorder]; 
    [searchTextField.layer addSublayer:leftBorder]; 
    [searchTextField.layer addSublayer:rightBorder]; 
} 

Answer 10

Swift 3: Чистить AutoLayout (я использую здесь PureLayout, но вы также можете сделать это с общим NSLayoutConstraint:

func makeUnderline(for textField: UITextField) { 
    let borderLine = UIView() 
    borderLine.backgroundColor = UIColor.black 
    borderLine.autoSetDimension(.height, toSize: 1) 
    textField.addSubview(borderLine) 
    borderLine.autoPinEdgesToSuperviewEdges(with: UIEdgeInsets.zero, excludingEdge: .top) 
}