自动轮播

最新推荐文章于 2022-12-04 09:00:00 发布
最新推荐文章于 2022-12-04 09:00:00 发布
阅读量147 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： 页面 文章标签： 自动轮播
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/chuck_phonics/article/details/83383997
本文详细介绍如何在SwiftUI环境中使用UICollectionView进行复杂界面布局，包括自定义cell、实现不同类型的跳转控制器，以及如何设置流水布局以达到美观的网格显示效果。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

首先在viewcontroller中设置tabbar,然后准备在某一个主界面书写界面

#import "twoViewController.h"
#import "firstViewController.h"
#import "secondViewController.h"
#define HCWidth self.view.frame.size.width
#define HCHeigh self.view.frame.size.height
@interface twoViewController ()<UITableViewDelegate,UITableViewDataSource,UICollectionViewDelegate , UICollectionViewDataSource>{
    NSArray *arrimG;
}
@property(nonatomic,strong)UITableView *tbv;

@end
static NSString *reuseCell = @"123";
@implementation twoViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemAdd target:self action:nil];
    
    // 默认为关闭大标题模式
    self.navigationController.navigationBar.prefersLargeTitles = YES;
    
    self.navigationItem.title = @"健康数据";
    
    
    [self.view addSubview:self.tbv];
    [self createTableViewHeader];
    
}
-(UITableView *)tbv{
    if (!_tbv) {
        _tbv = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) style:UITableViewStylePlain];
    }
    
    _tbv.dataSource = self;
    _tbv.delegate = self;
    
    
    
    return _tbv;
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return 6;
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
    
    if (!cell) {
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:@"cell"];
    }
    
    
    
    _tbv.rowHeight = 50;
    
    NSArray *array = @[@"健康记录",@"身体测量",@"生殖健康",@"数据结果",@"心脏",@"主要体征"];
    
    
    NSArray *arrimg = @[@"健康记录",@"身体测量",@"生殖健康",@"数据结果",@"心脏",@"主要体征"];
    
    UIImageView *imgV = [[UIImageView alloc]initWithFrame:CGRectMake(10, 10, 30, 30)];
    
    imgV.image = [UIImage imageNamed:arrimg[indexPath.row]];
    
    [cell addSubview:imgV];
    
    UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(50, 10, 100, 30)];
    
    label.text = array[indexPath.row];
    
    [cell addSubview:label];
    cell.detailTextLabel.text = @">";
    
    
    
    return cell;
}



//分区个数 (几组)
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 1;
}
//每个分区有几个item (小格子的个数)
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    
    return 4;
    
    
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    //创建重用标识符
    
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseCell forIndexPath:indexPath];
    //设置格子的背景颜色
    cell.backgroundColor = [UIColor redColor];
    //初始化图片框
    UIImageView *imgV = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 180, 180)];
    //添加图片
    imgV.image = [UIImage imageNamed:arrimG[indexPath.row]];
    //添加到网格里面
    [cell addSubview:imgV];
    
    
    
    return cell;
    
}


-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
    
    if (indexPath.item == 0) {
        firstViewController *p = [firstViewController new];
        [self.navigationController pushViewController:p animated:YES];
    }else if (indexPath.item == 1){
        
        NSLog(@"正念训练");
        
    }else if (indexPath.item == 2){
        NSLog(@"营养摄入");
        
    }else{
        secondViewController *pppp = [secondViewController new];
        [self.navigationController pushViewController:pppp animated:YES];
    }
    
    
}

-(void)createTableViewHeader{
    
    
    UIView * headerView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 455)];
    
    headerView.backgroundColor = [UIColor colorWithRed:248/255.0 green:248/255.0 blue:248/255.0 alpha:1];
    
    
    UISearchBar *search = [[UISearchBar alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 50)];
    
    //search.backgroundColor = [UIColor colorWithRed:248/255.0 green:248/255.0 blue:248/255.0 alpha:1];
    
    search.barStyle = UISearchBarStyleDefault;
    
    
    
    
    search.placeholder = @"搜索";
    
    [headerView addSubview:search];
    
    
    
    
    //创建流水布局
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
    //格子的大小
    layout.itemSize = CGSizeMake(180, 180);
    //行间距
    layout.minimumLineSpacing = 15;
    //列间距
    layout.minimumInteritemSpacing = 15;
    //分区间距
    layout.sectionInset = UIEdgeInsetsMake(15, 15, 15, 15);
    //
    
    //网格视图 (表格 -> 需要注册,需要创建布局)
    //1.frame
    UICollectionView *clV = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 50, self.view.frame.size.width, 405) collectionViewLayout:layout];
    //2.数据源和代理
    clV.delegate = self;
    clV.dataSource = self;
    
    //注册网格cell
    [clV registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:reuseCell];
    
    //给数组赋值
    arrimG = @[@"1",@"2",@"3",@"4"];
    
    //设置视图的背景颜色
    clV.backgroundColor = [UIColor whiteColor];
    
    [headerView addSubview:clV];
    
    self.tbv.tableHeaderView = headerView;
}
@end

之后创建自定义cell xib和各种跳转的控制器

#import "firstViewController.h"
#import "pTableViewCell.h"
@interface firstViewController ()<UITableViewDataSource,UITableViewDelegate>
@property(nonatomic,strong)UITableView *tbv;
@end

@implementation firstViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
    self.view.backgroundColor = [UIColor redColor];
    
    // 默认为关闭大标题模式
    self.navigationController.navigationBar.prefersLargeTitles = YES;
    
    self.navigationItem.title = @"健康记录";
    
    
    
    [self.view addSubview:self.tbv];
    
}

-(UITableView *)tbv{
    if (!_tbv) {
        _tbv = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) style:UITableViewStyleGrouped];
    }
    
    _tbv.delegate = self;
    _tbv.dataSource = self;
    
    [_tbv registerNib:[UINib nibWithNibName:@"pTableViewCell" bundle:nil] forCellReuseIdentifier:@"cell2"];
    
    return _tbv;
    
}

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return 2;
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    if (section == 0) {
        return 1;
    }else{
        return 3;
    }
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    
    
    if (indexPath.section == 0) {
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
        
        if (!cell) {
            cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:@"cell"];
        }
        _tbv.rowHeight = 200;
        
        UIImageView *imgV = [[UIImageView alloc]initWithFrame:CGRectMake(10, 10, self.view.frame.size.width - 20, 180)];
        
        imgV.image = [UIImage imageNamed:@"11"];
        
        [cell addSubview:imgV];
        return cell;
    }else{
        _tbv.rowHeight = 150;
        pTableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"cell2"];
        return cell;
    }
    
}

-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{
    if (section == 0) {
        
        return @"少做多动,适度锻炼";
    }
    else{
        return @"今天";
    }
}

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    if (indexPath.section==0) {
        return 180;
    }
    else{
        return 80;
    }
}


@end


#import "secondViewController.h"
#import "pTableViewCell.h"
@interface secondViewController ()<UITableViewDataSource,UITableViewDelegate>
@property(nonatomic , strong) UITableView *tbv;
@end

@implementation secondViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
    self.view.backgroundColor = [UIColor redColor];
    
    // 默认为关闭大标题模式
    self.navigationController.navigationBar.prefersLargeTitles = YES;
    
    self.navigationItem.title = @"健康记录";
    
    
    
    [self.view addSubview:self.tbv];
    
}

-(UITableView *)tbv{
    if (!_tbv) {
        _tbv = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) style:UITableViewStyleGrouped];
    }
    
    _tbv.delegate = self;
    _tbv.dataSource = self;
    
    [_tbv registerNib:[UINib nibWithNibName:@"pTableViewCell" bundle:nil] forCellReuseIdentifier:@"cell2"];
    
    return _tbv;
    
}

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return 2;
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    if (section == 0) {
        return 1;
    }else{
        return 3;
    }
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    
    
    if (indexPath.section == 0) {
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
        
        if (!cell) {
            cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:@"cell"];
        }
        _tbv.rowHeight = 200;
        
        UIImageView *imgV = [[UIImageView alloc]initWithFrame:CGRectMake(10, 10, self.view.frame.size.width - 20, 180)];
        
        imgV.image = [UIImage imageNamed:@"22"];
        
        [cell addSubview:imgV];
        return cell;
    }else{
        pTableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"cell2"];
        return cell;
    }
    
}

-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{
    if (section == 0) {
        return @"到点就寝,按时起床,持之以恒";
    }
    else{
        return @"更早";
    }
}

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    if (indexPath.section==0) {
        return 180;
    }
    else{
        return 80;
    }
}


@end

// 默认为关闭大标题模式
self.navigationController.navigationBar.prefersLargeTitles = YES;

自动轮播.
hqw200424的博客
10-18 437
1.新建一个HTML文档在<body>标签设置div标签在给它设置类. 2.在<style>标签中设置类的属性. 3.设置图片的大小和浮动. 4.设置当元素的内容溢出其区域时发生的类. 5.初始预览状态. 6.接着设置动画播放的帧数. 7.接着设置自动播放次数无限. 8.最后一步点击保存实时预览自动轮播就可以了. ...
js自动轮播
自学前端开发
06-14 373
html代码区 <div class="chart"> <ul class="chartlist" id="list"> <li class="chartitem"><a href=""><img src="images/chart_01.jpg" alt=""></a></li> <li class="chartitem"><a href=""><img src="images/ch
轮播图自动播放
04-07
本篇详细介绍了页面中常见的轮播图效果在实际项目中的应用，利用css+html+js+dom来实现动态播放的效果
轮播图的实现（自动轮播+左右按钮切换和点选切换）
08-10
- 自动轮播：使用`setInterval`函数和计数器变量，定时更改轮播图的显示内容。 - 左右按钮切换：通过给左右按钮设置点击事件，将当前显示的图片索引递增或递减，并更新轮播图显示。 - 点选切换：为每个点选按钮...
Unity图片自动轮播带滑动切换
最新发布
05-30
unity实现一个简单的RawImage图片自动轮播功能，用来做待机界面的。UGUI+DOTween，具有滑动切换效果，外部加载图片，带完整场景。
chrome标签页自动轮播
11-15
Chrome浏览器的标签页自动轮播功能是一种创新的浏览体验，它允许用户设定浏览器标签页在一段时间内自动切换，从而无需手动切换就能查看不同的网页。这种功能对于需要同时关注多个页面的用户尤其有用，例如监控多个...
Android实现带指示器的自动轮播式ViewPager
01-20
【Android实现带指示器的自动轮播式ViewPager】 在Android应用开发中，有时我们需要展示一组内容，例如广告或推荐信息，这时使用一个自动轮播的ViewPager就非常合适。这种组件通常包含一个ViewPager来承载多个子...
原生JS实现的自动轮播图功能详解
12-29
本文实例讲述了原生JS实现的自动轮播图功能。分享给大家供大家参考，具体如下： 轮播图的用处 轮播图是现在网站网页上最常见的效果之一，很多网站上都会用到，淘宝京东等等。有些自动选项卡也是需要用到的，而且它的...
ViewPager实现图片自动轮播和无限循环（完美流畅）
07-26
详情请参看博客http://blog.youkuaiyun.com/qq_20521573/article/details/52037929
自动轮播图
八点半技术站
04-04 373
html> html lang="en"> head> meta charset="UTF-8"> title>Documenttitle> script src="">script> style> * { margin: 0;padding: 0; }
JavaScript轮播图--自动轮播
qq_45765412的博客
10-21 461
需求： 页面进入后，轮播图会自动轮播，鼠标 停留在轮播图时会停止轮播，停顿在当前图片上， 鼠标离开会继续轮播 。 思路 编写两个方法， 第一个autoPlay();实现轮播图的自动轮播。 第二个Play()主要进行判断当光标进入轮播图后 将计时器清除，当光标移出轮播图后，轮播图自动轮播。 代码实现： var timer = null; function autoPlay() { timer = s...
无缝轮播 / 自动轮播
weixin_45045834的博客
09-10 601
无缝轮播 / 自动轮播 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> <style> .box{
图片自动轮播
weiyangmeng的博客
01-08 288
public class Framentone extends Fragment { private ViewPager pagerone; private List list; private String string; String s; int i; private Handler handler=new Handler(){
自动轮播+无限轮播
duanzeshan的博客
08-22 291
private Handler handler = new Handler() { @Override public void handleMessage(Message msg) { //获取viewpager的最大数   int currentItem = vp_head.getCurrentItem(); currentItem++;
js实现轮播图自动轮播
weixin_47619284的博客
08-16 9948
js实现轮播图自动轮播
自动轮播图的实现
m0_46655386的博客
12-04 1425
js自动轮播图
BannerViewPager实现无线自动轮播技术
在信息技术领域，自动轮播是一种常见的功能，用于在用户界面上自动循环显示一系列的图像、文本或其他类型的媒体内容。这种功能被广泛应用于网站、移动应用、数字广告以及零售系统中，以吸引用户的注意力并提供动态...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值