UITextBorderStyleNoneを使用してUITextFieldのパディングを設定します。

Question

私はUITextFieldsにカスタムの背景を使いたかったのです。きれいに見えるようにするためにUITextBorderStyleNoneを使わなければならないという事実を除いて、これはうまく働きます。これにより、テキストは余白なしで左に固定されます。

カスタム背景画像を使用する以外はUITextBorderStyleRoundedRectと同じように手動でパディングを設定できますか？

Answer 1

私はこの正確な状況のために左パディングを設定するためのきちんとした小さなハックを見つけました。

基本的に、UITextFieldのleftViewプロパティを、必要なパディングサイズの空のビューになるように設定します。

UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 5, 20)];
textField.leftView = paddingView;
textField.leftViewMode = UITextFieldViewModeAlways;

私にとっては魅力のように働いた！

Swift 3/Swift 4では、それを実行することで実行できます。

let paddingView: UIView = UIView(frame: CGRect(x: 0, y: 0, width: 5, height: 20))
textField.leftView = paddingView
textField.leftViewMode = .always

Answer 2

このカテゴリ実装を作成して、.mファイルの先頭に追加しました。

@implementation UITextField (custom)
    - (CGRect)textRectForBounds:(CGRect)bounds {
        return CGRectMake(bounds.Origin.x + 10, bounds.Origin.y + 8,
                          bounds.size.width - 20, bounds.size.height - 16);
    }
    - (CGRect)editingRectForBounds:(CGRect)bounds {
        return [self textRectForBounds:bounds];
    }
@end

Piotr Blasiakが提供したリンクに基づいています。それは、より単純で、全く新しいサブクラスを作成し、そしてさらに簡単で、そして追加のUIViewを追加するように見えました。それでも、テキストフィールド内の余白を制御できないために何かが欠けているようです。

Swift 4ソリューション：

class CustomTextField: UITextField {
    struct Constants {
        static let sidePadding: CGFloat = 10
        static let topPadding: CGFloat = 8
    }

    override func textRect(forBounds bounds: CGRect) -> CGRect {
        return CGRect(
            x: bounds.Origin.x + Constants.sidePadding,
            y: bounds.Origin.y + Constants.topPadding,
            width: bounds.size.width - Constants.sidePadding * 2,
            height: bounds.size.height - Constants.topPadding * 2
        )
    }

    override func editingRect(forBounds bounds: CGRect) -> CGRect {
        return self.textRect(forBounds: bounds)
    }
}

Answer 3

Interface Builder/Storyboardで挿入値を編集できるXcode> 6用のSwift 3バージョン。

import UIKit

@IBDesignable
class FormTextField: UITextField {

    @IBInspectable var inset: CGFloat = 0

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

    override func editingRect(forBounds bounds: CGRect) -> CGRect {
        return textRect(forBounds: bounds)
    }

}

Answer 4

UITextFieldにパディングを追加するための良い方法は、edgeInsetsプロパティをサブクラス化して追加することです。その後、edgeInsetsを設定すると、それに応じてUITextFieldが描画されます。これは、カスタムのleftViewまたはrightViewセットでも正しく機能します。

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 = UIEdgeInsetsZero;
    }
    return self;
}

-(id)initWithCoder:(NSCoder *)aDecoder{
    self = [super initWithCoder:aDecoder];
    if(self){
        self.edgeInsets = UIEdgeInsetsZero;
    }
    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

Answer 5

編集：それでもiOS 11.3.1で動作します

IOS 6ではmyTextField.leftView = paddingView;が問題を引き起こしています

これは問題を解決します

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

右寄せのテキストフィールドには、コメントのlatenitecoderで説明されているようにCATransform3DMakeTranslation(-5, 0, 0)を使用します。

Answer 6

UITextFieldをこのようにサブクラス化するだけです。

@implementation DFTextField


- (CGRect)textRectForBounds:(CGRect)bounds
{
    return CGRectInset(bounds, 10.0f, 0);
}

- (CGRect)editingRectForBounds:(CGRect)bounds
{
    return [self textRectForBounds:bounds];
}


@end

これは左右に10ポイントの水平方向のパディングを追加します。

Answer 7

Objective Cコード

MyTextField.h

#import <UIKit/UIKit.h>

@interface MyTextField : UITextField

@property (nonatomic) IBInspectable CGFloat padding;

@end

MyTextField.m

#import "MyTextField.h"

IB_DESIGNABLE
@implementation MyTextField

@synthesize padding;

-(CGRect)textRectForBounds:(CGRect)bounds{
    return CGRectInset(bounds, padding, padding);
}

-(CGRect)editingRectForBounds:(CGRect)bounds{
    return [self textRectForBounds:bounds];
}

@end

Answer 8

Evil Troutの答えに基づいて、複数のアプリケーションで使いやすくするためにカテゴリを作成したいと思うかもしれません。

ヘッダファイル

@interface UITextField (PaddingText)

-(void) setLeftPadding:(int) paddingValue;

-(void) setRightPadding:(int) paddingValue;
@end

実装ファイル：

#import "UITextField+PaddingText.h"

@implementation UITextField (PaddingText)

-(void) setLeftPadding:(int) paddingValue
{
    UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, paddingValue, self.frame.size.height)];
    self.leftView = paddingView;
    self.leftViewMode = UITextFieldViewModeAlways;
}

-(void) setRightPadding:(int) paddingValue
{
    UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, paddingValue, self.frame.size.height)];
    self.rightView = paddingView;
    self.rightViewMode = UITextFieldViewModeAlways;
}

@end

使用例

#import "UITextField+PaddingText.h"

[self.YourTextField setLeftPadding:20.0f];

それが皆さんを助けてくれることを願っています

乾杯

Answer 9

1. テキストフィールドを作成する

PaddingTextField.Swift

import UIKit
class PaddingTextField: UITextField {

@IBInspectable var paddingLeft: CGFloat = 0
@IBInspectable var paddingRight: CGFloat = 0

override func textRectForBounds(bounds: CGRect) -> CGRect {
    return CGRectMake(bounds.Origin.x + paddingLeft, bounds.Origin.y,
        bounds.size.width - paddingLeft - paddingRight, bounds.size.height);
}

override func editingRectForBounds(bounds: CGRect) -> CGRect {
    return textRectForBounds(bounds)
}}

2. テキストフィールドクラスをPaddingTextFieldに設定し、必要に応じてパディングをカスタマイズします

3. 楽しめ

Answer 10

迅速なバージョン：

extension UITextField {
    @IBInspectable var padding_left: CGFloat {
        get {
            LF.log("WARNING no getter for UITextField.padding_left")
            return 0
        }
        set (f) {
            layer.sublayerTransform = CATransform3DMakeTranslation(f, 0, 0)
        }
    }
}

IBで値を代入できるように

Answer 11

パディングは設定できません。代わりにあなたの背景画像とその中のUIViewを持っているUITextFieldを持ってください。 UITextFieldの幅をUIViewWidth-(paddingSize x 2)に、高さを同様に設定してから、ポイントpaddingSize,paddingSizeに設定します。

Answer 12

このように、UITextFieldをサブクラス化するだけです（Swiftバージョン）。

import UIKit

class CustomTextField: UITextField {

    override func textRectForBounds(bounds: CGRect) -> CGRect {
       return CGRectInset(bounds, 25.0, 0)
    }

    override func editingRectForBounds(bounds: CGRect) -> CGRect {
       return self.textRectForBounds(bounds)
    }

}

これは左右の25.0ポイントの横方向のパディングを追加します。

Answer 13

私はNateのソリューションをベースにしていましたが、leftView/rightViewプロパティを使用すると問題が発生することがわかりました。そのため、左右のビューを考慮に入れるので、スーパーの実装を調整します。

- (CGRect)textRectForBounds:(CGRect)bounds {
    CGRect ret = [super textRectForBounds:bounds];
    ret.Origin.x = ret.Origin.x + 5;
    ret.size.width = ret.size.width - 10;
    return ret;
}

- (CGRect)editingRectForBounds:(CGRect)bounds {
    return [self textRectForBounds:bounds];
}

Answer 14

Swift 2.0バージョン：

let paddingView: UIView = UIView(frame: CGRectMake(0, 0, 5, 20))
textField.leftView = paddingView
textField.leftViewMode = UITextFieldViewMode.Always;

Answer 15

これはSwiftでこれを実現する方法です。

@IBOutlet weak var yourTextField: UITextField!

override func viewDidLoad() {
super.viewDidLoad()
let paddingView = UIView(frame: CGRectMake(0, 0, 10, self.yourTextField.frame.height))
yourTextField.leftView = paddingView
yourTextField.leftViewMode = UITextFieldViewMode.Always
}
}

リソース

Answer 16

^これらの提案は、プログラム的にインタフェースを作成している人にとっては素晴らしいものです。

しかし、Xcodeインターフェース・ビルダーを使用している私達にとっては、2つのLAZY EASY WAYSがあります。

• 簡単：テキストフィールドの後ろにUIImageViewを配置

• 最も簡単：あなたの上の境界線のスタイルを単純な黒い四角（左から2番目のオプション）に変更し、それから背景画像としてあなたの画像を追加します。画像は四角形よりも優先されます。正方形が実際に描画されていなくても、通常の画像背景に必要な余白を得ることができます。

編集：あなたはまた黒い球（IBでUITextBoxを選択するとき左から３番目のオプション）を使うことができます、それは一番右の「グラフィカルな球」スタイルで働かない。

Answer 17

Swift 3用に更新されたバージョン：

@IBDesignable
class FormTextField: UITextField {

    @IBInspectable var paddingLeft: CGFloat = 0
    @IBInspectable var paddingRight: CGFloat = 0

    override func textRect(forBounds bounds: CGRect) -> CGRect {
        return CGRect(x: bounds.Origin.x + paddingLeft, y: bounds.Origin.y, width: bounds.size.width - paddingLeft - paddingRight, height: bounds.size.height)
    }

    override func editingRect(forBounds bounds: CGRect) -> CGRect {
        return textRect(forBounds: bounds)
    }
}

Answer 18

これを行う最良の方法は、単にUITextFieldのサブクラスを使用して.mファイルでクラスを作成することです。

 #import "CustomTextField.h"
 #import <QuartzCore/QuartzCore.h>
 @implementation CustomTextField


- (id)initWithCoder:(NSCoder*)coder 
 {
  self = [super initWithCoder:coder];

  if (self) {

//self.clipsToBounds = YES;
//[self setRightViewMode:UITextFieldViewModeUnlessEditing];

self.leftView = [[UIView alloc] initWithFrame:CGRectMake(0, 0,15,46)];
self.leftViewMode=UITextFieldViewModeAlways;
   }

  return self;

 }

これを行うことによってあなたのストーリーボードまたはxibに行きそしてアイデンティティインスペクタをクリックしそしてクラスオプションのあなた自身の "CustomTextField"と取り替えなさい。

注：textfieldに対して自動レイアウトでパディングを単に指定した場合、アプリケーションは実行されず、空白の画面しか表示されません。

Answer 19

UITextBorderStyleNoneを使用してUITextFieldのパディングを設定する：Swift

@Evil Troutの最も投票された回答に基づいて、以下に示すように、ViewControllerクラスにカスタムメソッドを作成しました。

- (void) modifyTextField:(UITextField *)textField
{
    UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 5, 20)];
    textField.leftView = paddingView;
    textField.leftViewMode = UITextFieldViewModeAlways;
    textField.rightView = paddingView;
    textField.rightViewMode = UITextFieldViewModeAlways;

    [textField setBackgroundColor:[UIColor whiteColor]];
    [textField setTextColor:[UIColor blackColor]];
}

このメソッドを（viewDidLoadメソッド）の中で呼び出して、自分のTextFieldをそのメソッドに送信し、左右両方にパディングを追加して、次のように1行のコードでテキストと背景色を指定できます。

[self modifyTextField:self.firstNameTxtFld];

これはiOS 7でも完璧に動作しました！ビューを追加しすぎると、これをロードするには少し重いクラスになる可能性があります。しかし、他の解決策の難しさを心配するとき、私は自分自身がこの方法に偏っていて、この方法を使うことでもっと柔軟になったことに気づきました。 ;）

ハック "Evil Trout"をありがとう！ （弓）

私はSwiftでこの答えのコードスニペットを更新するべきだと思いました：

Swiftは既存のクラスの拡張を書くことを可能にしているので、それをそのように書いてみましょう。

extension UITextField {
    func addPaddingToTextField() {
        let paddingView: UIView = UIView.init(frame: CGRectMake(0, 0, 8, 20))
        self.leftView = paddingView;
        self.leftViewMode = .Always;
        self.rightView = paddingView;
        self.rightViewMode = .Always;


        self.backgroundColor = UIColor.whiteColor()
        self.textColor = UIColor.blackColor()
    }
}

使用法：

self.firstNameTxtFld.addPaddingToTextField()

これが他の誰かに役立つことを願っています！
乾杯！

Answer 20

スウィフト3バージョン：

class CustomTextField:UITextField{

    required init?(coder aDecoder: NSCoder){
        super.init(coder: aDecoder)
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
    }

    override func textRect(forBounds bounds: CGRect) -> CGRect {
        return CGRect.init(x: bounds.Origin.x + 8, y: bounds.Origin.y, width: bounds.width, height: bounds.height)
    }

    override func editingRect(forBounds bounds: CGRect) -> CGRect {
        return self.textRect(forBounds:bounds)
    }
}

Answer 21

Swift 3 Solution

class CustomTextField: UITextField {

 override func textRect(forBounds bounds: CGRect) -> CGRect {
  return CGRect(x: bounds.Origin.x + 10, y: bounds.Origin.y + 8, width: bounds.size.width - 20, height: bounds.size.height - 16)
 }

 override func editingRect(forBounds bounds: CGRect) -> CGRect {
  return self.textRect(forBounds: bounds)
 }
}

Answer 22

Nate Flinkの 答えが私のお気に入りですが、左右のビューについて忘れないでください。 UITextFieldサブクラスの例：

override func rightViewRectForBounds(bounds: CGRect) -> CGRect {
    let rightViewBounds = super.rightViewRectForBounds(bounds)

    return CGRectMake(CGRectGetMinX(rightViewBounds) - 10, CGRectGetMinY(rightViewBounds), CGRectGetWidth(rightViewBounds), CGRectGetHeight(rightViewBounds))
}

上記のコードでは、rightViewのUITextFieldに対する右パディングを設定しています。

Answer 23

あなたはカテゴリを使用することができます。パディングを左右に設定

UITextField + Padding.h

@interface UITextField (Padding)
@property (nonatomic, assign) CGFloat paddingValue;
@property (nonatomic, assign) CGFloat leftPadding;
@property (nonatomic, assign) CGFloat rightPadding;

//overwrite
-(CGRect)textRectForBounds:(CGRect)bounds;
-(CGRect)editingRectForBounds:(CGRect)bounds;
@end

UITextField + Padding.m

#import "UITextField+Padding.h"
#import <objc/runtime.h>

static char TAG_LeftPaddingKey;
static char TAG_RightPaddingKey;
static char TAG_Left_RightPaddingKey;

@implementation UITextField (Padding)

#pragma clang diagnostic Push
#pragma clang diagnostic ignored "-Wobjc-protocol-method-implementation"
-(CGRect)textRectForBounds:(CGRect)bounds {

CGFloat offset_Left=0;
CGFloat offset_Right=0;
if (self.paddingValue>0) {
    offset_Left=self.paddingValue;
    offset_Right=offset_Left;
}else{
    if (self.leftPadding>0){
        offset_Left=self.leftPadding;
    }
    if (self.rightPadding>0){
        offset_Right=self.rightPadding;
    }
}

if (offset_Left>0||offset_Right>0) {
    return CGRectMake(bounds.Origin.x+ offset_Left ,bounds.Origin.y ,
                      bounds.size.width- (offset_Left+offset_Right), bounds.size.height-2 );
 }else{
    return bounds;
 }
}



-(CGRect)editingRectForBounds:(CGRect)bounds {
    return [self textRectForBounds:bounds];
}
#pragma clang diagnostic pop


#pragma maek -setter&&getter
- (CGFloat)paddingValue
{
    return [objc_getAssociatedObject(self,&TAG_Left_RightPaddingKey) floatValue];
}
-(void)setPaddingValue:(CGFloat)paddingValue
{
    objc_setAssociatedObject(self, &TAG_Left_RightPaddingKey, @(paddingValue), OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

-(CGFloat)leftPadding
{
    return [objc_getAssociatedObject(self,&TAG_LeftPaddingKey) floatValue];
}

-(void)setLeftPadding:(CGFloat)leftPadding
{
    objc_setAssociatedObject(self, &TAG_LeftPaddingKey, @(leftPadding), OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

-(CGFloat)rightPadding
{
    return [objc_getAssociatedObject(self,&TAG_RightPaddingKey) floatValue];
}

-(void)setRightPadding:(CGFloat)rightPadding
{
    objc_setAssociatedObject(self, &TAG_RightPaddingKey, @(rightPadding), OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

@end

このようにパディングを設定できますself.phoneNumTF.paddingValue = 10.f;またはself.phoneNumTF.leftPadding = 10.f。

Answer 24

ブロディの解決策は私にとって完璧に働いた。テキストフィールドにサイドビューを追加し、パディングを追加する必要がありました。そのため、カスタムのUIEdgeInsetsプロパティをUITextFieldサブクラスに実装することで、このタスクを達成できました。私はすべてのプロジェクトでこの新しいサブクラスを使用します。

Answer 25

@Evilマスの答えは素晴らしいです。私は今かなり長い間このアプローチを使っています。それが欠けている唯一のものは「多数のテキストフィールドを扱うこと」です。私は他の方法を試しましたがうまくいかないようです。

パディングを追加するためだけにUITextFieldをサブクラス化しても意味がありません。そこで、私はすべてのUITextFieldを繰り返してパディングを追加しました。

-(void) addPaddingToAllTextFields:(UIView*)view {

    for(id currentView in [view subviews]){
        if([currentView isKindOfClass:[UITextField class]]) {
            // Change value of CGRectMake to fit ur need
            [currentView setLeftView:[[UIView alloc] initWithFrame:CGRectMake(0, 0, 10, 20)]];
            [currentView setLeftViewMode:UITextFieldViewModeAlways];
        }

        if([currentView respondsToSelector:@selector(subviews)]){
            [textfieldarray addObjectsFromArray:[self addPaddingToAllTextFields:currentView]];
        }
    }
}

Answer 26

textField.layer.borderWidth = 3;

私はパディングとして働いていたボーダーを追加します。

Answer 27

これはUITextfieldにパディングを与えるためのSwiftコードです

 func txtPaddingVw(txt:UITextField) {
     let paddingView = UIView(frame: CGRectMake(0, 0, 10, 10))
     txt.leftViewMode = .Always
     txt.leftView = paddingView
 }

とを使って

self.txtPaddingVw(txtPin)

Answer 28

誰かがSwift 4.0バージョンを探しているなら、extension以下がうまくいきます。 LeftにはRightとUITextFieldの両方のパディングがあります。実際にはストーリーボード設定ではIBInspectableです。値はInterface Builder/Storyboardから直接設定できます。これはSwift 4.0バージョンとXcode 9.0でテストされたコードです。

同じUITextFieldでClear Buttonを有効にしたい場合は、右パディングを空白にしておく必要があることに注意してください。

import UIKit

extension UITextField {

    @IBInspectable var paddingLeft: CGFloat {
        get {
            return leftView!.frame.size.width
        }
        set {
            let paddingView = UIView(frame: CGRect(x: 0, y: 0, width: newValue, height: frame.size.height))
            leftView = paddingView
            leftViewMode = .always
        }
    }

    @IBInspectable var paddingRight: CGFloat {
        get {
            return rightView!.frame.size.width
        }
        set {
            let paddingView = UIView(frame: CGRect(x: 0, y: 0, width: newValue, height: frame.size.height))
            rightView = paddingView
            rightViewMode = .always     
        }
    }
}  

Answer 29

なぜAttributed String！？！、これはIOS 6.0 :)の祝福の機能の1つです。

NSMutableParagraphStyle *mps = [[NSMutableParagraphStyle alloc] init];
            mps.firstLineHeadIndent = 5.0f;
UIColor *placeColor = self.item.bgColor;

textFieldInstance.attributedPlaceholder = [[NSAttributedString alloc] initWithString:@"My Place Holder" attributes:@{NSForegroundColorAttributeName: placeColor, NSFontAttributeName : [UIFont systemFontOfSize:7.0f], NSParagraphStyleAttributeName : mps}];

Answer 30

これまでに見つけた最良の解決策はカテゴリです。これが私が左右に5ポイントのパディングを追加する方法です。

@implementation UITextField (Padding)

#pragma clang diagnostic Push
#pragma clang diagnostic ignored "-Wobjc-protocol-method-implementation"
- (CGRect)textRectForBounds:(CGRect)bounds {
    return CGRectMake(bounds.Origin.x + 5, bounds.Origin.y,
                      bounds.size.width - 10, bounds.size.height);
}
- (CGRect)editingRectForBounds:(CGRect)bounds {
    return [self textRectForBounds:bounds];
}
#pragma clang diagnostic pop

@end

＃プラグマは迷惑な警告を取り除くためのものです

Answer 31

もう1つ考慮すべきことは、パディングを追加する場所に複数のUITextFieldがある場合、テキストフィールドごとに別々のUIViewを作成することです - それらは共有できないためです。