iOS 引导图模板

一、废话不多说，直接上效果

• 实际使用效果

  
  引导页gif.gif

二、Demo址

• Demo效果

demoguide.gif

三、功能

1、便捷实现引导图，均采用缕空模式
2、支持一次性出现一个或多个提示
3、支持顺序出现引导提示功能且不限制最大连续出现的数量
4、自带动画效果

四、使用方式

在Demo中，需要关注的类有WKStepMaskGuideView以及WKStepMaskModel，它们均位于WKStepMaskGuideView.h文件中。

1、WKStepMaskModel

作用：构建WKStepMaskGuideView所必须的实例类

///首先构建一个模型，圆角度
@interface WKStepMaskModel : NSObject

///基于keywindow的frame
@property (nonatomic, assign) CGRect frame;
@property (nonatomic, strong) UIView * view;
@property (nonatomic, assign) CGFloat cornerRadius;
@property (nonatomic, assign) NSUInteger step;

///推荐使用此方法 计算好frame传入
+ (instancetype)creatModelWithFrame:(CGRect)frame cornerRadius:(CGFloat)cornerRadius step:(NSUInteger)step;
///推荐使用withframe方法初始化 如若传入view  只会取此view对应其俯视图的frame，如果布局层级过深可能会有差错。
+ (instancetype)creatModelWithView:(UIView *)view cornerRadius:(CGFloat)cornerRadius step:(NSUInteger)step;

@end

构建此model时，view和frame可以都设置值，首先以frame计算，在注释中也写了原因，因为传入view获取frame时可能不准确。

cornerradius顾名思义，构建view对应的缕空时的圆角度。

step标识此view于何时显示--->构建maskguideview时根据传入的model中step由小至大依次显示。

2、WKStepMaskGuideView

作用：带顺序的缕空引导视图的基类，你的引导图必须继承自它。

它有且仅有一个初始化方法，必须使用此方法初始化它。

@interface WKStepMaskGuideView : WKKMBaseGuideView

@property (nonatomic, strong, readonly) NSMutableArray<UIView *> * views;
@property (nonatomic, strong, readonly) NSMutableArray<NSValue *> * rects;
@property (nonatomic, strong, readonly) NSMutableArray<NSNumber *> * steps;
@property (nonatomic, weak  ) id<WKStepMaskGuideViewDelegate> delegate;
///models中的model的step可以无序，内部会进行排序，生成的views根据step排序
- (instancetype)initWithModels:(NSArray <WKStepMaskModel *> *)models;


///子类覆写
- (void)configInterFace;
///此方法 先调用与代理方法 willchange
- (void)viewWillEnterNextStep:(NSUInteger)nextStep;
- (void)viewDidEnterNextStep:(NSUInteger)nextStep;
@end

当你构建它的子类时，你可以覆写的方法有以下七个：

- (void)configInterFace;
- (void)viewWillShow;
- (void)viewDidShow;
- (void)viewWillDismiss;
- (void)viewDidDismiss;
- (void)viewWillEnterNextStep:(NSUInteger)nextStep;
- (void)viewDidEnterNextStep:(NSUInteger)nextStep;

这里只简要介绍一下configInterFace方法，因其他方法均顾名思义。

其中configInterFace，你的guideview中包含的提示信息所需要的view在此构建以及布局。布局时，有一个要点是为UIView添加的wk_steptag属性，此处简要概述其作用：

缕空的view具备wk_steptag属性（你不能去设置此值，此值在内部也被设置好），如果需要和缕空的view一起出现的提示性view的wk_steptag属性应和其有一样的值。例如A为缕空的view，x,y,z为需要和其一起出现的提示性view，则x,y,z的wk_steptag值等于view的wk_steptag。注：再次强调不能去设置缕空view的wk_steptag值。

具体的使用例子，请参照Demo