你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發綜合 >> IOS完成輸出驗證碼、暗碼按位朋分(二)

IOS完成輸出驗證碼、暗碼按位朋分(二)

編輯:IOS開發綜合

本文供給了完成IOS完成輸出驗證碼、暗碼按位朋分的一種思緒,分享給年夜家供年夜家參考,願望與年夜家配合交換。

1、完成思緒
1、思緒描寫

  • 自界說一個view,繼續自UIView
  • 在view中添加子控件textField,backgroundImageView,label
  • 將驗證碼/暗碼的內容繪制到label的指定區域(盤算獲得),所以label要自界說,在drawRect辦法中繪制驗證碼
  • 應用一個屬性secureTextEntry,來掌握顯示驗證碼(顯示真實的數字)或暗碼(顯示圓點)

2、視圖中的子控件

  • textField:只擔任彈出鍵盤,獲得鍵盤輸出的數據;不消於演示鍵盤輸出的內容,現實是隱蔽的
  • backgroundImageView:顯示完成朋分後果的配景圖片
  • label:顯示驗證碼或暗碼的內容

3、控件之間的關系
如圖:

  • 編號“1”:父視圖(vertificationCodeInputView)
  • 編號“2”:子視圖(textField)
  • 編號“3”:子視圖(backgroundImageView)
  • 編號“4”:子視圖(label)
  • 圖片起源於Xcode的調試對象

層級關系

  • label用於顯示驗證碼的內容,必需在最上邊
  • backgroundImageView顯示配景圖片,所以必需在label的後邊,且可以顯示出來

2、完成後果
暗碼輸出後果

驗證碼輸出後果

3、完成步調
代碼構造
如圖:

1、IDVertificationCodeInputView(編號“1”視圖)的的屬性

私有屬性(vertificationCodeInputView的相干屬性)

@interface IDVertificationCodeInputView : UIView
/**配景圖片*/
@property (nonatomic, copy) NSString *backgroudImageName;
/**驗證碼/暗碼的位數*/
@property (nonatomic, assign) NSInteger numberOfVertificationCode;
/**掌握驗證碼/暗碼能否密文顯示*/
@property (nonatomic, assign) bool secureTextEntry;
/**驗證碼/暗碼內容,可以經由過程該屬性拿到驗證碼/暗碼輸出框中驗證碼/暗碼的內容*/
@property (nonatomic, copy) NSString *vertificationCode;
@end

公有屬性(vertificationCodeInputView的子控件)

@interface IDVertificationCodeInputView () <UITextFieldDelegate>
/**用於獲得鍵盤輸出的內容,現實不顯示*/
@property (nonatomic, strong) UITextField *textField;
/**驗證碼/暗碼輸出框的配景圖片*/
@property (nonatomic, strong) UIImageView *backgroundImageView;
/**現實用於顯示驗證碼/暗碼的label*/
@property (nonatomic, strong) IDLabel *label;
@end

2、IDLabel(編號“4”視圖)的屬性

私有屬性

@interface IDLabel : UILabel
/**驗證碼/暗碼的位數*/
@property (nonatomic, assign) NSInteger numberOfVertificationCode;
/**掌握驗證碼/暗碼能否密文顯示*/
@property (nonatomic, assign) bool secureTextEntry;
@end

3、營業邏輯

vertificationCodeInputView的初始化

  • 設置驗證碼/暗碼的默許位數(4位),添加textField和label
- (instancetype)initWithFrame:(CGRect)frame {
  if (self = [super initWithFrame:frame]) {
    // 設置通明配景色,包管vertificationCodeInputView顯示的frame為backgroundImageView的frame
    self.backgroundColor = [UIColor clearColor];
    // 設置驗證碼/暗碼的位數默許為四位
    self.numberOfVertificationCode = 4;
    /* 調出鍵盤的textField */
    self.textField = [[UITextField alloc] initWithFrame:self.bounds];
    // 隱蔽textField,經由過程點擊IDVertificationCodeInputView使其成為第一呼應者,來彈出鍵盤
    self.textField.hidden = YES;
    self.textField.keyboardType = UIKeyboardTypeNumberPad;
    self.textField.delegate = self;
    // 將textField放到最初邊
    [self insertSubview:self.textField atIndex:0];
    /* 添加用於顯示驗證碼/暗碼的label */
    self.label = [[IDLabel alloc] initWithFrame:self.bounds];
    self.label.numberOfVertificationCode = self.numberOfVertificationCode;
    self.label.secureTextEntry = self.secureTextEntry;
    self.label.font = self.textField.font;
    [self addSubview:self.label];
  }
  return self;
}
  • 若設置了配景圖片,須要將backgroundImageView添加進vertificationCodeInputView
- (void)setBackgroudImageName:(NSString *)backgroudImageName {
  _backgroudImageName = backgroudImageName;
  // 若用戶設置了配景圖片,則添加配景圖片
  self.backgroundImageView = [[UIImageView alloc] initWithFrame:self.bounds];
  self.backgroundImageView.image = [UIImage imageNamed:self.backgroudImageName];
  // 將配景圖片拔出到label的後邊,防止遮擋驗證碼/暗碼的顯示
  [self insertSubview:self.backgroundImageView belowSubview:self.label];
}
  • 若設置了驗證碼/暗碼的位數,和能否密文顯示,則須要堅持label中響應屬性與vertificationCodeInputView中分歧
- (void)setNumberOfVertificationCode:(NSInteger)numberOfVertificationCode {
  _numberOfVertificationCode = numberOfVertificationCode;
  // 堅持label的驗證碼/暗碼位數與IDVertificationCodeInputView分歧,此時label必定曾經被創立
  self.label.numberOfVertificationCode = _numberOfVertificationCode;
}
- (void)setSecureTextEntry:(bool)secureTextEntry {
  _secureTextEntry = secureTextEntry;
  self.label.secureTextEntry = _secureTextEntry;
}

4、彈出鍵盤,並吸收鍵盤輸出的字符

彈出鍵盤

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
  [self.textField becomeFirstResponder];
}

吸收鍵盤輸出的字符

- (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string {
  // 斷定是否是“刪除”字符
  if (string.length != 0) {// 不是“刪除”字符
    // 斷定驗證碼/暗碼的位數能否到達預定的位數
    if (textField.text.length < self.numberOfVertificationCode) {
      self.label.text = [textField.text stringByAppendingString:string];
      self.vertificationCode = self.label.text;
      return YES;
    } else {
      return NO;
    }
  } else { // 是“刪除”字符
    self.label.text = [textField.text substringToIndex:textField.text.length - 1];
    self.vertificationCode = self.label.text;
    return YES;
  }
}

5、繪制驗證碼/暗碼(IDLabel)

手動挪用drawRect辦法

//重寫setText辦法,當text轉變時手動挪用drawRect辦法,將text的內容按指定的格局繪制到label上
- (void)setText:(NSString *)text {
  [super setText:text];
  // 手動挪用drawRect辦法
  [self setNeedsDisplay];
}

繪制驗證碼/暗碼

// 依照指定的格局繪制驗證碼/暗碼
- (void)drawRect:(CGRect)rect {
  //盤算每位驗證碼/暗碼的地點區域的寬和高
  float width = rect.size.width / (float)self.numberOfVertificationCode;;
  float height = rect.size.height;
  // 將每位驗證碼/暗碼繪制到指定區域
  for (int i = 0; i < self.text.length; i++) {
    // 盤算每位驗證碼/暗碼的繪制區域
    CGRect tempRect = CGRectMake(i * width, 0, width, height);
    if (self.secureTextEntry) { // 暗碼,顯示圓點
      UIImage *dotImage = [UIImage imageNamed:@"dot"];
      // 盤算圓點的繪制區域
      CGPoint securityDotDrawStartPoint = CGPointMake(width * i + (width - dotImage.size.width) / 2.0, (tempRect.size.height - dotImage.size.height) / 2.0);
      // 繪制圓點
      [dotImage drawAtPoint:securityDotDrawStartPoint];
    } else { // 驗證碼,顯示數字
      // 遍歷驗證碼/暗碼的每一個字符
      NSString *charecterString = [NSString stringWithFormat:@"%c", [self.text characterAtIndex:i]];
      // 設置驗證碼/暗碼的實際屬性
      NSMutableDictionary *attributes = [[NSMutableDictionary alloc] init];
      attributes[NSFontAttributeName] = self.font;
      // 盤算每位驗證碼/暗碼的繪制終點(為了使驗證碼/暗碼位於tempRect的中部,不該該從tempRect的重點開端繪制)
      // 盤算每位驗證碼/暗碼的在指定款式下的size
      CGSize characterSize = [charecterString sizeWithAttributes:attributes];
      CGPoint vertificationCodeDrawStartPoint = CGPointMake(width * i + (width - characterSize.width) / 2.0, (tempRect.size.height - characterSize.height) / 2.0);
      // 繪制驗證碼/暗碼
      [charecterString drawAtPoint:vertificationCodeDrawStartPoint withAttributes:attributes];
    }
  }
}

6、應用示例

在掌握器中創立,並設置vertificationCodeInputView相干屬性

- (void)viewDidLoad {
  [super viewDidLoad];
  self.view.backgroundColor = [UIColor lightGrayColor];
  self.vertificationCodeInputView = [[IDVertificationCodeInputView alloc] initWithFrame:CGRectMake(50, 250, 200, 45)];
  self.vertificationCodeInputView.backgroudImageName = @"1";
  // 驗證碼(顯示數字)
  self.vertificationCodeInputView.secureTextEntry = NO;
  //self.vertificationCodeInputView.secureTextEntry = YES;
  [self.view addSubview:self.vertificationCodeInputView];
}

點擊屏幕,打印驗證碼的內容

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
  NSLog(@"%@", self.vertificationCodeInputView.vertificationCode);
}

以上就是本文的全體內容,願望對年夜家的進修有所贊助。

【IOS完成輸出驗證碼、暗碼按位朋分(二)】的相關資料介紹到這裡,希望對您有所幫助! 提示:不會對讀者因本文所帶來的任何損失負責。如果您支持就請把本站添加至收藏夾哦!

  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved