UI-滚动视图(滚动视图)
2015-09-18 20:53
337 查看
UIScrollView (滚动视图) (产品使用介绍就是用滚动视图实现的)
滚动视图实现原理:滚动视图位置不变 内容的位置发生改变
效果:1. 分页查看图片
2.查看大图片
3.当内容过多 需要一个页面显示(如注册 修改个人信息)
4.当不希望用户感觉我们的界面不是一张图片的时候 contentSize : height +1 or
width +1
--------------------------1. 分页查看图片-------------------------------------------------------------------------
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
#pragma -------------分页查看图片
NSArray *imageName = @[@"t-1.jpg",@"t-2.jpg",@"t-3.jpg"];
UIScrollView *myscrollview = [[UIScrollView alloc]initWithFrame:self.view.frame];
myscrollview.delegate = self;
myscrollview.contentSize = CGSizeMake(CGRectGetWidth(self.view.frame)*imageName.count, 0);
// 设置滚动视图的分页效果
myscrollview.pagingEnabled = YES;
// 设置滚动条的样式
myscrollview.indicatorStyle = UIScrollViewIndicatorStyleWhite;
// 设置滚动视图的偏移量 可以达到 设置滚动视图默认在第几屏的位置 还可以通过contentoffest来判断滚动到第几屏
myscrollview.contentOffset = CGPointMake(CGRectGetWidth(self.view.frame), 0);
// 设置是否有反弹效果
myscrollview.bounces = NO;// 如果默认值是可以看到底图 并有反弹效果
myscrollview.showsHorizontalScrollIndicator = NO;
for (int i = 0; i <imageName.count; i++) {
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(CGRectGetWidth(self.view.frame)*i, 0, CGRectGetWidth(self.view.frame), CGRectGetHeight(self.view.frame))];
imageView.image = [UIImage imageNamed:imageName[i]];
imageView.alpha = 0.5;
[myscrollview addSubview:imageView];
}//把图片添加到滚动视图上
#pragma----UIPageControl(点点点)
UIPageControl *pagecontrol = [[UIPageControl alloc]initWithFrame:CGRectMake( 0, CGRectGetHeight(self.view.frame)-40, CGRectGetWidth(self.view.frame), 20)];
// 设置pagecontrol总共有多少页
pagecontrol.numberOfPages = imageName.count;
// 设置指示的当前页面
pagecontrol.currentPage = 1;
// 当只有一个页面的时候隐藏pagecontrol
pagecontrol.hidesForSinglePage = YES;
// 设置空心小圆点的颜色
pagecontrol.pageIndicatorTintColor = [UIColor orangeColor];
pagecontrol.tag = 119;
[self.view addSubview:pagecontrol];
[self.view addSubview:myscrollview];
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
// NSLog(@"%f",scrollView.contentOffset.x);
// 在哪一个页面通过偏移x的位置初一屏幕的宽度得到当前的页数
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{//得到一个当前页数
// x滚动视图的偏移量 (特有的数据)屏幕的宽(持有的数据)
float x = scrollView.contentOffset.x;
float w = CGRectGetWidth(self.view.frame);
NSLog(@"%f",x);
// 偏移量除以宽 得到当前页面的页数
NSInteger curpage = x/w;
// 通过tag值找到pagecontrol
UIPageControl *pagecontrol = (UIPageControl *)[self.view viewWithTag:119];
pagecontrol.currentPage = curpage;
}
--------------------------2.查看大图片 -------------------------------------------------------------------------
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
{
UIImageView *imageview;
}
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
#pragma -----------查看大图片
// 一、 查看大图片
NSString *path = [[NSBundle mainBundle]pathForResource:@"fj-i" ofType:@"jpg"];
UIImage *bg = [UIImage imageWithContentsOfFile:path];
UIScrollView * scrolview = [[UIScrollView alloc]initWithFrame:self.view.frame];
scrolview.backgroundColor = [UIColor greenColor];
// 设置滚动视图的contentsize 如果滚动视图的contentsize 如果contentsize 小于滚动视图的bounds 就不会滚动
scrolview.contentSize = CGSizeMake(0, CGRectGetHeight(self.view.frame)+100);
scrolview.contentSize = bg.size;// 设置滚动视图的contentsize跟滚动视图一样大
// 在滚动视图上 添加图片(在滚动视图上 添加内容)
imageview = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, bg.size.width, bg.size.height)];
imageview.image = bg;
[scrolview addSubview:imageview];
//二、放大图片 :1.需要用到滚动视图的代理方法 2.设置放大缩小图片的最大最小倍数 3. 让滚动视图知道要放大那个视图
scrolview.minimumZoomScale = 0.5;// 设置滚动视图的缩放最小倍数
scrolview.maximumZoomScale = 5; // 设置滚动视图的缩放最大倍数
scrolview.delegate = self;
[self.view addSubview:scrolview];
}
#pragma -------------ScrollViewDelegate---
//设置需要在滚动视图上 添加图片视图(在滚动视图上 添加内容)
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView//缩放图片方法
{
return imageview;
}
-------------------------- 当内容过多 需要一个页面显示(如注册 修改个人信息) -------------------------------------------
#pragma ----当内容过多 需要一个页面视图 (如 注册 修改个人信息)
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
{
UITextField *textfield;
}
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
textfield = [[UITextField alloc]initWithFrame:CGRectMake(100, 200, 200, 40)];
textfield.borderStyle = UITextBorderStyleLine;
[mysrollview addSubview:textfield];
UIScrollView * mysrollview = [[UIScrollView alloc]initWithFrame: self.view.frame];
mysrollview.contentSize = CGSizeMake(0 , CGRectGetHeight(self.view.frame)+10);
mysrollview.delegate = self;
mysrollview.scrollsToTop = YES;//设置滚动视图 是否允许点击顶部 滚动到初始位置
// 屏蔽滚动条
mysrollview.showsVerticalScrollIndicator = NO;//纵向
// mysrollview.showsHorizontalScrollIndicator = NO; //水平方向
[self.view addSubview:mysrollview];
}
//开始滚动的时候开始调用
//- (void)scrollViewDidScroll:(UIScrollView *)scrollView
//{
// [textfield resignFirstResponder];
//}
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
// [textfield resignFirstResponder];
}
- (void)scrollViewDidScrollToTop:(UIScrollView *)scrollView
{
[textfield resignFirstResponder];
}
由于4比较简单就不介绍了
滚动视图实现原理:滚动视图位置不变 内容的位置发生改变
效果:1. 分页查看图片
2.查看大图片
3.当内容过多 需要一个页面显示(如注册 修改个人信息)
4.当不希望用户感觉我们的界面不是一张图片的时候 contentSize : height +1 or
width +1
--------------------------1. 分页查看图片-------------------------------------------------------------------------
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
#pragma -------------分页查看图片
NSArray *imageName = @[@"t-1.jpg",@"t-2.jpg",@"t-3.jpg"];
UIScrollView *myscrollview = [[UIScrollView alloc]initWithFrame:self.view.frame];
myscrollview.delegate = self;
myscrollview.contentSize = CGSizeMake(CGRectGetWidth(self.view.frame)*imageName.count, 0);
// 设置滚动视图的分页效果
myscrollview.pagingEnabled = YES;
// 设置滚动条的样式
myscrollview.indicatorStyle = UIScrollViewIndicatorStyleWhite;
// 设置滚动视图的偏移量 可以达到 设置滚动视图默认在第几屏的位置 还可以通过contentoffest来判断滚动到第几屏
myscrollview.contentOffset = CGPointMake(CGRectGetWidth(self.view.frame), 0);
// 设置是否有反弹效果
myscrollview.bounces = NO;// 如果默认值是可以看到底图 并有反弹效果
myscrollview.showsHorizontalScrollIndicator = NO;
for (int i = 0; i <imageName.count; i++) {
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(CGRectGetWidth(self.view.frame)*i, 0, CGRectGetWidth(self.view.frame), CGRectGetHeight(self.view.frame))];
imageView.image = [UIImage imageNamed:imageName[i]];
imageView.alpha = 0.5;
[myscrollview addSubview:imageView];
}//把图片添加到滚动视图上
#pragma----UIPageControl(点点点)
UIPageControl *pagecontrol = [[UIPageControl alloc]initWithFrame:CGRectMake( 0, CGRectGetHeight(self.view.frame)-40, CGRectGetWidth(self.view.frame), 20)];
// 设置pagecontrol总共有多少页
pagecontrol.numberOfPages = imageName.count;
// 设置指示的当前页面
pagecontrol.currentPage = 1;
// 当只有一个页面的时候隐藏pagecontrol
pagecontrol.hidesForSinglePage = YES;
// 设置空心小圆点的颜色
pagecontrol.pageIndicatorTintColor = [UIColor orangeColor];
pagecontrol.tag = 119;
[self.view addSubview:pagecontrol];
[self.view addSubview:myscrollview];
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
// NSLog(@"%f",scrollView.contentOffset.x);
// 在哪一个页面通过偏移x的位置初一屏幕的宽度得到当前的页数
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{//得到一个当前页数
// x滚动视图的偏移量 (特有的数据)屏幕的宽(持有的数据)
float x = scrollView.contentOffset.x;
float w = CGRectGetWidth(self.view.frame);
NSLog(@"%f",x);
// 偏移量除以宽 得到当前页面的页数
NSInteger curpage = x/w;
// 通过tag值找到pagecontrol
UIPageControl *pagecontrol = (UIPageControl *)[self.view viewWithTag:119];
pagecontrol.currentPage = curpage;
}
--------------------------2.查看大图片 -------------------------------------------------------------------------
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
{
UIImageView *imageview;
}
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
#pragma -----------查看大图片
// 一、 查看大图片
NSString *path = [[NSBundle mainBundle]pathForResource:@"fj-i" ofType:@"jpg"];
UIImage *bg = [UIImage imageWithContentsOfFile:path];
UIScrollView * scrolview = [[UIScrollView alloc]initWithFrame:self.view.frame];
scrolview.backgroundColor = [UIColor greenColor];
// 设置滚动视图的contentsize 如果滚动视图的contentsize 如果contentsize 小于滚动视图的bounds 就不会滚动
scrolview.contentSize = CGSizeMake(0, CGRectGetHeight(self.view.frame)+100);
scrolview.contentSize = bg.size;// 设置滚动视图的contentsize跟滚动视图一样大
// 在滚动视图上 添加图片(在滚动视图上 添加内容)
imageview = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, bg.size.width, bg.size.height)];
imageview.image = bg;
[scrolview addSubview:imageview];
//二、放大图片 :1.需要用到滚动视图的代理方法 2.设置放大缩小图片的最大最小倍数 3. 让滚动视图知道要放大那个视图
scrolview.minimumZoomScale = 0.5;// 设置滚动视图的缩放最小倍数
scrolview.maximumZoomScale = 5; // 设置滚动视图的缩放最大倍数
scrolview.delegate = self;
[self.view addSubview:scrolview];
}
#pragma -------------ScrollViewDelegate---
//设置需要在滚动视图上 添加图片视图(在滚动视图上 添加内容)
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView//缩放图片方法
{
return imageview;
}
-------------------------- 当内容过多 需要一个页面显示(如注册 修改个人信息) -------------------------------------------
#pragma ----当内容过多 需要一个页面视图 (如 注册 修改个人信息)
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
{
UITextField *textfield;
}
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
textfield = [[UITextField alloc]initWithFrame:CGRectMake(100, 200, 200, 40)];
textfield.borderStyle = UITextBorderStyleLine;
[mysrollview addSubview:textfield];
UIScrollView * mysrollview = [[UIScrollView alloc]initWithFrame: self.view.frame];
mysrollview.contentSize = CGSizeMake(0 , CGRectGetHeight(self.view.frame)+10);
mysrollview.delegate = self;
mysrollview.scrollsToTop = YES;//设置滚动视图 是否允许点击顶部 滚动到初始位置
// 屏蔽滚动条
mysrollview.showsVerticalScrollIndicator = NO;//纵向
// mysrollview.showsHorizontalScrollIndicator = NO; //水平方向
[self.view addSubview:mysrollview];
}
//开始滚动的时候开始调用
//- (void)scrollViewDidScroll:(UIScrollView *)scrollView
//{
// [textfield resignFirstResponder];
//}
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
// [textfield resignFirstResponder];
}
- (void)scrollViewDidScrollToTop:(UIScrollView *)scrollView
{
[textfield resignFirstResponder];
}
由于4比较简单就不介绍了
相关文章推荐
- codechef 3D Queries(MGCH3D)
- General Problem Solving Techniques [Beginner-1]~A
- ios开发系列之UITableView
- 【UI初级--连载六】---------导航控制器(UINavigationController)
- 【UI初级--连载五】---------UIViewController(视图控制器)
- General Problem Solving Techniques [Beginner-1]~E
- General Problem Solving Techniques [Beginner-1]~F
- UITableViewController
- UI课程 08 导航控制器 UINavigationController 、容器控制器
- [AndroidUI]对Tween动画的简单封装
- UI知识点
- Sorting a Three-Valued Sequence(USACO 2.1.3)
- UVA 10689 Yet another Number Sequence
- iOS开发 -UIScrollView详解
- UI设计师不可不知的安卓屏幕知识 dp px 屏幕密度
- 实现TOP K(选做):统计sogou500w中,发关键字次数最多的 *前20名用户UID和发关键字次数。
- NGUI简单背包系统的实现
- 【iOS】UIViewController生命周期
- 云海飞翔lee -- UIAlertController
- 电话通讯录用到的 Rui