ตั้งค่าช่องว่างภายในสำหรับ UITextField ด้วย UITextBorderStyleNone


399

UITextFieldsผมอยากจะใช้พื้นหลังที่กำหนดเองสำหรับฉัน ใช้งานได้ดียกเว้นความจริงที่ว่าฉันต้องใช้UITextBorderStyleNoneเพื่อทำให้ดูสวย สิ่งนี้บังคับให้ข้อความติดไปทางซ้ายโดยไม่มีช่องว่างภายใน

ฉันสามารถตั้งค่าช่องว่างภายในด้วยตนเองเพื่อให้ดูเหมือนกับUITextBorderStyleRoundedRectยกเว้นการใช้ภาพพื้นหลังที่กำหนดเองได้หรือไม่?

คำตอบ:


837

ฉันพบแฮ็คเล็กน้อยที่เรียบร้อยเพื่อตั้งช่องว่างด้านซ้ายสำหรับสถานการณ์ที่แน่นอนนี้

โดยทั่วไปคุณตั้งค่าคุณสมบัติ leftView ของUITextFieldเป็นมุมมองที่ว่างเปล่าของขนาดของการขยายที่คุณต้องการ:

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

1
สิ่งที่ฉันต้องการแน่นอนยกเว้นฉันต้องการขยายไปทางขวาซึ่งส่วนใหญ่เหมือนกันแน่นอน ขอบคุณ!
cg

@Lukasz ฉันได้เพิ่มคำตอบอัตโนมัติในคำตอบนี้ซึ่งเป็นคำตอบที่ยอมรับได้ เส้นแรก. แก้ไข: โอ๊ะบางทีฉันไม่ได้บันทึก? หรือการแก้ไขของฉันถูกปฏิเสธ ไม่ว่าจะด้วยวิธีใด Vincent เพิ่มเข้ามาในการวางจำหน่ายอัตโนมัติดังนั้นคุณต้องทำเช่นนั้น!
Eric Goldberg

1
การใช้ ARC เหตุใดแอปของฉันจึงหยุดและใช้งาน CPU จำนวนมากหากฉันนำมาใช้ซ้ำ*paddingViewกับเขตข้อมูลข้อความหลาย ๆ
มัฟฟินแมน

3
มันเป็นวิธีแก้ปัญหาที่ไม่ดีไปได้ดีกว่าสำหรับ Nate Flink สิ่งที่หนึ่งไม่รวมถึงการเสริมโหมด editiong
Jacek Kwiecień

3
มันไม่ได้ทำงานกับหลาย textfields เพียงใช้หน่วยความจำมากและล้มเหลวในภายหลัง
กรงนก

177

ฉันสร้างการใช้งานหมวดหมู่นี้และเพิ่มไว้ที่ด้านบนของ.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 ที่ให้ไว้ มันดูเหมือนง่ายแล้วสร้างเป็น subclass 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)
    }
}

6
สิ่งนี้จะแสดงคำเตือนเกี่ยวกับวิธีการเอาชนะหมวดหมู่ ดูคำตอบนี้เพื่อระงับพวกเขา
pdenya

5
ฉันไม่ชอบทำสิ่งนี้ในหมวดหมู่ แต่นอกเหนือจากนี้เป็นวิธีที่สะอาดกว่าคำตอบที่ยอมรับ
Bob Vork

2
ดีกว่าที่จะใช้ CGRectInset () สำหรับบางสิ่งเช่นนี้แทนที่จะหมุนตัวคุณเอง มันดูสะอาดขึ้นเล็กน้อยด้วย: คืน CGRectInset (ขอบเขต, 10, 8);
Dennis Munsie

1
@shashwat ใช่คุณสามารถระบุการเติมใด ๆ ที่คุณต้องการ
Ege Akpinar

1
เมื่อฉันเพิ่ม 4 ปีที่ผ่านมาสิ่งต่าง ๆ กับ iOS และฉันยอมรับว่าตอนนี้มันเป็นการดีที่สุดที่จะสร้างคลาสย่อย อย่างไรก็ตามหากคุณต้องการวิธีที่รวดเร็วและสกปรกในการตรวจสอบระยะทางพิกเซลของคุณด้วยสายตาสิ่งนี้จะทำ;) ดังนั้นจึงเป็นเรื่องปกติสำหรับผู้คนที่ลงคะแนน !!
Nate Flink

139

เวอร์ชัน Swift 3 สำหรับ Xcode> 6 ซึ่งคุณสามารถแก้ไขค่าสิ่งที่ใส่เข้าไปใน Interface Builder / Storyboard

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)
    }

}

ป้อนคำอธิบายรูปภาพที่นี่


1
ฉันไม่เห็นช่องข้อความในเหมือง
okysabeni

2
ฉันต้องการเพิ่มบรรทัดนี้override func placeholderRectForBounds(bounds: CGRect) -> CGRect { return CGRectInset(bounds, inset, inset) }
Michael

2
คำตอบนี้จะเป็นประโยชน์มากขึ้นกับคำอธิบายหรือเชื่อมโยงไปยังคำอธิบายของสิ่งที่@IBDesignableและ@IBInspectableทำคือโพสต์นี้ที่ nshipster
รัสเซลออสติน

1
หากคุณพึ่งพามุมมองอุปกรณ์เสริมใด ๆ (เช่นฟังก์ชั่นปุ่มที่ชัดเจนใน UITextField) จากนั้นreturn super.textRectForBounds(CGRectInset(bounds, inset, inset))จะจัดการชดเชยจากมุมมองอุปกรณ์เสริมอย่างถูกต้อง
Mike Fay

@okysabeni คุณต้องคลิกที่ฟิลด์ข้อความของคุณและเปลี่ยน Class เป็น FormTextField
Gustavo Barbosa

77

แก้ไข: ยังใช้งานได้ใน iOS 11.3.1

ใน iOS 6 myTextField.leftView = paddingView;นั้นเป็นสาเหตุของปัญหา

วิธีนี้จะช่วยแก้ปัญหา

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

สำหรับเขตข้อมูลข้อความที่ถูกจัดชิดขวาให้ใช้การCATransform3DMakeTranslation(-5, 0, 0)กล่าวถึงโดยlatenitecoderในความคิดเห็น


1
ดีฉันต้องใส่ช่องว่างในฟิลด์ข้อความทั้งหมดของแอพฉันสร้างหมวดหมู่ของ UITextField และใส่รหัสนี้ไว้ภายใน - (เป็นโมฆะ) awakeFromNib {} และสิ่งนี้แก้ปัญหาของฉันได้
Teena nath Paul

ง่ายมาก! ขอบคุณ :) ฉันมีคำถามว่าฉันจะทำรหัสง่าย ๆ ที่จะทำให้ UITextField ทั้งหมดแทนที่จะเขียนโค้ดได้หลายครั้ง?
Luai Kalkatawi

1
ความคิดเห็นอื่น ๆ ทั้งหมดถือว่าคุณต้องการรอง UITextField จากด้านซ้าย การแบ่งคลาสย่อยเป็นค่าใช้จ่ายจำนวนมากเพื่อเพิ่มรหัสการเว้นวรรค แต่เพียงเพิ่มอักขระว่าง แต่โซลูชันนี้เป็นโซลูชัน การพิสูจน์อนาคตหนึ่งบรรทัด หากคุณกำลังทำงานกับฟิลด์ข้อความที่เป็นข้อความชิดขวาใช้ค่าลบ (-5,0,0) ขอบคุณ Inder
latenitecoder

1
หลังจาก 4 ปีฉันพบคำตอบของตัวเอง: D, @latenitecoder ความคิดเห็นของคุณเป็นสิ่งที่จำเป็น การอัปเดตคำตอบ
Inder Kumar Rathore

1
ฉันจะทำอย่างไรถ้าฉันต้องการได้ทั้งด้านขวาและด้านซ้าย?
มีนาฮันนา

70

วิธีการที่ดีในการเพิ่มการขยายไปยัง UITextField คือการ subclass และเพิ่มคุณสมบัติ edgeInsets จากนั้นคุณตั้งค่า edgeInsets และ UITextField จะถูกวาดตามลำดับ สิ่งนี้จะทำงานได้อย่างถูกต้องด้วยชุดซ้ายหรือมุมมองขวาที่กำหนดเอง

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

คำตอบนี้ควรได้รับการยอมรับ นอกจากนี้ยังใช้งานได้กับมุมมองด้านซ้ายและขวา ..
NSPratik

25

เพียง subclass UITextField เช่นนี้

@implementation DFTextField


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

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


@end

ซึ่งจะเป็นการเพิ่มช่องว่างในแนวนอนได้ 10 คะแนนในแต่ละด้าน


21

รหัส 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

ป้อนคำอธิบายรูปภาพที่นี่



20
  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)
}}
  1. ตั้งค่าคลาสฟิลด์ข้อความของคุณคือ PaddingTextField และปรับแต่งการเติมตามที่คุณต้องการ ป้อนคำอธิบายรูปภาพที่นี่ ป้อนคำอธิบายรูปภาพที่นี่

  2. สนุกกับมัน

สุดท้าย


19

จากคำตอบของ 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];

หวังว่ามันจะช่วยคุณออกมา

ไชโย


14

รุ่น Swift:

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

การตั้งค่า IBInspectable แสดงอยู่ในเครื่องมือสร้างอินเตอร์เฟส


IBInspectableช่วยให้คุณสามารถใช้รหัส setter ที่รันไทม์ดังนั้นเพียงแค่ใส่หมายเลขของคุณInterface Builderและมันจะทำงาน
superarts.org

Clear Buttonนี้จะไม่ทำงานเมื่อคุณมี ปุ่มชัดเจนของคุณจะมองไม่เห็นถ้าใช้วิธีนี้
Bhavin_m

11

คุณไม่สามารถตั้งค่าช่องว่างภายใน แทนที่จะมีUIViewที่มีภาพพื้นหลังของคุณและUITextFieldด้านในของมัน ตั้งค่าUITextFieldความกว้างและความสูงใกล้เคียงกันจากนั้นตั้งค่ามันที่จุดUIViewWidth-(paddingSize x 2)paddingSize,paddingSize


10

เพียง subclass UITextFieldเช่นนี้ ( Swift version ):

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จุดทั้งสองข้าง


8

ฉันใช้วิธีแก้ปัญหาของ Nate แต่แล้วฉันก็พบว่าสิ่งนี้ทำให้เกิดปัญหาเมื่อคุณใช้คุณสมบัติ leftView / rightView ดังนั้นปรับการใช้งานของ super ให้ดีขึ้นเพราะจะคำนึงถึงมุมมองซ้าย / ขวา

- (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];
}

6

อัพเดตเวอร์ชั่นสำหรับ 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)
    }
}

6

ตั้งค่าช่องว่างภายในสำหรับ UITextField ด้วย UITextBorderStyleNone: 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) และส่ง TextFields ใด ๆ ของฉันไปที่เมธอดนั้นและเพิ่มการเติมทั้งด้านขวาและซ้ายและให้สีข้อความและพื้นหลังโดยการเขียนโค้ดเพียงบรรทัดเดียวดังนี้:

[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()

หวังว่านี่จะเป็นประโยชน์กับคนอื่นที่นั่น!
ไชโย!


5

นี่คือวิธีการบรรลุสิ่งนี้ใน 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
}
}

ทรัพยากร


5

เวอร์ชั่น Swift 2.0:

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

4

^ คำแนะนำเหล่านี้ยอดเยี่ยมสำหรับผู้ที่สร้างอินเทอร์เฟซ

แต่มีสองวิธีที่ง่ายสำหรับคนที่ใช้ตัวสร้างส่วนต่อประสาน Xcode:

  • ง่ายขึ้น: วาง UIImageView ไว้หลังช่องข้อความ

  • ง่ายที่สุด: เปลี่ยนรูปแบบเส้นขอบบนของคุณเป็นสี่เหลี่ยมสีดำแบบง่าย (ตัวเลือกที่สองจากซ้าย) แล้วเพิ่มรูปภาพของคุณเป็นภาพพื้นหลัง ภาพมีความสำคัญเหนือตารางดังนั้นคุณยังคงได้รับการขยายที่จำเป็นสำหรับพื้นหลังภาพปกติโดยไม่ต้องวาดสี่เหลี่ยมจริง ๆ

แก้ไข: คุณยังสามารถใช้ทรงกลมสีดำ (ตัวเลือกที่สามจากซ้ายเมื่อเลือก UITextBox ใน IB) มันไม่สามารถใช้งานได้กับสไตล์ "กราฟิกทรงกลม" ทางขวาสุด


โซลูชันที่ง่ายขึ้นของคุณนั้นเป็นตัวเลือกที่ถูกต้องในบางกรณี แต่โซลูชันที่ง่ายที่สุดของคุณคือการแฮ็คซึ่งไม่สามารถใช้งานได้หากพิกเซลขอบภาพของคุณมีตัวแปรอัลฟ่า (ไม่ต้องพูดถึงว่า Apple สามารถเปลี่ยน
jmdecombe

ฉันไม่เห็นด้วยกับคุณ - นั่นเป็นเหตุผลว่าทำไมฉันถึง "ขี้เกียจง่าย ๆ " ในตัวพิมพ์ใหญ่ทั้งหมด มันใช้ได้ดีสำหรับฉันถึงวันที่
woody121

4

หากใครที่กำลังมองหาSwift 4.0เวอร์ชั่นextensionอยู่ด้านล่างจะใช้ได้ มันมีทั้งLeftและRightpadding UITextFieldสำหรับ จริงๆแล้วมันใช้IBInspectableสำหรับการกำหนดค่าสตอรี่บอร์ด คุณสามารถตั้งค่าได้โดยตรงจาก Interface Builder / Storyboard นี่คือการทดสอบรหัสในรุ่น Swift 4.0 และ Xcode 9.0

โปรดจำไว้ว่าหากคุณต้องการเปิดใช้งานClear ButtonในเวลาเดียวกันUITextFieldคุณต้องทำให้ช่องว่างภายในด้านขวาว่างเปล่า

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     
        }
    }
}  

3

วิธีที่ดีที่สุดในการทำเช่นนี้คือสร้างคลาสโดยใช้คลาสย่อยของ 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 ของคุณและคลิกที่ตัวตรวจสอบตัวตนและแทนที่ UITextfield ด้วย "CustomTextField" ของคุณเองในตัวเลือกชั้นเรียน

หมายเหตุ: หากคุณให้การเติมเต็มด้วยเลย์เอาต์อัตโนมัติสำหรับฟิลด์ข้อความแอปพลิเคชันของคุณจะไม่ทำงานและแสดงหน้าจอว่างเปล่าเท่านั้น


3

เวอร์ชั่น Swift 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)
    }
}

2

คำตอบของ 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))
}

รหัสข้างต้นตั้งค่าที่เหมาะสมสำหรับการขยายของrightViewUITextField


2

โซลูชัน Swift 3

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)
 }
}

2

นี่คือรหัสสวิฟท์เพื่อให้ช่องว่างภายใน UITextfield

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

และโทรโดยใช้

self.txtPaddingVw(txtPin)

2

คุณสามารถใช้หมวดหมู่ ตั้งช่องว่างภายในไปทางซ้ายและขวา

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;


1

@Evil คำตอบของปลาเทราท์ที่ดี ฉันใช้วิธีนี้มาระยะหนึ่งแล้ว สิ่งเดียวที่ขาดคือ "การจัดการกับฟิลด์ข้อความจำนวนมาก" ฉันลองวิธีอื่น แต่ดูเหมือนจะไม่ทำงาน

การจัดคลาสย่อย UITextField เพียงเพื่อเพิ่มช่องว่างภายในนั้นไม่สมเหตุสมผลเลยสำหรับฉัน ดังนั้นฉันทำซ้ำมากกว่า UITextFields ทั้งหมดเพื่อเพิ่มการขยาย

-(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]];
        }
    }
}

วิธีการสามารถเรียกได้โดย [ตนเอง addPaddingToAllTextFields: [มุมมองตนเอง]];
Kishor Kundan

เนื่องจากtextfieldarrayไม่ได้กำหนดไว้ในที่สองifบล็อกฉันจึงใช้ข้อมูลโค้ดนี้ (ขอบคุณ!) ด้วยความสำเร็จหลังจากแทนที่เนื้อหาของวินาทีifด้วยfor(id subSubView in [view subviews]){[self addPaddingToAllTextFields:subSubView];}
adamup

1

โซลูชันของ Brody ทำงานได้สมบูรณ์แบบสำหรับฉัน ฉันต้องเพิ่มมุมมองด้านข้างในฟิลด์ข้อความและเพิ่มช่องว่างภายในเพิ่มเติม ดังนั้นโดยการนำคุณสมบัติ UIEdgeInsets ที่กำหนดเองไปใช้กับคลาสย่อย UITextField ฉันมีการจัดการเพื่อให้งานสำเร็จ ฉันจะใช้คลาสย่อยใหม่นี้ในทุกโครงการของฉัน


1

ทางออกที่ดีที่สุดที่ฉันพบคือหมวดหมู่ นั่นคือวิธีที่ฉันเพิ่ม 5 คะแนน padding ไปทางซ้ายและขวา:

@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

# pragma's ใช้เพื่อลบคำเตือนที่น่ารำคาญ


สิ่งที่มีวิธีการมากไปในหมวดหมู่คือมันจะถูกทำเครื่องหมายเป็นไม่ได้ใช้ใน AppCode ซึ่งเป็นจริง ความคิดที่ดี แต่ไม่ปลอดภัยมากเพราะจะถูกลบออกได้อย่างง่ายดายเมื่อคุณเรียกใช้ "เพิ่มประสิทธิภาพการนำเข้า" (ไม่มีปัญหาสำหรับผู้ใช้ Xcode แต่เราทุกคนรู้คุณลักษณะที่ จำกัด รหัสเป็นศูนย์กลาง)
Sebastian Wramba

1
มันเป็นหมวดหมู่คนเกียจคร้านง่ายๆที่จะใช้การขยายสำหรับช่องข้อความทั้งหมดในแอพไหม
เบ็นซินแคลร์

@ ไม่ต้องใช้เฉพาะเมื่อคุณนำเข้าคุณจะต้องสร้างคลาส UITextField + แพ็ดดิ้งและนำเข้าใน viewcontroller หรือคลาสที่คุณมีฟิลด์ข้อความพร้อมช่องว่างอยู่
Mongi Zaidi

@MongiZaidi: คุณผิด มันได้รับการเชื่อมโยงไปยังสิ่งที่เรียกว่าการนำเข้านั้นไม่เกี่ยวข้องหรือไม่
Zsolt Szatmari

1
textField.layer.borderWidth = 3;

จะเพิ่มเส้นขอบซึ่งทำงานเป็นแพ็ดดิ้งสำหรับฉัน


0

ข้อควรพิจารณาอีกประการหนึ่งคือถ้าคุณมีมากกว่าหนึ่งUITextFieldที่ที่คุณกำลังเพิ่มการขยายคือการสร้างแยกต่างหากUIViewสำหรับแต่ละฟิลด์ข้อความ - เนื่องจากไม่สามารถแบ่งปันได้

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.