天天看點

如何實作在TextView使用占位符(placeholder)

近期在開發中遇到了一個需求,就是要在textView中添加一個占位符,類似于textField的placeholder,但是經過查詢,發現textView并沒有placeholder屬性。 随意隻能自己重寫了。其實原理很簡單,分為兩步

  • 1、建立一個label加入textView中。
  • 2、判斷狀态,如果在輸入,就隐藏label。

其實主要就是這兩步,我們接下來就開始封裝一個類,來實作這個功能。

建立一個類內建UITextView

定義兩個屬性

//這裡接收占位符的字元串
@property (nonatomic, copy) NSString *placeHolder;
//用來判斷是否隐藏占位符的label
@property (nonatomic, assign) BOOL hidenPlaceHolder;
           

首先自然是要先懶加載一個UILabel

Q:為什麼這個UIlabel要懶加載

A:如果不懶加載,否則,沒設定一次就會加載一次,造成記憶體浪費

//在分類中添加一個uiLabel屬性
@interface XXTextView ()

@property (nonatomic, weak) UILabel *placeHolderLabel;

@end
           

然後重寫這個Label的get屬性,即懶加載:

//懶加載這個Label
-(UILabel *)placeHolderLabel{
    if (_placeHolderLabel == nil) {
        //建立label
        UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(, , , )];
        label.textColor = [UIColor lightGrayColor];
        //給label指派
        _placeHolderLabel = label;

        //将label顯示在試圖上
        [self addSubview:label];

    }

    return _placeHolderLabel;
}
           

接下來在在實作檔案中重寫placeholder屬性的set方法:

//重寫placeholder的set方法
-(void)setPlaceHolder:(NSString *)placeHolder{
    _placeHolder = placeHolder;

    self.placeHolderLabel.text = placeHolder;
    //邊界根據内容自适應
    [self.placeHolderLabel sizeToFit];

}
           

但是運作時發現,占位符的字号和即将輸入的字号不同,這個時候我們就要調整Label的字條,使UILabel的字号和占位符的字号一緻。

為了不造成資源浪,我們重寫intwithFrame方法,在其中設定光标的字号,代碼如下:

//預設調整字号為16
-(instancetype)initWithFrame:(CGRect)frame{
    if (self = [super initWithFrame:frame]) {
        self.font = [UIFont systemFontOfSize:];
        self.placeHolderLabel.font = self.font;
    }
    return self;
}
           

這樣,是不是就重合了呢,第一步就完成了,接下來就要實作隐藏功能了。

重寫hidenplaceholder的set方法:

//重寫hidenplaceholder的set方法
- (void)setHidenPlaceHolder:(BOOL)hidenPlaceHolder{

    _hidenPlaceHolder = hidenPlaceHolder;
    self.placeHolderLabel.hidden = hidenPlaceHolder;

}
           

然後在你建立textView的時候進行判斷。如果監聽到輸入,就隐藏Label,這個時候就要用到通知了。

自然,第一步,訂閱通知:

//訂閱通知
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(textChange) name:UITextViewTextDidChangeNotification object:nil];
           

然後我們實作這個textChange方法就可以了

- (void)textChange{
    [self becomeFirstResponder];

    if (_textView.text.length) { //有内容
        _textView.hidenPlaceHolder = YES;
    }else{
        _textView.hidenPlaceHolder = NO;
    }
}
           

訂閱了通知,記得退訂通知

-(void)dealloc{
    [[NSNotificationCenter defaultCenter] removeObserver:self];
}
           

這樣。封裝一個TextView類的占位符功能就完成了。下次如果還要使用,直接導入.h和.m檔案就可以使用了。

可能描述的不是很清楚。詳細代碼如下

XXTextView.h

#import <UIKit/UIKit.h>

@interface middleViewController : UIViewController

@end
           

XXTextView.m

#import "XXTextView.h"

@interface XXTextView ()

@property (nonatomic, weak) UILabel *placeHolderLabel;

@end

@implementation XXTextView

-(instancetype)initWithFrame:(CGRect)frame{
    if (self = [super initWithFrame:frame]) {
        self.font = [UIFont systemFontOfSize:];
        _placeHolderLabel.font = self.font;
    }
    return self;
}
-(UILabel *)placeHolderLabel{
    if (_placeHolderLabel == nil) {
        //建立label
        UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(, , , )];
        label.textColor = [UIColor lightGrayColor];
        //給label指派
        _placeHolderLabel = label;

        //将label顯示在試圖上
        [self addSubview:label];

    }

    return _placeHolderLabel;
}

- (void)setHidenPlaceHolder:(BOOL)hidenPlaceHolder{

    _hidenPlaceHolder = hidenPlaceHolder;
    self.placeHolderLabel.hidden = hidenPlaceHolder;

}
-(void)setPlaceHolder:(NSString *)placeHolder{
    _placeHolder = placeHolder;

    self.placeHolderLabel.text = placeHolder;
    //邊界根據内容自适應
    [self.placeHolderLabel sizeToFit];

}

- (void)setFont:(UIFont *)font{
    [super setFont:font];

    _placeHolderLabel.font = font;
    [_placeHolderLabel sizeToFit];
}
@end
           

接下來在ViewController中建立一個UITextView

XXTextView *textView = [[XXTextView alloc] initWithFrame:[UIScreen mainScreen].bounds];
    _textView = textView;

    //設定占位符
    textView.placeHolder = @"快記錄今天的心情吧";
    [self.view addSubview:textView];

    //訂閱通知
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(textChange) name:UITextViewTextDidChangeNotification object:nil];
           

如果寫得不好,或者有問題,請聯系作者修正

繼續閱讀