UI基础-UIPageControl的详细使用

UIPageControl 控件在程序中出现的比较频繁,尤其在和UIScrollView配合来显示大量数据时,会使用它来控制UIScrollView的翻页。在滚动 ScrollView时可通过PageControll中的小白点来观察当前页面的位置,也可通过点击PageContrll中的小白点来滚动到指定的页 面。下面以一个简单但实用的例子来讲解PageControll的用法。

如上图中的曲线图和表格便是由ScrollView加载两个控件 (UIWebView 和 UITableView)实用其翻页属性实现的页面滚动。而PageControll但当配合角色,页面滚动小白点会跟着变化位置,而点击小白点 ScrollView会滚动到指定的页面。

代码:(只罗列主要代码)

- (void)viewDidLoad

{

[superviewDidLoad];

self.view.backgroundColor = [UIColorcolorWithPatternImage:[UIImageimageNamed:@"bg_blank.png"]];

//  self.view.backgroundColor = [UIColor clearColor];

//定义UIScrollView

scrollview = [[UIScrollViewalloc] init];

scrollview.frame = CGRectMake(10, 0, 300, 108);

scrollview.contentSize = CGSizeMake(600, 108);  //scrollview的滚动范围

scrollview.showsVerticalScrollIndicator = NO;

scrollview.showsHorizontalScrollIndicator = NO;

//myScrollView.clipsToBounds = YES;

scrollview.delegate = self;

scrollview.scrollEnabled = YES;

scrollview.pagingEnabled = YES; //使用翻页属性

scrollview.bounces = NO;

//定义WebView加载曲线图

webview = [[UIWebViewalloc] init];

webview.frame = CGRectMake(-7, -10, 307, 118);

webview.delegate = self;

[webviewsetBackgroundColor:[UIColorclearColor]];

[webviewsetOpaque:NO];

NSString *fullPath = [NSBundlepathForResource:@"sline"ofType:@"htm"inDirectory:[[NSBundlemainBundle] bundlePath]];

[self.webviewloadRequest:[NSURLRequestrequestWithURL:[NSURLfileURLWithPath:fullPath]]];

//用来制定边框

view22 = [[UIViewalloc] init];

//将图层的边框设置为圆脚

view22.layer.cornerRadius = 10;

view22.layer.masksToBounds = YES;

//给图层添加一个有色边框

view22.layer.borderWidth = 1;

//view1.layer.borderColor = [[UIColor colorWithRed:0.52 green:0.09 blue:0.07 alpha:1] CGColor];

view22.layer.borderColor = [[UIColorcolorWithRed:0green:0blue:0alpha:1] CGColor];

view22.frame = CGRectMake(0, 0, 300, 108);

view22.backgroundColor = [UIColorcolorWithRed:0.31green:0.31blue:0.31alpha:1];

tableview.frame = CGRectMake(0, 21, 300, 87);

tableview.allowsSelection = NO;

tableview.backgroundColor = [UIColorcolorWithRed:0.31green:0.31blue:0.31alpha:1];

//用来制定边框

view11 = [[UIViewalloc] init];

//将图层的边框设置为圆脚

view11.layer.cornerRadius = 10;

view11.layer.masksToBounds = YES;

//给图层添加一个有色边框

view11.layer.borderWidth = 1;

//view1.layer.borderColor = [[UIColor colorWithRed:0.52 green:0.09 blue:0.07 alpha:1] CGColor];

view11.layer.borderColor = [[UIColorcolorWithRed:0green:0blue:0alpha:1] CGColor];

view11.frame = CGRectMake(300, 0, 300, 108);

view11.backgroundColor = [UIColorblackColor];

[view11addSubview:tableview];

[scrollviewaddSubview:view11];

[view22addSubview:webview];

[scrollviewaddSubview:view22];

//定义PageControll

pageControl = [[UIPageControlalloc] init];

pageControl.frame = CGRectMake(150, 100, 20, 20);//指定位置大小

pageControl.numberOfPages = 2;//指定页面个数

pageControl.currentPage = 0;//指定pagecontroll的值,默认选中的小白点(第一个)

[pageControladdTarget:selfaction:@selector(changePage:)forControlEvents:UIControlEventValueChanged];

//添加委托方法,当点击小白点就执行此方法

[self.viewaddSubview:scrollview];

[self.viewaddSubview:pageControl];

}

//scrollview的委托方法,当滚动时执行

- (void)scrollViewDidScroll:(UIScrollView *)sender {

int page = scrollview.contentOffset.x / 290;//通过滚动的偏移量来判断目前页面所对应的小白点

pageControl.currentPage = page;//pagecontroll响应值的变化

}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {

}

//pagecontroll的委托方法

- (IBAction)changePage:(id)sender {

int page = pageControl.currentPage;//获取当前pagecontroll的值

[scrollview setContentOffset:CGPointMake(300 * page, 0)];//根据pagecontroll的值来改变scrollview的滚动位置,以此切换到指定的页面

}

以上是一种简单的方法来实现pagecontroll的切换页面功能,以后会为大家添加 “无限循环切换页面”和“动态的增加和减少页面”。

时间: 2024-10-26 11:09:58

UI基础-UIPageControl的详细使用的相关文章

IOS开发UI基础UIPageControl的属性

UIPageControl    •    numberOfPages // 设置有多少页 默认为0// 2) 设置页数   [pageControl setNumberOfPages:kImageCount];    •    currentPage  // 设置当前页[pageControl setCurrentPage:0]; •    pageIndicatorTintColor // 设置页码指示器颜色 [pageControl setPageIndicatorTintColor:[U

转发-UI基础教程 – 原生App切图的那些事儿

UI基础教程 – 原生App切图的那些事儿 转发:http://www.shejidaren.com/app-ui-cut-and-slice.html 移动APP切图是UI设计必须学会的一项技能,切图虽然简单,但还是有很多地方需要注意的,下面由tgideas的 LV主唱大人 跟大家讲讲原生App切图的那些事儿,对UI入门或需了解APP切图的设计师来说会有帮助哦. 如何切图? 了解iphone界面的尺寸 最小的分辨率是320×480,我们把这个尺寸定为基准界面尺寸(baseline),基准尺寸所

ios开发-UI基础-超级猜图

[注意]转载时请注明出处博客园-吃唐僧肉的小悟空http://www.cnblogs.com/hukezhu/ 本篇文章介绍一个比较综合的小应用----超级猜图. 功能分析: 根据显示的图片,在下面的待选项按钮中选中正确答案按钮,选中的按钮会显示在正确答案按钮中 答案错误,答案颜色变为红色,分数减小 答案正确,答案颜色变为蓝色,两秒自动跳入下一题,分数增加 点击"下一题"可以进入下一个题目 点击"大图",可以放大显示图片,再次点击图片或者背景,图片缩小至原来大小 点

ios开发-UI基础-应用管理(单纯界面)改进5-使用代理实现监听下载按钮的点击(delegate)

[注意]转载时请注明出处博客园-吃唐僧肉的小悟空http://www.cnblogs.com/hukezhu/ 前几篇文章介绍了一个应用管理的小应用,从最开始的单纯实现功能,一步一步就行改进\封装,上篇文章是使用xib进行了优化,本篇文章使用代理实现监听下载按钮的点击. 在原来的基础上,使用代理的主要思路分析: 首先要新建一个协议 声明协议的要实现的方法(一般为optional) 声明一个遵守该协议的代理的属性 使用代理,通知其代理完成操作 在代理中的实现步骤: 遵守协议 设置代理(一般通过拖线

UI基础控件UIButton

一:UI基础 Button控件 1,简单说明:UIView和UIViewController间的关系 一个应用并不一定要有UIViewController,但是为了管理界面事件(比如按钮点击事件)一般我们在创建应用时要先创建控制器,控制器拥有一个UIView属性. UIView用来展示数据.及用户输入数据.监听事件的触发(比如按钮的touchupinside事件) 而控制可以用来处理这些事件,赋值UIView的管理. 按钮可以展示文字和图片,也就是说按钮具有这些属性. 2,按钮的三种状态 nor

Android UI基础

Android UI概述 Android UI由View和ViewGroup组成. ViewGroup是不可见的,用于组织和排版View和ViewGroup. View用户显示内容,以及响应用户的操作. 可以按照需要安排UI的叠放,不过叠放的层数越少,性能上来说越好. Android UI可以在code中生产,不过更加方便的方式是在Android的XML文件中定义UI. Layouts 通过XML方式实现 可以通过2种方式定义界面结构. 1. 在XML定义视图结构 2. 在运行时动态创建视图结构

iOS开发UI基础—IOS开发中Xcode的一些使用技巧

iOS开发UI基础-IOS开发中Xcode的一些使用技巧 一.快捷键的使用 经常用到的快捷键如下: 新建 shift + cmd + n     新建项目 cmd + n             新建文件 视图 option + cmd + 回车 打开助理编辑器 cmd + 回车           显示主窗口 cmd + 0             导航窗口 option + cmd + 0    工具窗口 在.m & .h之间切换           control + cmd + 上/下

ios开发UI基础—Kvc简单介绍

一.KVC简单介绍 KVC key valued coding 键值编码 KVC通过键值间接编码 补充: 与KVC相对的时KVO,即key valued observer 键值观察.监听某一个模型的属性,只要模型属性的值一变化就通知你. 二.使用KVC 1.KVC基本使用介绍 (1)代码示例: 新建一个命令行项目,用以演示KVC的用法 完成之后为项目添加一个Person类. 为Person类添加两个属性(name和age),注意这两个属性的类型. 1 #import <Foundation/Fo

IOS开发UI基础—在UIImageView中添加按钮以及Tag的参数说明

ios开发UI基础-在ImageView中添加按钮以及Tag的参数说明 一.tag参数 一个视图通常都只有一个父视图,多个子视图,在开发中可以通过使用子视图的tag来取出对应的子视图.方法为Viewwithtag: 提示点:在xib中如果想要通过tag参数获取对应的控件(属性),不要把tag的参数设置为0,因为xib中所有的对象默认tag都为0,设置为0取不到对象. 二.ImageView中添加按钮(1)ImageView和Button的比较 Button按钮的内部可以放置多张图片(4),而Im