iOS仿淘宝头条效果开发

最新推荐文章于 2020-05-26 09:49:46 发布
置顶 最新推荐文章于 2020-05-26 09:49:46 发布
阅读量1k 收藏
点赞数
分类专栏： iOS学习笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/aaron0619/article/details/79363188
版权

使用scrollview实现的效果:


#import "VierticalScrollView.h"
#define ViewWidth self.bounds.size.width
#define ViewHeight self.bounds.size.height
#define OrangeColor [UIColor colorWithRed:254/255.0 green:97/255.0 blue:69/255.0 alpha:1.0]
//屏幕宽度和高度
#define Screen_Width [[UIScreen mainScreen] bounds].size.width
#define Screen_Height [[UIScreen mainScreen] bounds].size.height

@interface VierticalScrollView()<UIScrollViewDelegate>
@property(nonatomic,strong) NSMutableArray *titles; //标题
@property(nonatomic,strong) NSMutableArray *types;  //类型
@property(assign, nonatomic)int index;
@property(nonatomic,strong) UIView *firstView;
@property(nonatomic,strong) UILabel *firstBtn;
@property(nonatomic,strong) UILabel *firstLabel;
@property(nonatomic,strong) UILabel *firstBtn1;
@property(nonatomic,strong) UILabel *firstLabel1;
@property(nonatomic,strong) UILabel *firstBtn2;
@property(nonatomic,strong) UILabel *firstLable2;

@property(nonatomic,strong) UIView *secondView;
@property(nonatomic,strong) UILabel *secondBtn;
@property(nonatomic,strong) UILabel *secondLabel;
@property(nonatomic,strong) UILabel *secondBtn1;
@property(nonatomic,strong) UILabel *secondLabel1;
@property(nonatomic,strong) UILabel *secondBtn2;
@property(nonatomic,strong) UILabel *secondLabel2;
@end
@implementation VierticalScrollView


-(instancetype)initWithFrame:(CGRect)frame{
    if (self = [super initWithFrame:frame]) {
        self.index = 0;
        self.delegate = self;
        
        self.firstView.frame = CGRectMake(0, 0, Screen_Width, ViewHeight);
        self.firstBtn.frame = CGRectMake(0, ViewHeight/2-9, 48, 18);
        self.firstLabel.frame = CGRectMake(CGRectGetMaxX(self.firstBtn.frame)+2, ViewHeight/2-15, Screen_Width-140, 30);
        self.firstBtn1.frame = CGRectMake(0, 12, 48, 18);
        self.firstLabel1.frame = CGRectMake(CGRectGetMaxX(self.firstBtn1.frame)+2, 10, Screen_Width-140, 20);
        self.firstBtn2.frame = CGRectMake(0, CGRectGetMaxY(self.firstBtn1.frame)+5, 48, 18);
        self.firstLable2.frame = CGRectMake(CGRectGetMaxX(self.firstBtn2.frame)+2, CGRectGetMaxY(self.firstLabel1.frame)+5, Screen_Width-140, 20);
        
        self.secondView.frame = CGRectMake(0, ViewHeight, Screen_Width, ViewHeight);
        self.secondBtn.frame = CGRectMake(0, ViewHeight/2-9, 48, 18);
        self.secondLabel.frame = CGRectMake(CGRectGetMaxX(self.secondBtn.frame)+2, ViewHeight/2-15, Screen_Width-140, 30);
        self.secondBtn1.frame = CGRectMake(0, 12, 48, 18);
        self.secondLabel1.frame = CGRectMake(CGRectGetMaxX(self.secondBtn1.frame)+2, 10, Screen_Width-140, 20);
        self.secondBtn2.frame = CGRectMake(0, CGRectGetMaxY(self.secondBtn1.frame)+5, 48, 18);
        self.secondLabel2.frame = CGRectMake(CGRectGetMaxX(self.secondBtn2.frame)+2, CGRectGetMaxY(self.secondLabel1.frame)+5, Screen_Width-140, 20);
    }
    
    return self;
}

-(void)setDataWithArray:(NSArray *)typeArray AndTitleArray:(NSArray *)titleArray{
    
    NSMutableArray *tmpArray = [NSMutableArray arrayWithCapacity:0];
    NSMutableArray<NSArray *> *finalArray = [NSMutableArray arrayWithCapacity:0];
    
    [titleArray enumerateObjectsUsingBlock:^(NSString *obj, NSUInteger idx, BOOL * _Nonnull stop) {
        [tmpArray addObject:obj];
        if ((idx +1) % 2 == 0) {
            [finalArray addObject:[NSArray arrayWithArray:tmpArray]];
            [tmpArray removeAllObjects];
        } else {
            if (idx == (titleArray.count - 1)) {
                [finalArray addObject:[NSArray arrayWithArray:tmpArray]];
                [tmpArray removeAllObjects];
            }
        }
    }];
    
    NSMutableArray *tmpArray2 = [NSMutableArray arrayWithCapacity:0];
    NSMutableArray<NSArray *> *finalArray2 = [NSMutableArray arrayWithCapacity:0];
    
    [typeArray enumerateObjectsUsingBlock:^(NSString *obj, NSUInteger idx, BOOL * _Nonnull stop) {
        [tmpArray2 addObject:obj];
        if ((idx +1) % 2 == 0) {
            [finalArray2 addObject:[NSArray arrayWithArray:tmpArray2]];
            [tmpArray2 removeAllObjects];
        } else {
            if (idx == (typeArray.count - 1)) {
                [finalArray2 addObject:[NSArray arrayWithArray:tmpArray2]];
                [tmpArray2 removeAllObjects];
            }
        }
    }];
    self.types = [NSMutableArray arrayWithArray:finalArray2];
    self.titles = [NSMutableArray arrayWithArray:finalArray];
    [self setDataWithIndex:self.index];
    [NSTimer scheduledTimerWithTimeInterval:3.0 target:self selector:@selector(nextView) userInfo:nil repeats:YES];
}

- (void)setDataWithIndex:(int)index{
    NSArray *array = self.titles[index];
    NSArray *typeArray = self.types[index];
    //根据单双数设置单行和双行Label的显示和隐藏
    if (array.count==1) {
        self.firstLabel.text = array[0];
        self.firstLabel.hidden = NO;
        self.firstLabel1.hidden = YES;
        self.firstLable2.hidden = YES;
    }else{
        self.firstLabel1.text = array[0];
        self.firstLable2.text = array[1];
        self.firstLabel1.hidden = NO;
        self.firstLable2.hidden = NO;
        self.firstLabel.hidden = YES;
    }
    if (typeArray.count == 1) {
        self.firstBtn.text = typeArray[0];
        self.firstBtn.hidden = NO;
        self.firstBtn1.hidden = YES;
        self.firstBtn2.hidden = YES;
    }else{
        self.firstBtn1.text = typeArray[0];
        self.firstBtn2.text = typeArray[1];
        self.firstBtn1.hidden = NO;
        self.firstBtn2.hidden = NO;
        self.firstBtn.hidden = YES;
    }
    NSArray *nextArray = nil;
    NSArray *nextTypeArray = nil;          //数组循环
    if (index==self.titles.count-1) {
        nextArray = self.titles[0];
    }else{
        nextArray = self.titles[index+1];
    }
    if (index==self.types.count-1) {
        nextTypeArray = self.types[0];
    }else{
        nextTypeArray = self.types[index+1];
    }
    if (nextArray.count==1) {
        self.secondLabel.text = nextArray[0];
        self.secondLabel.hidden = NO;
        self.secondLabel1.hidden = YES;
        self.secondLabel2.hidden = YES;
    }else{
        self.secondLabel1.text = nextArray[0];
        self.secondLabel2.text = nextArray[1];
        self.secondLabel1.hidden = NO;
        self.secondLabel2.hidden = NO;
        self.secondLabel.hidden = YES;
    }
    if (nextTypeArray.count==1) {
        self.secondBtn.text = nextTypeArray[0];
        self.secondBtn.hidden = NO;
        self.secondBtn1.hidden = YES;
        self.secondBtn2.hidden = YES;
    }else{
        self.secondBtn1.text = nextTypeArray[0];
        self.secondBtn2.text = nextTypeArray[1];
        self.secondBtn1.hidden = NO;
        self.secondBtn2.hidden = NO;
        self.secondBtn.hidden = YES;
    }
}

-(void)nextView{
    [self setContentOffset:CGPointMake(0, ViewHeight) animated:YES];
}


- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    if (scrollView.contentOffset.y==ViewHeight) {
        
        if (self.index == self.titles.count-1) {
            self.index = 0;
        }else{
            self.index++;
        }
        [self setDataWithIndex:self.index];
        [scrollView setContentOffset:CGPointMake(0, 0) animated:NO];
    }
    
}

- (UIView *)firstView
{
    if (!_firstView) {
        _firstView = [[UIView alloc] init];
        _firstView.backgroundColor = [UIColor whiteColor];
        [self addSubview:_firstView];
        [self.firstView addSubview:self.firstBtn];
        [self.firstView addSubview:self.firstLabel];
        [self.firstView addSubview:self.firstBtn1];
        [self.firstView addSubview:self.firstLabel1];
        [self.firstView addSubview:self.firstBtn2];
        [self.firstView addSubview:self.firstLable2];
    }
    return _firstView;
}

- (UILabel *)firstBtn
{
    if (!_firstBtn) {
        _firstBtn = [[UILabel alloc] init];
        _firstBtn.textAlignment = NSTextAlignmentCenter;
        _firstBtn.layer.borderWidth = 1.0;
        _firstBtn.layer.borderColor = OrangeColor.CGColor;
        _firstBtn.font = [UIFont systemFontOfSize:11];
        _firstBtn.layer.cornerRadius = 3.0;
        _firstBtn.textColor = OrangeColor;
    }
    return _firstBtn;
}

- (UILabel *)firstLabel
{
    if (!_firstLabel) {
        _firstLabel = [[UILabel alloc] init];
        _firstLabel.font = [UIFont systemFontOfSize:13.0];
        _firstLabel.textColor = [UIColor darkGrayColor];
    }
    return _firstLabel;
}

- (UILabel *)firstBtn1
{
    if (!_firstBtn1) {
        _firstBtn1 = [[UILabel alloc] init];
        _firstBtn1.layer.borderWidth = 1.0;
        _firstBtn1.textAlignment = NSTextAlignmentCenter;
        _firstBtn1.layer.borderColor = OrangeColor.CGColor;
        _firstBtn1.font = [UIFont systemFontOfSize:11];
        _firstBtn1.layer.cornerRadius = 3.0;
        _firstBtn1.textColor = OrangeColor;
    }
    return _firstBtn1;
}

- (UILabel *)firstLabel1
{
    if (!_firstLabel1) {
        _firstLabel1 = [[UILabel alloc] init];
        _firstLabel1.font = [UIFont systemFontOfSize:13.0];
        _firstLabel1.textColor = [UIColor darkGrayColor];
    }
    return _firstLabel1;
}

- (UILabel *)firstBtn2
{
    if (!_firstBtn2) {
        _firstBtn2 = [[UILabel alloc] init];
        _firstBtn2.layer.borderWidth = 1.0;
        _firstBtn2.layer.borderColor = OrangeColor.CGColor;
        _firstBtn2.font = [UIFont systemFontOfSize:11];
        _firstBtn2.textAlignment = NSTextAlignmentCenter;
        _firstBtn2.layer.cornerRadius = 3.0;
        _firstBtn2.textColor = OrangeColor;
    }
    return _firstBtn2;
}

- (UILabel *)firstLable2
{
    if (!_firstLable2) {
        _firstLable2 = [[UILabel alloc] init];
        _firstLable2.font = [UIFont systemFontOfSize:13.0];
        _firstLable2.textColor = [UIColor darkGrayColor];
    }
    return _firstLable2;
}

- (UIView *)secondView
{
    if (!_secondView) {
        _secondView = [[UIView alloc] init];
        _secondView.backgroundColor = [UIColor whiteColor];
        [self addSubview:_secondView];
        [self.secondView addSubview:self.secondBtn];
        [self.secondView addSubview:self.secondLabel];
        [self.secondView addSubview:self.secondBtn1];
        [self.secondView addSubview:self.secondLabel1];
        [self.secondView addSubview:self.secondBtn2];
        [self.secondView addSubview:self.secondLabel2];
    }
    return _secondView;
}

- (UILabel *)secondBtn
{
    if (!_secondBtn) {
        _secondBtn = [[UILabel alloc] init];
        _secondBtn.layer.borderWidth = 1.0;
        _secondBtn.layer.borderColor = [UIColor redColor].CGColor;
        _secondBtn.font = [UIFont systemFontOfSize:11];
        _secondBtn.textAlignment = NSTextAlignmentCenter;
        _secondBtn.layer.cornerRadius = 3.0;
        _secondBtn.textColor =[UIColor redColor];
    }
    return _secondBtn;
}

- (UILabel *)secondLabel
{
    if (!_secondLabel) {
        _secondLabel = [[UILabel alloc] init];
        _secondLabel.font = [UIFont systemFontOfSize:13.0];
        _secondLabel.textColor = [UIColor darkGrayColor];
    }
    return _secondLabel;
}

- (UILabel *)secondBtn1
{
    if (!_secondBtn1) {
        _secondBtn1 = [[UILabel alloc] init];
        _secondBtn1.layer.borderWidth = 1.0;
        _secondBtn1.layer.borderColor = [UIColor redColor].CGColor;
        _secondBtn1.font = [UIFont systemFontOfSize:11];
        _secondBtn1.layer.cornerRadius = 3.0;
        _secondBtn1.textAlignment = NSTextAlignmentCenter;
        _secondBtn1.textColor = [UIColor redColor];
    }
    return _secondBtn1;
}

- (UILabel *)secondLabel1
{
    if (!_secondLabel1) {
        _secondLabel1 = [[UILabel alloc] init];
        _secondLabel1.font = [UIFont systemFontOfSize:13.0];
        _secondLabel1.textColor = [UIColor darkGrayColor];
    }
    return _secondLabel1;
}

- (UILabel *)secondBtn2
{
    if (!_secondBtn2) {
        _secondBtn2 = [[UILabel alloc] init];
        _secondBtn2.layer.borderWidth = 1.0;
        _secondBtn2.layer.borderColor = [UIColor redColor].CGColor;
        _secondBtn2.font = [UIFont systemFontOfSize:11];
        _secondBtn2.layer.cornerRadius = 3.0;
        _secondBtn2.textAlignment = NSTextAlignmentCenter;
        _secondBtn2.textColor = [UIColor redColor];
    }
    return _secondBtn2;
}

- (UILabel *)secondLabel2
{
    if (!_secondLabel2) {
        _secondLabel2 = [[UILabel alloc] init];
        _secondLabel2.font = [UIFont systemFontOfSize:13.0];
        _secondLabel2.textColor = [UIColor darkGrayColor];
    }
    return _secondLabel2;
}

使用方法:

NSArray *dataTypeArray = @[@"类型1",@"类型2",@"类型3",@"类型4",@"类型5"];
NSArray *dataTitleArray = @[@"默认标题1",@"默认标题2",@"默认标题3",@"默认标题4",@"默认标题5"];
VierticalScrollView *rollView = [[VierticalScrollView alloc] initWithFrame:CGRectMake(CGRectGetMaxX(imageV.frame), 100, self.view.frame.size.width, 60)];
[rollView setDataWithArray:dataTypeArray AndTitleArray:dataTitleArray];
[self.view addSubview:rollView];

GitHub地址

Kane619
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
iOS仿淘宝商品详情视频图片轮播 2019年版本淘宝
07-13
仿视频与图片混合轮播，用的最新的苹果系统播放器，以及sdcyclescrollview
iOS开发工具,ios开发类库
u014616159的博客
08-23 1万+
,iosUI组件介绍,iOS开发常用工具整理,ios开发总结 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SDWebImage多个缩略图缓存组件 UICKeyChainStore存放用户账号密码组件 Reachability监测网络状态 DateTools友好化时间 MBProgressHUD一款提示框第三方库 M...
iOS仿淘宝，上拉进入​​详情页面
Lea__DongYang的博客
05-08 1365
今天做的主要是一个模仿淘宝，上拉进入​​商品详情的功能，主要是通过tableView与webView一起来实现的，当然也可以根据自己的需要把webView替换成你想要的 [objc]  查看纯文本      //   // ViewController.m   //仿淘宝，上拉进入​​详情   //   //由Amydom在16/11/2
转：：iOS 仿淘宝,上拉进入详情页面
weixin_33816821的博客
05-31 290
今天做的主要是一个模仿淘宝,上拉进入商品详情的功能,主要是通过 tableView 与 webView 一起来实现的,当然也可根据自己的需要把 webView 替换成你想要的 1 // 2 // ViewController.m 3 // 仿淘宝,上拉进入详情 4 // 5 // Created by Amydom on 16/11/22. 6 ...
移动端实现swiper轮播的图片视频播放video，仿淘宝商品详情的视频播放（兼容ios和android）
qq_42097490的博客
05-26 2868
前段时间项目里需要，实现仿淘宝图片视频切换的功能，在网上找了很久，根据网上所收集的信息，最后整合实现项目需求，这里兼容了ios和android，直接拿来用即可，这里是用来记录学习使用的，大家有什么问题可以共同交流，直接上代码 html: <div class="videos"> <div id="wrapper"> <div class="carousels"> <div class="swiper-container case">
IOS开发实践篇--UITableview嵌套UITableView案例实践（仿淘宝商品详情页实现）
热门推荐
yixiangboy的博客
03-29 1万+
一、案例演示IOS中提供的UITableView功能非常强大，section提供分组，cell提供显示，几乎可以应付绝大部分场景。最近想模仿旧版的淘宝的商品详情页（最新的淘宝详情页商品详情和图文详情是两个页面）写一个Demo，后来发现单纯使用UITableView来布局是比较困难的。因为旧版的淘宝详情页中，最外层的View肯定是一个UITableView，但是内层的Tab中，图文介绍、商品详情和评价
ios-UITableview嵌套UITableView案例实践（仿淘宝商品详情页实现）.zip
07-11
项目讲解地址：http://blog.csdn.net/yixiangboy/article/details/51009010。 代码请到github上下载，有更新：https://github.com/yixiangboy/YX_UITableView_IN_UITableView。 如果对你有用，star一下吧。
ios 类似淘宝商品详情页面的效果
一名开发者
12-17 7077
今天试着写ios 类似淘宝商品详情页面的效果 我用到的第三方库EGORefreshTableHeaderView下拉刷新的效果还有就是PWLoadMoreTableFooterView上拉加载更多 主要的思路在于UISCrollView两页，一页展示商品概况，另一页展示商品更多详情 首先，第一页的view包含一个UITableView，这个tableView实现PWLoadMoreTable
仿淘宝头条
06-27
实现了类似淘宝头条的滚动显示一些新闻或者热卖商品，可自定义文字，图片，宽高，样式，里面有详细的注释，核心代码已封装
iOS仿淘宝商品详情页
08-15
仿淘宝商品详情页
ios-仿淘宝详情页滑动效果.zip
07-11
仿淘宝详情页,上下滑动时标签选中更改,点击标签滑动到固定位置
ios-简单模仿淘宝详情页.zip
07-11
之前做了淘宝商品加入购物车的弹出视图，有朋友说要做淘宝详情页不好做，我试着做了一下，简单模仿，并未完全把淘宝详情页的功能写出来，按钮的点击方法也都写了，只是没有实现，有需要的朋友可自行实现，希望对大家有帮助（代码习惯不好，勿喷）
IOS 仿淘宝详情页面上下分页效果
02-26
IOS 仿淘宝详情页面上下分页效果，利用两个UIscrollview的上拉和下拉的代理方法实现
IOS仿淘宝商品详情UI实现
04-27
IOS仿淘宝商品详情UI实现 使用了MJReFlash控件，没有封装，为大家提供提供思路吧。
iOS自定义UITabBar仿今日头条效果
08-29
主要为大家详细介绍了iOS自定义UITabBar仿今日头条效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
IOS仿今日头条滑动导航栏
01-04
之前在软件开发网平台给大家分享了网易首页导航封装类、网易首页导航封装类优化,今天在前两个的基础上仿下今日头条。 1.网易首页导航封装类中主要解决了上面导航的ScrollView和下面的页面的ScrollView联动的问题,...
ios 仿淘宝自定义TabBar
smk524198002的专栏
09-03 4537
iOS 自带的TabBar样式比较单一，很多时候需要自定义，仿淘宝的效果如下： 自定义TabBar的类MainController继承UITabBarController #import @interface MainController : UITabBarController { @private UIButton *homeBtn; UIB
iOS 模仿淘宝的首页UI
努力，可能成功！放弃，注定失败！
04-19 6243
要看UICollectionView的可以关了 全程都是tableview加button和autolayout 最近用autolayout真是越来越顺手了 Level:菜鸟 环境：Xcode7.3 iOS9.3 效果： 6s.gif 顶部轮播就不弄了。 好用的轮播传送： https://github.com/gsdios/SDCycleScrollView 图片
ios仿今日头条滑块滑动
最新发布
10-19
总而言之，要实现iOS仿今日头条滑块滑动效果，需要借助UIScrollView或UICollectionView来布局和管理滑块，结合UIPageControl、UITapGestureRecognizer和UIView动画来实现滑块的滑动、点击和平滑滑动效果，并可以添加...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值