刚刚写了一个简单的新特性界面
主要需求就是 三张图片 滑动换图 . 下面有三个点(指示器) 随图片变换改变 效果如图 1.0
1.0
这个比较简单,简要说一下原理,
主要是用了scrollview 和 pageControl
scrollview的特点 例如那三张图 ,实现横向滑动的效果,这三张图是属于并排放置的 效果如图2.0
2.0
所以说 scrollview的宽度就是几张图加在一起的宽度 同时我们可以根据scrollview的宽度值获取当前是第几张图 来做判断的依据
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
//获取偏移量
NSInteger currentPage = scrollView.contentOffset.x / SDMainScreenBounds.size.width;
//改变pagecontrol的显示
self.pageControl.currentPage = currentPage;
}
这个方法是scrollview的代理方法之一 ,
获取偏移量 就是获取图片的位置 通过这个改变指示器(小圆点)的位置
pagecontrol 主要就是我通过懒加载 初始化pagecontrol 通过scrollview的代理方法获取相应的位置
新特性的实现代码如下
//// ViewController.m// 新特性界面//// Created by hanxu on 2017/4/19.// Copyright © 2017年 hanxu. All rights reserved.
#import "ViewController.h"
#define SDMainScreenBounds [UIScreen mainScreen].bounds
@interface ViewController ()
@property(strong,nonatomic)UIPageControl *pageControl;
@end
@implementation ViewController{
NSArray * _imageNameArray;
}
//分页指示器
-(UIPageControl *)pageControl{
if (!_pageControl) {
_pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(0, SDMainScreenBounds.size.height - 40, SDMainScreenBounds.size.width, 40)];
_pageControl.currentPage = 0;
// 设置当前页指示器颜色(替换)
_pageControl.currentPageIndicatorTintColor = [UIColor whiteColor];
//设置指示器颜色(替换)
_pageControl.pageIndicatorTintColor = [UIColor blackColor];
}
return _pageControl;
}
- (void)viewDidLoad {
[super viewDidLoad];
[self loadImageScrollview];
}
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
//获取偏移量
NSInteger currentPage = scrollView.contentOffset.x / SDMainScreenBounds.size.width;
//改变pagecontrol的显示
self.pageControl.currentPage = currentPage;
}
-(void)loadImageScrollview{
UIScrollView *imagescrollview = [[UIScrollView alloc]initWithFrame:SDMainScreenBounds];
imagescrollview.delegate = self;
// 放图片的位置 (替换)
NSArray *array = @[@"1",@"2",@"3"];
_imageNameArray = array;
//加载本地图片
if (_imageNameArray.count != 0) {
imagescrollview.contentSize = CGSizeMake(SDMainScreenBounds.size.width * _imageNameArray.count, SDMainScreenBounds.size.height);
imagescrollview.pagingEnabled = YES;
imagescrollview.showsVerticalScrollIndicator = NO;
imagescrollview.showsHorizontalScrollIndicator = NO;
imagescrollview.bounces = NO;
//添加图片
for (int i = 0 ; i < _imageNameArray.count; i++) {
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(SDMainScreenBounds.size.width * i, 0, SDMainScreenBounds.size.width, SDMainScreenBounds.size.height)];
imageView.image = [UIImage imageNamed:_imageNameArray[i]];
[imagescrollview addSubview:imageView];
}
}
self.pageControl.numberOfPages = _imageNameArray.count;
[self.view addSubview:imagescrollview];
[self.view addSubview:self.pageControl];
}
@end
上述代码 把图片替换一下 还有指示器颜色替换一下 (都有标注) ,复制粘贴就可以轻松实现一个新特性界面
网友评论