textField佔位圖片

1、咱們一般在設計登陸界面時會用到UITextField，以下圖所示：

一般想實現下面幾點：

一、左邊顯示圖片

二、textField中添加默認的佔位符（提示文字），而且但願佔位符和左邊圖片有一點的距離，或者讓佔位符居中，

三、點擊textField輸入時光標的位置應該緊在佔位符左側，並緊挨着佔位符

最終實現效果以下圖所示：

2、左邊顯示圖片很簡單下面幾行代碼搞定（右邊顯示圖片同理）：

UIImageView *passwordImage = [[UIImageView alloc] initWithImage:[UIImageimageNamed:@"passwordIcon"]];
    password.leftView = passwordImage;

    password.leftViewMode = UITextFieldViewModeAlways;

友情提示：上下兩個圖片的寬度要保持一致，否則會致使佔位符的左邊沒法對其！

 

3、而設置佔位符的位置和編輯狀態時光標的位置試了不少方法感受都很差使，最終找到一個方法，自定義一個basicTextField繼承自UITextField；而後能夠重寫下面的幾個方法：

- (CGRect)borderRectForBounds:(CGRect)bounds;
- (CGRect)textRectForBounds:(CGRect)bounds;
- (CGRect)placeholderRectForBounds:(CGRect)bounds;
- (CGRect)editingRectForBounds:(CGRect)bounds;
- (CGRect)clearButtonRectForBounds:(CGRect)bounds;
- (CGRect)leftViewRectForBounds:(CGRect)bounds;

- (CGRect)rightViewRectForBounds:(CGRect)bounds;

 

2、下面是具體的代碼實現：

#import "basicTextField.h"

@implementation basicTextField

- (CGRect)leftViewRectForBounds:(CGRect)bounds{
    CGRect iconRect = [super leftViewRectForBounds:bounds];
    iconRect.origin.x += 10;
    return iconRect;
}

 

//  重寫佔位符的x值

- (CGRect)placeholderRectForBounds:(CGRect)bounds{
    CGRect placeholderRect = [super placeholderRectForBounds:bounds];
    placeholderRect.origin.x += 1;
    return placeholderRect;

}

//  重寫文字輸入時的X值
- (CGRect)editingRectForBounds:(CGRect)bounds{
    CGRect editingRect = [super editingRectForBounds:bounds];
    editingRect.origin.x += 20;
    return editingRect;
}

//  重寫文字顯示時的X值
- (CGRect)textRectForBounds:(CGRect)bounds{
    CGRect textRect = [super editingRectForBounds:bounds];
    textRect.origin.x += 20;
    return textRect;
}

@end

 

4、這裏有一個坑：就是當你同時重寫這三個方法時，同時設置他們X的偏移量時會發現運行結果以下圖。

//  重寫佔位符的X值

- (CGRect)placeholderRectForBounds:(CGRect)bounds{

    CGRect placeholderRect = [super placeholderRectForBounds:bounds];

    placeholderRect.origin.x += 80;

    return placeholderRect;

}

看上圖能夠發現當點擊textField使其處於輸入狀態時，光標和文字中間有間隔；這個間隔實際上是佔位符的偏移量80，由於咱們設置了輸入狀態時光標的偏移量爲20，佔位符是80。而光標的偏移量是根據leftView的算的，佔位符的偏移量是根據光標的位置算的。因此設置佔位符偏移量爲1是最合適的。至於其它的方法根據實際須要重寫便可。