iOS新手引导--GuideImageView(一)

0.212字数 492阅读 501

github:https://github.com/woaiyouxi0803/GuideImageView 好用欢迎点🌟Star~
iOS新手引导--GuideImageView(一)
iOS新手引导--GuideImageView(二)
iOS新手引导--GuideImageView(三)
新增了镂空效果(见三)

一、起因

引导页是用户的第一印象。项目更新迭代快,引导页自然会随之改变。
所以要封装好方法,一劳永逸啊!


二、效果图

不多说,直接看图

支持tabbarItem
新增镂空效果

三、GuideImageView

下载demo更好了解使用方法。https://github.com/woaiyouxi0803/GuideImageView 好用欢迎点🌟Star~

常用方法:

一、主要用于普通View

- (void)addGuideWithMaskView:(UIView*)maskView imageName:(NSString*)imageName imageSize:(CGSize)imageSize maskImageRect:(CGRect)maskImageRect confirmRect:(CGRect)confirmRect clickBlock:(GuideImageViewClickBlock)clickBlock;

这里解释下maskImageRect和confirmRect。

image

maskImageRect和confirmRect都是 图片中的相对坐标系

高亮部分为maskImageRect,上图中为(180, 0 ,110 ,40)

确认部分为confirmRect,上图为( 50 , 207 , 120 , 40)

demo中使用方法为

[[[GuideImageView alloc] init] addGuideWithMaskView:view imageName:@"Group1" imageSize:CGSizeMake(289, 247) maskImageRect:CGRectMake(180, 0, 110, 40) confirmRect:CGRectMake(50, 207, 120, 40) clickBlock:clickBlock];

点击maskImageRect和maskImageRect都会有clickBlock
并且confirmRect的位置会[self removeFromSuperview]移除视图


二、对于UITabBarItem,则根据下面方法

- (void)addGuideWithTabBarItemIndex:(NSUInteger)index imageName:(NSString*)imageName imageSize:(CGSize)imageSize maskImageRect:(CGRect)maskImageRect confirmRect:(CGRect)confirmRect clickBlock:(GuideImageViewClickBlock)clickBlock;
demo:
[[[GuideImageView alloc] init] addGuideWithTabBarItemIndex:index imageName:@"Group4" imageSize:CGSizeMake(218, 313) maskImageRect:CGRectMake(20, 255, 60, 58) confirmRect:CGRectMake(60, 0, 120, 40) clickBlock:clickBlock]


三、新增镂空效果
- (void)hollowWithGuideImageViewMaskType:(GuideImageViewMask)maskType cornerRadius:(CGFloat)cornerRadius maskView:(UIView *)maskView imageName:(NSString *)imageName imageSize:(CGSize)imageSize maskImageRect:(CGRect)maskImageRect confirmRect:(CGRect)confirmRect clickBlock:(GuideImageViewClickBlock)clickBlock;

demo:

[maskGuidImageView hollowWithGuideImageViewMaskType:GuideImageViewMaskRoundRect cornerRadius:15 maskView:view imageName:@"Coin_Speed_BlackSecond6" imageSize:CGSizeMake(270, 185) maskImageRect:CGRectMake(80, -30, 80+30, 30) confirmRect:CGRectMake(0, 0, 270, 185) clickBlock:clickBlock];


使用方法到这里就结束了!

如果你还想了解思路和遇到的问题,期待下一章的内容吧!
iOS新手引导--GuideImageView(二)
iOS新手引导--GuideImageView(三)