iOS7上的UITextfield leftView/rightView填充

iOS7上的UITextField的leftView和rightView視圖非常接近文本框邊框。iOS7上的UITextfield leftView/rightView填充

我該如何爲這些項目添加一些（水平）填充？

我試圖修改框架，但沒有奏效

uint padding = 10;//padding for iOS7 
UIImageView * iconImageView = [[UIImageView alloc] initWithImage:iconImage];  
iconImageView.frame = CGRectMake(0 + padding, 0, 16, 16); 
textField.leftView = iconImageView;

請注意，我不感興趣，在添加填充到文本框的文本，這樣Set padding for UITextField with UITextBorderStyleNone

來源

2013-10-14 subzero

的可能重複[插圖文字爲UITextField？]（http://stackoverflow.com/questions/2694411/text-inset-for-uitextfield） – Zorayr

無，這是詢問如何在文本字段中縮進顯示爲左視圖的圖像。不縮進文本本身。試試他的代碼，你會發現將leftView設置爲一個圖像可以將圖像放置在文本字段的左邊緣，而不需要填充。它看起來很醜。 – stone

只是在做這個我和使用該解決方案的RECT：

- (CGRect) rightViewRectForBounds:(CGRect)bounds { 

    CGRect textRect = [super rightViewRectForBounds:bounds]; 
    textRect.origin.x -= 10; 
    return textRect; 
}

這將將圖像從右側移過10，而不是將圖像擠壓到iOS 7的邊緣。

此外，這是在的子類中10，可通過以下方式創建：

創建一個新的文件，該文件的UITextField而不是默認的一個子類NSObject

添加一個名爲- (id)initWithCoder:(NSCoder*)coder設置圖像

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

    if (self) { 

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

     self.leftView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"textfield_edit_icon.png"]]; 
    } 

    return self; 
}

新方法您可能需要導入#import <QuartzCore/QuartzCore.h>
添加rightViewRectForBounds以上方法
在Interface Builder中，點擊文本字段要繼承和改變階級屬性這個新的子類

來源

2013-10-15 04:10:04 AngeloS

如何使用IBDesignable進行相同？ – riddhi

我發現這個地方。 ...

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

[self addSubview:itemDescription];

來源

2013-10-14 23:45:06 RegularExpression

這只是向文本添加填充，而不是提問者正在尋找的內容。他不想要一個清晰的左視圖。他希望將圖像顯示爲leftView。 – stone

創建一個自定義的UITextField類並使用該類而不是UITextField。覆蓋 - （的CGRect）textRectForBounds：（的CGRect）邊界設置，你需要

例

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

來源

2013-10-15 00:23:11 Kedar

這裏的名字是一個解決辦法：

UIView *paddingTxtfieldView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 20, 42)]; // what ever you want 
txtfield.leftView = paddingTxtfieldView; 
txtfield.leftViewMode = UITextFieldViewModeAlways;

來源

2013-10-15 05:32:29

一技巧：將包含UIImageView的UIView作爲rightView添加到UITextField中。這個UIView的大小必須更大，現在將UIImageView放在它的左邊。所以會有從右側填充的空間。

// Add a UIImageView to UIView and now this UIView to UITextField - txtFieldDate 
UIView *viewRightIntxtFieldDate = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 20, 30)]; 
// (Height of UITextField is 30px so height of viewRightIntxtFieldDate = 30px) 
UIImageView *imgViewCalendar = [[UIImageView alloc] initWithFrame:CGRectMake(0, 10, 10, 10)]; 
[imgViewCalendar setImage:[UIImage imageNamed:@"calendar_icon.png"]]; 
[viewRightIntxtFieldDate addSubview:imgViewCalendar]; 
txtFieldDate.rightViewMode = UITextFieldViewModeAlways; 
txtFieldDate.rightView = viewRightIntxtFieldDate;

來源

2014-01-14 11:38:42

我在我的ViewController類中創建一個自定義的方法，如所示波紋管：

- (void) modifyTextField:(UITextField *)textField 
{ 
    // Prepare the imageView with the required image 
    uint padding = 10;//padding for iOS7 
    UIImageView * iconImageView = [[UIImageView alloc] initWithImage:iconImage];  
    iconImageView.frame = CGRectMake(0 + padding, 0, 16, 16); 

    // Set the imageView to the left of the given text field. 
    textField.leftView = iconImageView; 
    textField.leftViewMode = UITextFieldViewModeAlways; 
}

現在我可以調用這個方法裏面（viewDidLoad方法），並送我的任何TextFields該方法並添加通過編寫一行代碼給文本和背景顏色，如下所示：

[self modifyTextField:self.firstNameTxtFld];

This Worked perfectl y在iOS 7上！希望這仍然適用於iOS 8和9！

我知道添加太多視圖可能會使這個有點重的對象被加載。但是當擔心其他解決方案中的困難時，我發現自己更偏向於這種方法，並且使用這種方法更靈活。 ;）

希望這個答案可能是有用的或有用的找出別人的另一種解決方案。

乾杯！

來源

2014-03-18 05:38:40

133

一個更簡單的解決方案，這需要的contentMode優點：

arrow = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"down_arrow"]]; 
    arrow.frame = CGRectMake(0.0, 0.0, arrow.image.size.width+10.0, arrow.image.size.height); 
    arrow.contentMode = UIViewContentModeCenter; 

    textField.rightView = arrow 
    textField.rightViewMode = UITextFieldViewModeAlways;

在夫特2，

let arrow = UIImageView(image: UIImage(named: "down_arrow")) 
    arrow.frame = CGRectMake(0.0, 0.0, arrow.image.size.width+10.0, arrow.image.size.height); 
    arrow.contentMode = UIViewContentMode.Center 
    self.textField.rightView = arrow 
    self.textField.rightViewMode = UITextFieldViewMode.Always

在夫特3，

let arrow = UIImageView(image: UIImage(named: "arrowDrop")) 
    if let size = arrow.image?.size { 
     arrow.frame = CGRect(x: 0.0, y: 0.0, width: size.width + 10.0, height: size.height) 
    } 
    arrow.contentMode = UIViewContentMode.center 
    self.textField.rightView = arrow 
    self.textField.rightViewMode = UITextFieldViewMode.always

來源

2014-06-24 13:53:41 TTillage

我很喜歡這個。最簡單的一個在這裏 – volk

您也可以使用ScaleAspectFit而不是中心...如果圖像的大小與確切的框架不匹配。 –

我用你的例子爲UIButton（而不是UIImageView），而它的類型是InfoLight。 – OhadM

最簡單的方法是添加一個UIView到leftView/righView並添加一個ImageView到UIView，調整ImageView在UIView裏的起源艾克，這對我來說很有魅力。它只需要幾行代碼

UIImageView *imgView = [[UIImageView alloc] initWithFrame:CGRectMake(10, 5, 26, 26)]; 
imgView.image = [UIImage imageNamed:@"img.png"]; 

UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 32, 32)]; 
[paddingView addSubview:imgView]; 
[txtField setLeftViewMode:UITextFieldViewModeAlways]; 
[txtField setLeftView:paddingView];

來源

2014-06-27 11:48:15

快速簡單的實施！ –

下面的例子是添加水平填充到恰好是一個圖標左視圖 - 您可以使用類似的方法添加填充到您想使用的任何UIView作爲文本框的左側視圖。

內UITextField子類：

static CGFloat const kLeftViewHorizontalPadding = 10.0f; 

@implementation TextFieldWithLeftIcon 
{ 
    UIImage *_image; 
    UIImageView *_imageView; 
} 

- (instancetype)initWithFrame:(CGRect)frame image:(UIImage *)image 
{ 
    self = [super initWithFrame:frame]; 
    if (self) { 
    if (image) { 
     _image = image; 
     _imageView = [[UIImageView alloc] initWithImage:image]; 
     _imageView.contentMode = UIViewContentModeCenter; 
     self.leftViewMode = UITextFieldViewModeAlways; 
     self.leftView = _imageView; 
    } 
    } 
    return self; 
} 

#pragma mark - Layout 

- (CGRect)leftViewRectForBounds:(CGRect)bounds 
{ 
    CGFloat widthWithPadding = _image.size.width + kLeftViewHorizontalPadding * 2.0f; 
    return CGRectMake(0, 0, widthWithPadding, CGRectGetHeight(bounds)); 
}

雖然我們是一個子類UITextField這裏，我相信這是最乾淨的方法。

來源

2014-12-23 00:03:00 Zorayr

我喜歡這個解決方案，因爲它有一個單一的代碼行

myTextField.layer.sublayerTransform = CATransform3DMakeTranslation(10.0f, 0.0f, 0.0f);

注意解決這個問題：..或2如果你考慮包括QuartzCore行:)

來源

2014-12-24 11:01:22

這也移動了邊界 – Softlion

，但並沒有解決問題，只填補了左填充問題 –

我使用rightView.layer獲得了更好的結果。sublayerTransform = CATransform3DMakeTranslation（-10.0f，0.0f，0.0f），但方法 –

做的最好的方法這只是讓一類使用的UITextField

#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; 

}

，並在.m文件子做這個去你的故事板或XIB並單擊身份檢查和更換的UITextField與您可以在課程選項中使用您自己的「CustomTextField」。

注意：如果您只是使用文本字段的自動佈局填充填充，那麼您的應用程序將不會運行並只顯示空白屏幕。

來源

2015-03-19 08:26:48

- (CGRect)rightViewRectForBounds:(CGRect)bounds 
{ 
    return CGRectMake(bounds.size.width - 40, 0, 40, bounds.size.height); 
}

來源

2015-04-21 09:59:27

如果'UITextField'嵌入在'UISearchBar'中，你如何告訴UISearchBar使用你的'UITextField'子類？ – crishoj

請爲此問題啓動一個新線程 –

感謝你們的答案，讓我吃驚的沒有真的他們安裝在右視圖圖像到我的文本框，同時仍然提供所需的填充。然後我想到了使用AspectFill模式和奇蹟發生。對於未來的求職者，這是我用什麼：

UIImageView *emailRightView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 35, 35)]; 
emailRightView.contentMode = UIViewContentModeScaleAspectFill; 
emailRightView.image = [UIImage imageNamed:@"icon_email.png"]; 
emailTextfield.rightViewMode = UITextFieldViewModeAlways; 
emailTextfield.rightView = emailRightView;

在我的ImageView的框架35代表我emailTextfield的高度，隨意將其調整到您的需要。

來源

2015-05-14 19:32:07 carlos16196

這對於斯威夫特的偉大工程：

let imageView = UIImageView(image: UIImage(named: "image.png")) 
imageView.contentMode = UIViewContentMode.Center 
imageView.frame = CGRectMake(0.0, 0.0, imageView.image!.size.width + 20.0, imageView.image!.size.height) 
textField.rightViewMode = UITextFieldViewMode.Always 
textField.rightView = imageView

來源

2015-07-31 17:08:00

不能將'string'類型的值轉換爲期望的參數類型'UIImage？' –

@JoshuaHart我更新了示例。 –

這對我的作品

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

願它可以幫助你。

來源

2015-08-01 04:57:14 Ashu

我自己也有這個問題，到目前爲止，最簡單的解決方案是修改圖像，以簡單地添加填充圖像的每一面！

我只是改變了我的PNG圖像添加10像素透明填充，它運作良好，根本沒有編碼！

來源

2015-08-13 21:11:50 Richard

如果您正在使用一個UIImageView作爲leftView那麼你已經使用此代碼：

注意：裏面viewWillAppear中斯威夫特viewDidAppear

-(UIView*)paddingViewWithImage:(UIImageView*)imageView andPadding:(float)padding 
{ 
    float height = CGRectGetHeight(imageView.frame); 
    float width = CGRectGetWidth(imageView.frame) + padding; 

    UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, width, height)]; 

    [paddingView addSubview:imageView]; 

    return paddingView; 
}

來源

2015-09-20 19:30:11 Xeieshan

-1

簡單的代碼，請不要使用或：

let paddleView:UIView = UIView(frame: CGRect(x:0, y:0, width:8, height:20)) 
uiTextField.leftView = paddleView 
uiTextField.leftViewMode = UITextFieldViewMode.Always

來源

2015-12-23 08:51:51

最簡單的方法就是將文本框更改爲RoundRect而不是自定義並查看魔術。 :)

來源

2016-03-17 12:25:12 Shilpa

爲Swift2，我用

... 
     self.mSearchTextField.leftViewMode = UITextFieldViewMode.Always 
     let searchImg = UIImageView(image: UIImage(named: "search.png")) 
     let size = self.mSearchTextField.frame.height 
     searchImg.frame = CGRectMake(0, 0, size,size) 
     searchImg.contentMode = UIViewContentMode.ScaleAspectFit 
     self.mSearchTextField.leftView = searchImg 
...

來源

2016-05-23 15:07:57 Haiyuan

iOS7上的UITextfield leftView/rightView填充

回答

相關問題