iOS - GitHub乾貨分享(APP引導頁的高度集成 - DHGuidePageHUD - ①)

　　好長時間沒更新博客, 是時候來一波乾貨分享了;APP引導頁話很少說每個APP都會用到,份量不重可是不可缺乏,不管是APP的首次安裝仍是版本的更新,首先展示給用戶眼前的也就只有它了吧,固然這裏講的不是APP引導頁的美化而是APP引導頁的高度集成, 一行代碼搞定APP引導頁是否是太誇張?下面咱們就來看一下吧!

　　(一)先上GitHub鏈接,給你們節省時間  GitHub地址 : https://github.com/dingding3w/DHGuidePageHUD

　　(二)效果圖展現:

　　　　　　　　　　　　　　

　　(三)一行代碼搞定APP引導頁的建立(真的是一行代碼,只要填入參數便可):

 1 /**
 2  *  DHGuidePageHUD
 3  *
 4  *  @param frame      位置大小
 5  *  @param imageArray 引導頁圖片數組
 6  *  @param isHidden   開始體驗按鈕是否隱藏(YES:隱藏-引導頁完成自動進入APP首頁; NO:不隱藏-引導頁完成點擊開始體驗按鈕進入APP主頁)
 7  *
 8  *  @return DHGuidePageHUD對象
 9  */
10 - (instancetype)dh_initWithFrame:(CGRect)frame imageArray:(NSArray *)imageArray buttonIsHidden:(BOOL)isHidden;

　　(四)實現方式跟原理:

　　　　APP引導頁是由多張圖片組成,引導頁的圖片在美工切圖的時候會給你的這個不用擔憂;並且使多張圖片實現輪番滾動,每拖動一次會跳轉到下一張引導頁圖片,那咱們一定會想到能夠滾動的視圖, 這裏我用的是UIScrollView

　　　　(1)建立一個繼承於UIView的類;

　　　  (2)將設置引導視圖的scrollview添加到UIView上;

 1         // 設置引導視圖的scrollview
 2         UIScrollView *guidePageView = [[UIScrollView alloc]initWithFrame:frame];
 3         [guidePageView setBackgroundColor:[UIColor lightGrayColor]];
 4         // 根據傳入圖片數組中的個數來計算UIScrollView的contentSize
 5         [guidePageView setContentSize:CGSizeMake(DDScreenW*imageArray.count, DDScreenH)];
 6         [guidePageView setBounces:NO];
 7         [guidePageView setPagingEnabled:YES];
 8         [guidePageView setShowsHorizontalScrollIndicator:NO];
 9         [guidePageView setDelegate:self];
10         [self addSubview:guidePageView];

　　　　(3)添加引導頁右上角的跳過按鈕(由於跳過按鈕一直停留在屏幕的右上角因此這裏也要添加的UIView上而且要顯示到UIScrollView的上方,以便增強用戶交互)

1         // 設置引導頁上的跳過按鈕
2         UIButton *skipButton = [[UIButton alloc]initWithFrame:CGRectMake(DDScreenW*0.8, DDScreenW*0.1, 50, 25)];
3         [skipButton setTitle:@"跳過" forState:UIControlStateNormal];
4         [skipButton setTitleColor:[UIColor lightGrayColor] forState:UIControlStateNormal];
5         [skipButton setBackgroundColor:[UIColor grayColor]];
6         [skipButton.layer setCornerRadius:5.0];
7         // 添加點擊事件(該事件保持與開始體驗按鈕,自動跳轉APP同步;目的是減小代碼的書寫量與其餘方式保持同步樣式)
8         [skipButton addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchUpInside];
9         [self addSubview:skipButton];

　　　　(4)添加引導頁上的多張圖片(若是您設置的isHidden參數爲NO的話,會在最後一張引導頁圖片上添加"開始體驗按鈕"; 若是您設置isHidden的參數爲YES的話,當滑動到最後一張APP引導頁的時候會自動進入APP相關首頁)

 1 　　　　　// 添加在引導視圖上的多張引導圖片
 2         for (int i=0; i<imageArray.count; i++) {
 3             UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(DDScreenW*i, 0, DDScreenW, DDScreenH)];
 4             imageView.image = imageArray[i];
 5             [guidePageView addSubview:imageView];
 6             
 7             // 設置在最後一張圖片上顯示進入體驗按鈕
 8             if (i == imageArray.count-1 && isHidden == NO) {
 9                 [imageView setUserInteractionEnabled:YES];
10                 UIButton *startButton = [[UIButton alloc]initWithFrame:CGRectMake(DDScreenW*0.3, DDScreenH*0.8, DDScreenW*0.4, DDScreenH*0.08)];
11                 [startButton setTitle:@"開始體驗" forState:UIControlStateNormal];
12                 [startButton setTitleColor:[UIColor colorWithRed:164/255.0 green:201/255.0 blue:67/255.0 alpha:1.0] forState:UIControlStateNormal];
13                 [startButton.titleLabel setFont:[UIFont systemFontOfSize:21]];
14                 [startButton setBackgroundImage:[UIImage imageNamed:@"GuideImage.bundle/guideImage_button_backgound"] forState:UIControlStateNormal];
15                 [startButton addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchUpInside];
16                 [imageView addSubview:startButton];
17             }
18         }

　　　　(5)點擊事件的實現,這裏使用UIView動畫以及延時的方式來使用APP引導頁進入APP相關首頁時的淡入淡出效果:

1 - (void)buttonClick:(UIButton *)button {
2     [UIView animateWithDuration:DDHidden_TIME animations:^{
3         self.alpha = 0;
4         dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(DDHidden_TIME * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
5             [self performSelector:@selector(removeGuidePageHUD) withObject:nil afterDelay:1];
6         });
7     }];
8 }

　　　　(6)最後在APP引導頁跳轉APP首頁的時候記得remove掉當前APP引導頁,防止產生沒必要要的麻煩(最好remove掉😄):

1 - (void)removeGuidePageHUD {
2     [self removeFromSuperview];
3 }

　　(五)可能會用到的代碼:

　　　　這裏我使用NSUserDefaults判斷程序是否第一次啓動(其餘方法也能夠,這裏把代碼給你們粘貼出來)

1 if (![[NSUserDefaults standardUserDefaults] boolForKey:BOOLFORKEY]) {
2         [[NSUserDefaults standardUserDefaults] setBool:YES forKey:BOOLFORKEY];
3         // 在這裏寫初始化圖片數組和DHGuidePageHUD庫引導頁的代碼
4 }

　　(六)以上就是我對DHGuidePageHUD這個APP引導頁第三方SDK的理解與講解,所有代碼已經上傳至GitHub連接,但願你們相互補充相互學習;