iOS开发——如何做一个漂亮的引导页
2016-01-10 09:33
- (void)setGuidePageImageFrame{ for (int i = 0; i < 4; i++) { UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake([[UIScreen mainScreen] bounds].size.width * i, 0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height)]; [imageView setUserInteractionEnabled:true]; [imageView setImage:[UIImage imageNamed:[NSString stringWithFormat:@"guidepage%d",i]]]; [self.guidepageScrollView addSubview:imageView ]; } UIView *view = [[UIView alloc] initWithFrame:CGRectMake([[UIScreen mainScreen] bounds].size.width * 4, 0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height)]; [view setUserInteractionEnabled:true]; [view setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:@"guidepage0.png"]]]; 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:
- @property(nonatomic,strong)UIPageControl *pageControl;
@property(nonatomic,strong)UIPageControl *pageControl;
2) .在viewDidLoad中初始化PageControl的属性:
- - (void)viewDidLoad {
- [super viewDidLoad];
-
- self.pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake([[UIScreen mainScreen] bounds].size.width / 2 - 50, [[UIScreen mainScreen] bounds].size.height - 50, 100, 20)];
- self.pageControl.numberOfPages = 5;
- [self.view addSubview:self.pageControl];
-
- [self setGuidePageScrollViewFrame];
- }
- (void)viewDidLoad { [super viewDidLoad]; self.pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake([[UIScreen mainScreen] bounds].size.width / 2 - 50, [[UIScreen mainScreen] bounds].size.height - 50, 100, 20)]; self.pageControl.numberOfPages = 5; [self.view addSubview:self.pageControl]; [self setGuidePageScrollViewFrame];}
3).实现ScrollView的delegate(UIScrollViewDelegate),根据ScrollView的滚动偏移位置来判断当前在哪个页面,也就是计算ScrollView的水平滚动,代码如下:
- - (void)scrollViewDidScroll:(UIScrollView *)scrollView{
-
- CGFloat offsetWidth = self.guidepageScrollView.contentOffset.x;
- int pageNum = offsetWidth / [[UIScreen mainScreen] bounds].size.width;
- self.pageControl.currentPage = pageNum;
-
-
-
- }
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{ CGFloat offsetWidth = self.guidepageScrollView.contentOffset.x; int pageNum = offsetWidth / [[UIScreen mainScreen] bounds].size.width; self.pageControl.currentPage = pageNum; }
(5)经过以上步骤,基本的引导页功能就实现了。但是还有非常重要的一个业务逻辑:引导页只有在第一次安装的时候出现,以后启动App就不会出现了。这里就可以使用NSUserDefaults来记录。启动App我们就可以判断该值是否为空,为空表示是第一次安装,显示引导页,否则就直接跳到其他界面。
代码如下:可以这样简单的存储进行判断。