最近在做一款外卖类的app 首页菜单栏要求做成动态分页的
要求可以分页左右滑动以及动态按钮及跳转
思考：
1.首先首页按钮个数固定了8个(或者n个)，如果后台给的按钮个数不足8个(n个)，那么不需要滚动,直接创建按钮
2.如果后台给的按钮个数超过8个(n个)，这时候需要做滑动分页,按钮需要横向分页排列。
3.怎么确定页数，array.count/8？可能没这么简单
下面是设计图，比较lou
手绘轮播图
说下我的思路（不保证最优，只是目前的思路，如果有更好的方法，我定虚心请教）
首先我准备在底层放UIScrollView
然后根据数组确定scrollview的分页个数（这个可能有很多种方法）我的方法是
int page; //分页个数
if(caiCateArray.count%8==0) {
page = (int)caiCateArray.count/8;
}else{
page = (int)caiCateArray.count/8+1;
}
注：caiCateArray是全局接收按钮信息的数组，里面包含按钮的图片，id以及title
数字8可以是任意数，目前需求是每页8个按钮
如果数据按钮个数正好是8的倍数，那么就有 caiCateArray.count/8个页面
如果不是8的倍数，为什么页数是 caiCateArray.count/8+1个，举个例子5/8 = 0...5，这时候是有一页的，20/8 = 2...4，需要3页
有了分页的页数，接下来创建UIView放在scrollview上，大小等于scrollview
再在UIView上根据数组个数创建按钮
这里比较关键
首先caiCateArray是一个数组，比如里面有10个按钮信息
这时候首页8个可以直接取前8个信息，第二页取后两个，方法可行，但是失去了动态性
我的思路是把数组拆分，每个界面对应相应的数据
下面上代码
NSArray *array = [self splitArray:caiCateArray withSubSize:8];
intpage; //分页个数
if(caiCateArray.count%8==0) {
page = (int)caiCateArray.count/8;
}else{
page = (int)caiCateArray.count/8+1;
}
CGFloatwidth = (DeviceWidth-15*5)/4;
for(inti =0; i < page; i++) {
UIView *view = [[UIView alloc]initWithFrame:CGRectMake(DeviceWidth *i, 0, DeviceWidth, 174)];
view.backgroundColor = [UIColor colorWithRed:arc4random()%256/255.0 green:arc4random()%256/255.0 blue:arc4random()%256/255.0 alpha:1];
[self.btnScrollViewaddSubview:view];
NSArray*caiArray = array[i];
for(inta =0; a < caiArray.count; a++) {
UIView*btnView = [[UIViewalloc]initWithFrame:CGRectMake(15+ a%4*(width+15),15+75*(a/4), width,60)];
btnView.backgroundColor = [UIColor whiteColor];
[viewaddSubview:btnView];
}
}
self.btnScrollView.contentSize = CGSizeMake(DeviceWidth *page, 174);
- (NSArray*)splitArray: (NSArray*)array withSubSize : (int)subSize{
// 数组将被拆分成指定长度数组的个数
unsignedlongcount = array.count% subSize ==0? (array.count/ subSize) : (array.count/ subSize +1);
// 用来保存指定长度数组的可变数组对象
NSMutableArray *arr = [[NSMutableArray alloc] init];
//利用总个数进行循环，将指定长度的元素加入数组
for(inti =0; i < count; i ++) {
//数组下标
intindex = i * subSize;
//保存拆分的固定长度的数组元素的可变数组
NSMutableArray *arr1 = [[NSMutableArray alloc] init];
//移除子数组的所有元素
[arr1removeAllObjects];
intj = index;
//将数组下标乘以1、2、3，得到拆分时数组的最大下标值，但最大不能超过数组的总大小
while(j < subSize*(i +1) && j < array.count) {
[arr1addObject:[arrayobjectAtIndex:j]];
j +=1;
}
//将子数组添加到保存子数组的数组中
[arraddObject:[arr1copy]];
}
return[arrcopy];
}
实现效果
轮子
最后的效果
加载数据后
第一次发文章，不会编辑代码格式，跟xcode一样的那种。见谅
如果这篇文章帮到了一些人，我会很开心
谢谢
网友评论