iOS开发——如何做一个漂亮的引导页

对于一款App来说,引导页是必不可少的组成元素,每当用户第一次安装应用,或者更新一次应用后,首先引入眼帘的就是引导页。一个漂亮的引导页可以增加用户体验。今天我们来实现这个功能,demo我已经集成到

  • UIButton *loginButton = [[UIButton alloc] initWithFrame:CGRectMake((UISCREEN_WIDTH - 200) / 3, UISCREEN_HEIGHT - 100, 100, 30)];
  • [loginButton setTitle:@"登录" forState:UIControlStateNormal];
  • [loginButton.layer setBorderColor:[UIColor whiteColor].CGColor];
  • [loginButton.layer setBorderWidth:0.5];
  • [loginButton.layer setMasksToBounds:true];
  • [loginButton addTarget:self action:@selector(loginButtonPressed:) forControlEvents:UIControlEventTouchUpInside];
  • UIButton *registerButton = [[UIButton alloc] initWithFrame:CGRectMake((UISCREEN_WIDTH - 200) / 3 + (UISCREEN_WIDTH - 200) / 3 + 100, UISCREEN_HEIGHT - 100, 100, 30)];
  • [registerButton setTitle:@"注册" forState:UIControlStateNormal];
  • [registerButton.layer setBorderColor:[UIColor whiteColor].CGColor];
  • [registerButton.layer setBorderWidth:0.5];
  • [registerButton.layer setMasksToBounds:true];
  • [registerButton addTarget:self action:@selector(registerButtonPressed:) forControlEvents:UIControlEventTouchUpInside];
  • [view addSubview:loginButton];
  • [view addSubview:registerButton];
  • [self.guidepageScrollView addSubview:view];
  • }

  • (4)大家仔细观看引导页可以看到,下面还有一个指示当前页面的控件,叫做PageControl,可以显示出共有几页并且当前在哪一页。这部分我用代码来实现。

     

    1).定义一个PageControl:

     

    1. @property(nonatomic,strong)UIPageControl *pageControl;


    2) .在viewDidLoad中初始化PageControl的属性:

     

     

    1. - (void)viewDidLoad {
    2. [super viewDidLoad];
    3. self.pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake([[UIScreen mainScreen] bounds].size.width / 2 - 50, [[UIScreen mainScreen] bounds].size.height - 50, 100, 20)];
    4. self.pageControl.numberOfPages = 5;
    5. [self.view addSubview:self.pageControl];
    6. [self setGuidePageScrollViewFrame];
    7. }


    3).实现ScrollView的delegate(UIScrollViewDelegate),根据ScrollView的滚动偏移位置来判断当前在哪个页面,也就是计算ScrollView的水平滚动,代码如下:

     

     

    1. - (void)scrollViewDidScroll:(UIScrollView *)scrollView{
    2. CGFloat offsetWidth = self.guidepageScrollView.contentOffset.x;
    3. int pageNum = offsetWidth / [[UIScreen mainScreen] bounds].size.width;
    4. self.pageControl.currentPage = pageNum;
    5. }



     

     

    (5)经过以上步骤,基本的引导页功能就实现了。但是还有非常重要的一个业务逻辑:引导页只有在第一次安装的时候出现,以后启动App就不会出现了。这里就可以使用NSUserDefaults来记录。启动App我们就可以判断该值是否为空,为空表示是第一次安装,显示引导页,否则就直接跳到其他界面。

    代码如下:可以这样简单的存储进行判断。

     

    50000+
    5万行代码练就真实本领
    17年
    创办于2008年老牌培训机构
    1000+
    合作企业
    98%
    就业率

    联系我们

    电话咨询

    0532-85025005

    扫码添加微信