中山大学数据科学与计算机学院本科生ios实验报告
一、实验题目
期末项目 --新闻App
二、实现技术介绍
MJRefresh (Footer ) API
MJRefreshFooter
MJRefreshFooter结构如下图所示:
//没有效果,也不会刷新
-(void)refreshNone{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
MJRefreshBackFooter
没有任何刷新的UI,但是有刷新效果。
//没有任何刷新的UI,但是有刷新效果
-(void)refreshBack{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshBackFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
MJRefreshBackGifFooter
有文字刷新状态,有刷新效果
//有文字刷新状态,有刷新效果
-(void)refreshBackGif{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshBackGifFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
MJRefreshBackStateFooter
和MJRefreshBackGifFooter 一样 只有文字刷新状态,有刷新效果。
//和MJRefreshBackGifFooter 一样 只有文字刷新状态,有刷新效果
-(void)refreshBackState{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshBackStateFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
MJRefreshBackNormalFooter
有文字状态也有图片,有刷新效果
//有文字状态也有图片,有刷新效果
-(void)refreshBackNormal{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshBackNormalFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
MJRefreshAutoFooter
没有任何UI,但是有刷新效果,和MJRefreshBackFooter一样。
//没有任何UI,但是有刷新效果
-(void)refreshAuto{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshAutoFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
MJRefreshAutoGifFooter
有文字,有刷新效果。和MJRefreshBackGifFooter类似,但是和MJRefreshBackGifFooter的位置不一样。
//有文字,有效果,注意:这个文字是紧跟最后一个有数据的cell的位置,并不是隐藏起来的
-(void)refreshAutoGif{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshAutoGifFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
MJRefreshAutoStateFooter
有文字,有效果,和MJRefreshAutoGifFooter一个效果。
//有文字,有效果,和MJRefreshAutoGifFooter一个效果
-(void)refreshAutoState{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshAutoStateFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
MJRefreshAutoNormalFooter
有文字,刷新时候有小菊花图片,有刷新效果。
//有文字,刷新有图片,有刷新效果。
-(void)refreshAutoNormal{
__weak UpRefreshController * weakSelf = self;
self.tableView.mj_footer = [MJRefreshAutoNormalFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
带动图的刷新
-(void)refreshAnimationGif{
__weak UpRefreshController * weakSelf = self;
MJRefreshAutoGifFooter * footer = [MJRefreshAutoGifFooter footerWithRefreshingBlock:^{
[weakSelf loadDataMore];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
//设置正在刷新状态的动画图片
NSMutableArray * refreshingImages = [NSMutableArray array];
for (NSUInteger i = 1; i<=3; i++) {
UIImage * image = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_loading_0%zd",i]];
[refreshingImages addObject:image];
}
[footer setImages:refreshingImages forState:MJRefreshStateRefreshing];
self.tableView.mj_footer = footer;
}
SCRScrollMenuController
说明
CRScrollMenu是一个横向可滑动,菜单项底部有指示标志的菜单,CRScrollMenuController包含CRScrollMenu,并且是菜单项对应Content View Controller的容器,这些View Controller之间也是可以横向滑动的。
其特点有:
- 可以设置CRScrollMenu的背景图片
- 可以设置CRScrollMenu指示标志的高度跟颜色
- 支持插入与删除菜单项
- 菜单项支持subtitle,并且可以分别设置title跟subtitle在正常与选中状态的颜色与字体
- CRScrollMenuController作为容器包含了内容ViewController与CRScrollMenu,统一管理,方便使用
- CRScrollMenu可以在没有CRScrollMenuController的情况下使用
结构
CRScrollMenu由以下模块组成:
- CRScrollMenuItem:数据源,指定菜单项的title与subtitle
- CRScrollMenuButton:菜单项,根据title与subtitle进行显示,基于UIControl,用selected属性判断菜单项是否被选中(是否选中使用不同的TextAttributes)
- CRScrollMenu:滑动菜单,根据传入的CRScrollMenuItem数组生成对应的Button,并处理菜单项的点击与划动
- CRScrollMenuController:ViewController的容器,管理Content View Controller(这些Controller的view全部包含在一个ScrollView中),并根据传入的CRScrollMenuItem初始化CRScrollMenu
如何使用
- 对于CRScrollMenu,
setButtonsByItems:
在配置完CRScrollMenu之后使用,在setButtonsByItems:
之后设置的属性不会生效。基于这个原因,CRScrollMenuController中的setViewControllers:withItems:
也是一样 - CRScrollMenu设置了背景图片之后,背景颜色将不会被显示出来
- CRScrollMenu插入与删除菜单项的时候会自动更新内部ScrollView的contentOffset,当删除的菜单项为选中时,删除后第一项将变成选中项
三、实验结果
实现效果如下图所示:
四、实验总结
这次期末大作业需要完成的工作是新闻app的制作,我们需要学习使用各种不同的插件和api,因此对我们小组来说,是一个十分大的挑战。
在这次作业中,关键是将后台api读取新闻数据并且加载到我们写好的UI模型中。在本次作业中,我负责了UI的编写和优化。通过不断学习插件怎么使用的过程中,让我了解到插件的使用方式和实现的原理。
这次实验也让我明白了团队合作是十分重要的。虽然我们三个人分别完成不同的部分,但是我们必须要多沟通和交流,不然代码拼接在一起的时候就会出现问题。经过这次实验之后,我对这门课的理解也大大加深了,希望我在后面的ios开发过程中,也能继续克服困难,不断提高自己的ios开发实力。