Texteinfügung für UITextField?

Ich möchte den Text von a einfügen UITextField.

Ist das möglich?

Durch das Überschreiben -textRectForBounds:wird nur der Einschub des Platzhaltertextes geändert. Um den Einschub des bearbeitbaren Textes zu ändern, müssen Sie auch überschreiben-editingRectForBounds:

// placeholder position
- (CGRect)textRectForBounds:(CGRect)bounds {
     return CGRectInset(bounds, 10, 10);
}

// text position
- (CGRect)editingRectForBounds:(CGRect)bounds {
     return CGRectInset(bounds, 10, 10);
}

Ich konnte es schaffen durch:

myTextField.layer.sublayerTransform = CATransform3DMakeTranslation(5, 0, 0);

Denken Sie natürlich daran, QuartzCore zu importieren und das Framework zu Ihrem Projekt hinzuzufügen.

Wenn Sie nur einen linken Rand benötigen, können Sie Folgendes versuchen:

UItextField *textField = [[UITextField alloc] initWithFrame:...];
UIView *leftView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 10, textField.frame.size.height)];
leftView.backgroundColor = textField.backgroundColor;
textField.leftView = leftView;
textField.leftViewMode = UITextFieldViewModeAlways;

Für mich geht das. Ich hoffe das kann helfen.

Überschreiben Sie in einer von UITextField abgeleiteten Klasse mindestens diese beiden Methoden:

- (CGRect)textRectForBounds:(CGRect)bounds;
- (CGRect)editingRectForBounds:(CGRect)bounds;

Es könnte so einfach sein, wenn Sie keinen zusätzlichen Inhalt haben:

return CGRectInset(bounds , 10, 10);

UITextField bietet verschiedene Positionierungsmethoden, die Sie überschreiben können.

Wie über eine @IBInspectable, @IBDesignableschnelle Klasse.

@IBDesignable
class TextField: UITextField {
    @IBInspectable var insetX: CGFloat = 6 {
       didSet {
         layoutIfNeeded()
       }
    }
    @IBInspectable var insetY: CGFloat = 6 {
       didSet {
         layoutIfNeeded()
       }
    }

    // placeholder position
    override func textRectForBounds(bounds: CGRect) -> CGRect {
        return CGRectInset(bounds , insetX , insetY)
    }

    // text position
    override func editingRectForBounds(bounds: CGRect) -> CGRect {
        return CGRectInset(bounds , insetX , insetY)
    }
}

Sie sehen dies in Ihrem Storyboard.

Update - Swift 3

@IBDesignable
class TextField: UITextField {
    @IBInspectable var insetX: CGFloat = 0
    @IBInspectable var insetY: CGFloat = 0

    // placeholder position
    override func textRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.insetBy(dx: insetX, dy: insetY)
    }

    // text position
    override func editingRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.insetBy(dx: insetX, dy: insetY)
    }
}

Wenn Sie eine Schaltfläche zum Löschen haben, funktioniert die akzeptierte Antwort für Sie nicht. Wir sollten uns auch davor schützen, dass Apple in Zukunft etwas ändert, indem wir anrufensuper .

Um sicherzustellen, dass der Text die Schaltfläche zum Löschen nicht überlappt, müssen Sie zuerst den Standardwert ermitteln superund dann nach Bedarf anpassen.

Dieser Code fügt oben, links und unten im Textfeld 10px-Einfügungen hinzu:

@interface InsetTextField : UITextField

@end


@implementation InsetTextField

// Placeholder position
- (CGRect)textRectForBounds:(CGRect)bounds {
    CGRect rect = [super textRectForBounds:bounds];
    UIEdgeInsets insets = UIEdgeInsetsMake(10, 10, 10, 0);

    return UIEdgeInsetsInsetRect(rect, insets);
}

// Text position
- (CGRect)editingRectForBounds:(CGRect)bounds {
    CGRect rect = [super editingRectForBounds:bounds];
    UIEdgeInsets insets = UIEdgeInsetsMake(10, 10, 10, 0);

    return UIEdgeInsetsInsetRect(rect, insets);
}

// Clear button position
- (CGRect)clearButtonRectForBounds:(CGRect)bounds {
    CGRect rect = [super clearButtonRectForBounds:bounds];

    return CGRectOffset(rect, -5, 0);
}

@end

Hinweis: UIEdgeInsetsMake akzeptiert Parameter in der Reihenfolge: oben , links , unten , rechts .

Ich dachte, ich würde eine schnelle Lösung liefern

import UIKit

class TextField: UITextField {
    let inset: CGFloat = 10

    // placeholder position
    override func textRectForBounds(bounds: CGRect) -> CGRect {
        return CGRectInset(bounds , inset , inset)
    }

    // text position
    override func editingRectForBounds(bounds: CGRect) -> CGRect {
        return CGRectInset(bounds , inset , inset)
    }

    override func placeholderRectForBounds(bounds: CGRect) -> CGRect {
        return CGRectInset(bounds, inset, inset) 
    }
}

Swift 3+

import UIKit

class TextField: UITextField {
    let inset: CGFloat = 10

    // placeholder position
    override func textRect(forBounds: CGRect) -> CGRect {
        return forBounds.insetBy(dx: self.inset , dy: self.inset)
    }

    // text position
    override func editingRect(forBounds: CGRect) -> CGRect {
        return forBounds.insetBy(dx: self.inset , dy: self.inset)
    }

    override func placeholderRect(forBounds: CGRect) -> CGRect {
        return forBounds.insetBy(dx: self.inset, dy: self.inset)
    }
}

Verwenden textRectForBounds:ist der richtige Ansatz. Ich habe dies in meiner Unterklasse zusammengefasst, damit Sie es einfach verwenden können textEdgeInsets. Siehe SSTextField .

Schnell

 class TextField: UITextField {

    let inset: CGFloat = 8

    // placeholder position
    override func textRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.insetBy(dx: inset, dy: inset)
    }

    // text position
    override func editingRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.insetBy(dx: inset, dy: inset)
    }
}

Für Leute, die nach einer einfacheren Lösung suchen.

Fügen Sie das UITextFieldInnere hinzu a UIView. Um einen Einschub um ein Textfeld zu simulieren, halte ich 10 Pixel links und die Breite ist 20 Pixel kleiner als die Ansicht. Verwenden Sie für einen abgerundeten Eckrand um das Textfeld den Rand der Ansicht

viewBG.layer.cornerRadius = 8.0;
viewBG.layer.borderColor = [UIColor darkGrayColor].CGColor;
viewBG.layer.borderWidth = 1.0;

Sie können die Texteinfügung für UITextField festlegen, indem Sie die linke Ansicht festlegen.

So was:

UITextField *yourTextField = [[UITextField alloc] init];
UIView *leftView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 5, 5)];
leftView.backgroundColor = [UIColor clearColor];
yourTextField.leftViewMode = UITextFieldViewModeAlways;
yourTextField.leftView = leftView;

Schnell

    // adjust place holder text
    let paddingView = UIView(frame: CGRectMake(0, 0, 10, usernameOrEmailField.frame.height))
    usernameOrEmailField.leftView = paddingView
    usernameOrEmailField.leftViewMode = UITextFieldViewMode.Always

Ein guter Ansatz zum Hinzufügen von Auffüllungen zu UITextField besteht darin, UITextField in Unterklassen zu unterteilen und eine edgeInsets-Eigenschaft hinzuzufügen. Anschließend legen Sie die edgeInsets fest und das UITextField wird entsprechend gezeichnet. Dies funktioniert auch korrekt mit einem benutzerdefinierten leftView- oder rightView-Set.

OSTextField.h

#import <UIKit/UIKit.h>

@interface OSTextField : UITextField

@property (nonatomic, assign) UIEdgeInsets edgeInsets;

@end

OSTextField.m

#import "OSTextField.h"

@implementation OSTextField

- (id)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if (self) {
        self.edgeInsets = UIEdgeInsetsMake(0, 0, 0, 0);
    }
    return self;
}

-(id)initWithCoder:(NSCoder *)aDecoder{
    self = [super initWithCoder:aDecoder];
    if(self){
        self.edgeInsets = UIEdgeInsetsMake(0, 0, 0, 0);
    }
    return self;
}

- (CGRect)textRectForBounds:(CGRect)bounds {
    return [super textRectForBounds:UIEdgeInsetsInsetRect(bounds, self.edgeInsets)];
}

- (CGRect)editingRectForBounds:(CGRect)bounds {
    return [super editingRectForBounds:UIEdgeInsetsInsetRect(bounds, self.edgeInsets)];
}

@end

Swift 3 / Designable in Interface Builder / Separate horizontale und vertikale Insekten / sofort einsatzbereit

@IBDesignable
class TextFieldWithPadding: UITextField {

@IBInspectable var horizontalInset: CGFloat = 0
@IBInspectable var verticalInset: CGFloat = 0

override func textRect(forBounds bounds: CGRect) -> CGRect {
    return bounds.insetBy(dx: horizontalInset, dy: verticalInset)
}

override func editingRect(forBounds bounds: CGRect) -> CGRect {
    return bounds.insetBy(dx: horizontalInset , dy: verticalInset)
}

override func placeholderRect(forBounds bounds: CGRect) -> CGRect {
    return bounds.insetBy(dx: horizontalInset, dy: verticalInset)
}
}

Verwendungszweck:

&

Ich habe dies in IB gemacht, wo ich eine UIView hinter der TextView erstellt habe, die etwas länger war. Wenn die Hintergrundfarbe von textField auf klar eingestellt ist.

Es ist der schnellste Weg, den ich gefunden habe, ohne Unterklassen zu machen:

UIView *spacerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 10., 10.)];
[textField setLeftViewMode:UITextFieldViewModeAlways];
[textField setLeftView:spacerView];

In Swift:

let spacerView = UIView(frame:CGRect(x:0, y:0, width:10, height:10))
textField.leftViewMode = UITextFieldViewMode.Always
textField.leftView = spacerView

Hier ist das gleiche UITextField der Unterklasse, das in Swift 3 geschrieben wurde. Es unterscheidet sich erheblich von früheren Versionen von Swift, wie Sie sehen werden:

import UIKit

class MyTextField: UITextField
    {
    let inset: CGFloat = 10

    // placeholder position
    override func textRect(forBounds bounds: CGRect) -> CGRect
        {
        return bounds.insetBy(dx: inset, dy: inset)
        }

    // text position
    override func editingRect(forBounds bounds: CGRect) -> CGRect
        {
        return bounds.insetBy(dx: inset, dy: inset)
        }

    override func placeholderRect(forBounds bounds: CGRect) -> CGRect
        {
        return bounds.insetBy(dx: inset, dy: inset)
        }
    }

Im Übrigen können Sie auch Folgendes tun, wenn Sie den Einschub nur einer Seite steuern möchten. Dieses spezielle Beispiel zum Anpassen nur des linken Einschubs ist nützlich, wenn Sie ein Bild über dem UITextField platzieren, es dem Benutzer jedoch im Textfeld anzeigen soll:

    override func editingRect(forBounds bounds: CGRect) -> CGRect
        {
        return CGRect.init(x: bounds.origin.x + inset, y: bounds.origin.y, width: bounds.width - inset, height: bounds.height)
        }

Swift 4.2 Version:

import UIKit

class InsetTextField: UITextField {

  let inset: CGFloat = 10

  override func textRect(forBounds bounds: CGRect) -> CGRect {
    return bounds.insetBy(dx: inset, dy: inset)
  }


  override func editingRect(forBounds bounds: CGRect) -> CGRect {
    return bounds.insetBy(dx: inset, dy: inset)
  }

  override func placeholderRect(forBounds bounds: CGRect) -> CGRect {
    return bounds.insetBy(dx: inset, dy: inset)
  }

}

Sie können die Position des Texts in einem Textfeld anpassen, indem Sie ihn zu einer Unterklasse UITextFieldder -textRectForBounds:Methode machen und diese überschreiben .

Es ist absurd, dass Sie eine Unterklasse bilden müssen, da UITextFielddie Methoden bereits implementiert sind, wie @Adam Waite betont. Hier ist eine schnelle Erweiterung, die eine Factory-Methode verfügbar macht, die auch in unseren Kategorien repo verfügbar ist :

private class InsetTextField: UITextField {
    var insets: UIEdgeInsets

    init(insets: UIEdgeInsets) {
        self.insets = insets
        super.init(frame: CGRectZero)
    }

    required init(coder aDecoder: NSCoder) {
        fatalError("not intended for use from a NIB")
    }

    // placeholder position
    override func textRectForBounds(bounds: CGRect) -> CGRect {
        return super.textRectForBounds(UIEdgeInsetsInsetRect(bounds, insets))
    }

    // text position
    override func editingRectForBounds(bounds: CGRect) -> CGRect {
        return super.editingRectForBounds(UIEdgeInsetsInsetRect(bounds, insets))
    }
}

extension UITextField {

    class func textFieldWithInsets(insets: UIEdgeInsets) -> UITextField {
        return InsetTextField(insets: insets)
    }

}

Ich habe UITextField untergeordnet, um dies zu handhaben, das den linken, oberen, rechten und unteren Einschub sowie das Löschen der Tastenpositionierung unterstützt.

MRDInsetTextField.h

#import <UIKit/UIKit.h>

@interface MRDInsetTextField : UITextField

@property (nonatomic, assign) CGRect inset;

@end

MRDInsetTextField.m

#import "MRDInsetTextField.h"

@implementation MRDInsetTextField

- (id)init
{
    self = [super init];
    if (self) {
        _inset = CGRectZero;
    }
    return self;
}

- (id)initWithCoder:(NSCoder *)aDecoder
{
    self = [super initWithCoder:aDecoder];
    if (self) {
        _inset = CGRectZero;
    }
    return self;
}

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        _inset = CGRectZero;
    }
    return self;
}

- (void)setInset:(CGRect)inset {
    _inset = inset;

    [self setNeedsLayout];
}

- (CGRect)getRectForBounds:(CGRect)bounds withInset:(CGRect)inset {

    CGRect newRect = CGRectMake(
                         bounds.origin.x + inset.origin.x,
                         bounds.origin.y + inset.origin.y,
                         bounds.origin.x + bounds.size.width - inset.origin.x - inset.size.width,
                         bounds.origin.y + bounds.size.height - inset.origin.y - inset.size.height
                         );

    return newRect;
}

- (CGRect)textRectForBounds:(CGRect)bounds {
    return [self getRectForBounds:[super textRectForBounds:bounds] withInset:_inset];
}

- (CGRect)placeholderRectForBounds:(CGRect)bounds {
    return [self getRectForBounds:bounds withInset:_inset];
}

- (CGRect)editingRectForBounds:(CGRect)bounds {
    return [self getRectForBounds:[super editingRectForBounds:bounds] withInset:_inset];
}

- (CGRect)clearButtonRectForBounds:(CGRect)bounds {
    return CGRectOffset([super clearButtonRectForBounds:bounds], -_inset.size.width, _inset.origin.y/2 - _inset.size.height/2);
}

@end

Anwendungsbeispiel, bei dem * _someTextField * aus der Nib / Storyboard-Ansicht mit der benutzerdefinierten MRDInsetTextField- Klasse stammt

[(MRDInsetTextField*)_someTextField setInset:CGRectMake(5, 0, 5, 0)]; // left, top, right, bottom inset

Dies ist nicht so kurz wie die anderen Beispiele, verfolgt jedoch einen völlig anderen Ansatz zur Lösung dieses Problems. Beachten Sie, dass das Caret weiterhin bündig mit dem linken Rand beginnt, der Text jedoch beim Eingeben / Anzeigen ordnungsgemäß eingerückt wird. Dies funktioniert ohne Unterklassen, wenn Sie nur einen linken Rand suchen und ihn bereits UITextFieldDelegatefür Ihre Textfelder verwenden. Sie müssen sowohl die Standardtextattribute als auch die Typattribute festlegen. Sie legen die Standardtextattribute fest, wenn Sie das Textfeld erstellen. Die Typattribute, die Sie im Delegaten festlegen müssen. Wenn Sie auch einen Platzhalter verwenden, möchten Sie diesen ebenfalls auf den gleichen Rand setzen. Alles in allem erhalten Sie so etwas.

Erstellen Sie zunächst eine Kategorie für die UITextFieldKlasse.

//  UITextField+TextAttributes.h

#import <UIKit/UIKit.h>

@interface UITextField (TextAttributes)

- (void)setIndent:(CGFloat)indent;

@end


//  UITextField+TextAttributes.m
#import "UITextField+TextAttributes.h"

@implementation UITextField (TextAttributes)

- (void)setTextAttributes:(NSDictionary*)textAttributes indent:(CGFloat)indent
{
    if (!textAttributes) return;

    NSMutableParagraphStyle *paragraphStyle = [textAttributes objectForKey:NSParagraphStyleAttributeName];
    paragraphStyle.firstLineHeadIndent = indent;
    paragraphStyle.headIndent = indent;
}

- (void)setIndent:(CGFloat)indent
{
   [self setTextAttributes:self.defaultTextAttributes indent:indent];
   [self setTextAttributes:self.typingAttributes indent:indent];
}

@end

Wenn Sie dann platzierte Halter verwenden, stellen Sie sicher, dass Sie einen zugewiesenen Platzhalter verwenden, der denselben Einzug setzt. Erstellen Sie ein Standardwörterbuch mit den richtigen Attributen:

NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
paragraphStyle.firstLineHeadIndent = 7;
paragraphStyle.headIndent = 7;
NSDictionary *placeholderAttributes = [NSDictionary dictionaryWithObjectsAndKeys: paragraphStyle, NSParagraphStyleAttributeName, nil];

Importieren Sie dann die obige Kategorie und legen Sie beim Erstellen eines Textfelds den Standardeinzug, den Delegaten und die oben definierten Standardplatzhalterattribute fest. Zum Beispiel:

UITextField *textField = [[UITextField alloc] init];
textField.indent = 7;
textField.delegate = self;
textField.attributedPlaceholder = [[NSAttributedString alloc] initWithString:@"Placeholder Text" attributes:placeholderAttributes];

Implementieren Sie schließlich im Delegaten die textFieldDidBeginEditingMethode wie folgt:

- (void)textFieldDidBeginEditing:(UITextField *)textField
{
    textField.indent = 7;
}

Normalerweise versuche ich, Unterklassen zu vermeiden, aber das funktioniert, wenn Sie bereits:

// add a property 
@property (nonatomic) UIEdgeInsets edgeInsets;

// and override:

- (CGRect)textRectForBounds:(CGRect)bounds
{
    return [super textRectForBounds:UIEdgeInsetsInsetRect(bounds, self.edgeInsets)];
}

- (CGRect)editingRectForBounds:(CGRect)bounds
{
    return [super editingRectForBounds:UIEdgeInsetsInsetRect(bounds, self.edgeInsets)];
}

So werfen Sie eine andere Lösung ein, für die keine Unterklassen erforderlich sind:

UITextField *txtField = [UITextField new];
txtField.borderStyle = UITextBorderStyleRoundedRect;

// grab BG layer
CALayer *bgLayer = txtField.layer.sublayers.lastObject;
bgLayer.opacity = 0.f;

// add new bg view
UIView *bgView = [UIView new];
bgView.backgroundColor = [UIColor whiteColor];
bgView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
bgView.userInteractionEnabled = NO;

[txtField addSubview: bgView];
[txtField sendSubviewToBack: bgView];

Getestet mit iOS 7 und iOS 8. Beide funktionieren. Dennoch besteht möglicherweise die Möglichkeit, dass Apple die Ebenenhierarchie von UITextField ändert, was die Dinge stark durcheinander bringt.

Hier ist eine umfassende Swift-Antwort, die eine leftView (benutzerdefiniertes Symbol) und eine benutzerdefinierte Schaltfläche zum Löschen enthält, die beide im Interface Builder mit anpassbaren Einfügungen festgelegt sind.

import UIKit

@IBDesignable
class InsetTextField: UITextField {
@IBInspectable var leftInset:CGFloat = 0
@IBInspectable var rightInset:CGFloat = 0
@IBInspectable var icon:UIImage? { didSet {
    let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 16, height: 16))
    imageView.image = icon
    self.leftView = imageView
    self.leftViewMode = .Always
} }

@IBInspectable var clearButton:UIImage? { didSet {
    let button = UIButton(type: .Custom)
    button.setImage(clearButton, forState: .Normal)
    button.addTarget(self, action: "clear", forControlEvents: UIControlEvents.TouchUpInside)
    button.frame = CGRect(x: 0, y: 0, width: 18, height: 18)
    self.rightView = button
    self.rightViewMode = .WhileEditing
} }

func clear() {
    self.text = ""
}

override func leftViewRectForBounds(bounds: CGRect) -> CGRect {
    var height:CGFloat = 0
    var width:CGFloat = 0
    if let leftView = self.leftView {
        height = leftView.bounds.height
        width = leftView.bounds.width
    }

    return CGRect(x: leftInset, y: bounds.height/2 - height/2, width: width, height: height)
}

override func rightViewRectForBounds(bounds: CGRect) -> CGRect {
    var height:CGFloat = 0
    var width:CGFloat = 0
    if let rightView = self.rightView {
        height = rightView.bounds.height
        width = rightView.bounds.width
    }

    return CGRect(x: bounds.width - width - rightInset, y: bounds.height/2 - height/2, width: width, height: height)
}

}

Eine Lösung, die tatsächlich funktioniert und alle Fälle abdeckt:

• Sollte offsetBynicht verwenden insetBy.
• Sollte auch die Super-Funktion aufrufen, um das Original zu erhalten Rect.
• Grenzen sind fehlerhaft. Sie müssen das ursprüngliche X, Y versetzen. Grenzen haben X, Y als Nullen.
• Das ursprüngliche x, y kann beispielsweise ungleich Null sein, wenn die linke Ansicht des UITextField festgelegt wird.

Stichprobe:

override func textRect(forBounds bounds: CGRect) -> CGRect {
    return super.textRect(forBounds: bounds).offsetBy(dx: 0.0, dy: 4)
}


override func editingRect(forBounds bounds: CGRect) -> CGRect {
    return super.editingRect(forBounds: bounds).offsetBy(dx: 0.0, dy: 4)
}

Wenn Sie den Einzug oben und links nur dann ändern möchten

// Platzhalterposition

- (CGRect)textRectForBounds:(CGRect)bounds {

CGRect frame = bounds;
frame.origin.y = 3;
 frame.origin.x = 5;
bounds = frame;
return CGRectInset( bounds , 0 , 0 );
}

// Textposition

- (CGRect)editingRectForBounds:(CGRect)bounds {

CGRect frame = bounds;
frame.origin.y = 3;
 frame.origin.x = 5;
bounds = frame;
return CGRectInset( bounds , 0 , 0 );
}

Schnelle Lösung ohne Unterklasse und auch inspizierbar

extension UITextField {
    @IBInspectable var textInsets: CGPoint {
            get {
                return CGPoint.zero
            }
            set {
                layer.sublayerTransform = CATransform3DMakeTranslation(newValue.x, newValue.y, 0);
            }
        }
}