比來短佩服務商請求公司的app在獲得短信驗證碼時加上校驗碼,今朝比擬風行的是采取相似滑動解鎖的方法,我們公司采用的就是這類方法,設計圖以下所示:
這裡校驗外部的處置邏輯不作引見,重要分享一下界面後果的完成, 上面貼出代碼:
先子類化UISlider
#import <UIKit/UIKit.h> #define SliderWidth 240 #define SliderHeight 40 #define SliderLabelTextColor [UIColor colorWithRed:193/255.0 green:193/255.0 blue:193/255.0 alpha:1] #define SliderLabelBorderColor [UIColor colorWithRed:193/255.0 green:193/255.0 blue:193/255.0 alpha:1].CGColor #define SliderMinimumTrackTintColor [UIColor redColor] #define SliderLabelFont 14 #define SliderLabelText @"滑動解鎖/獲得驗證碼" #define ThumbImageWidth 40 #define ThumbImageHeight 40 @interface CheckCodeSlider : UISlider @end //******************************************************* #import "CheckCodeSlider.h" @implementation CheckCodeSlider //覆寫父類UISlider的辦法轉變滑條frame - (CGRect)trackRectForBounds:(CGRect)bounds{ return CGRectMake(0, 0, SliderWidth, SliderHeight); } @end 再實例化CheckCodeSlider,這裡隨意在一個ViewController裡寫的 #import "ViewController.h" #import "CheckCodeSlider.h" @interface ViewController (){ UIImageView *imgView; } @property (nonatomic ,strong)CheckCodeSlider *slider; @property (nonatomic ,strong)UILabel *label; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; self.view.backgroundColor = [UIColor whiteColor]; [self createSlider]; } - (void)createSlider{ _slider = [[CheckCodeSlider alloc]initWithFrame:CGRectMake(0, 0, SliderWidth, SliderHeight)]; _slider.center = self.view.center; _slider.minimumTrackTintColor = [UIColor clearColor]; _slider.maximumTrackTintColor = [UIColor clearColor]; _slider.layer.masksToBounds = YES; _slider.layer.cornerRadius = SliderHeight/2; [_slider setThumbImage:[UIImage imageNamed:@"滑塊按鈕"] forState:UIControlStateNormal]; [_slider addTarget:self action:@selector(sliderValueChanged:) forControlEvents:UIControlEventValueChanged]; [self.view addSubview:_slider]; _label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, SliderWidth, SliderHeight)]; _label.center = self.view.center; _label.text = SliderLabelText; _label.font = [UIFont systemFontOfSize:SliderLabelFont]; _label.textAlignment = NSTextAlignmentCenter; _label.textColor = SliderLabelTextColor; _label.layer.masksToBounds = YES; _label.layer.cornerRadius = SliderHeight/2; _label.layer.borderWidth = 1; _label.layer.borderColor = SliderLabelBorderColor; [self.view addSubview:_label]; //這裡創立了一個跟滑塊雷同的imageview籠罩在文字下面,並在sliderValueChanged辦法中讓其隨著滑塊滑動。 imgView = [[UIImageView alloc]initWithFrame:CGRectMake(_slider.frame.origin.x-2, _slider.frame.origin.y-2, ThumbImageWidth+4, ThumbImageHeight+4)]; imgView.image = [UIImage imageNamed:@"滑塊按鈕"]; [self.view addSubview:imgView]; } - (void)sliderValueChanged:(UISlider *)slider{ [_slider setValue:slider.value animated:NO]; if (slider.value >0) { _slider.minimumTrackTintColor = SliderMinimumTrackTintColor; }else{ _slider.minimumTrackTintColor = [UIColor clearColor]; } imgView.center = CGPointMake(_slider.frame.origin.x+slider.value*(SliderWidth-ThumbImageWidth)+ThumbImageWidth/2, _slider.frame.origin.y+ThumbImageHeight/2); if (!slider.isTracking && slider.value != 1) { [_slider setValue:0 animated:YES]; if (slider.value >0) { _slider.minimumTrackTintColor = SliderMinimumTrackTintColor; }else{ _slider.minimumTrackTintColor = [UIColor clearColor]; } imgView.frame = CGRectMake(_slider.frame.origin.x-2, _slider.frame.origin.y-2, ThumbImageWidth+4, ThumbImageHeight+4); } }
如許便可以完成上圖中的後果,只須要在sliderValueChanged依據slider的value值做響應處置就好了。
以上所述是小編給年夜家引見的IOS滑動解鎖、滑動獲得驗證碼後果的完成代碼,願望對年夜家有所贊助!
【iOS滑動解鎖、滑動獲得驗證碼後果的完成代碼】的相關資料介紹到這裡,希望對您有所幫助! 提示:不會對讀者因本文所帶來的任何損失負責。如果您支持就請把本站添加至收藏夾哦!