思路:
精华控制器添加一个UIScrollView, UIScrollView上添加五个UITableView,且每个UITableView可以上下滑动、互不影响,每个TableView又可以左右切换。(超出scrollView部分会被剪掉)
/* 思路: 精华控制器添加一个UIScrollView, UIScrollView上添加五个UITableView,且每个UITableView可以上下滑动、互不影响,每个TableView又可以左右切换。(超出scrollView部分会被剪掉) // UIBarButtonItem:描述按钮具体的内容 // UINavigationItem:设置导航条上内容(左边,右边,中间) // tabBarItem: 设置tabBar上按钮内容(tabBarButton) */ #import "HKEssenceViewController.h" #import "HKTitleButton.h" #import "HKAllViewController.h" #import "HKVideoViewController.h" #import "HKVoiceViewController.h" #import "HKWordViewController.h" #import "HKPictureViewController.h" @interface HKEssenceViewController ()<UIScrollViewDelegate> /** 用来存放所有子控制器view的scrollView */ @property (nonatomic, weak) UIScrollView *scrollView; /** 标题栏 */ @property (nonatomic, weak) UIView *titlesView; /** 标题下划线 */ @property (nonatomic, weak) UIView *titleUnderline; /** 上一次点击的标题按钮 */ @property (nonatomic, weak) HKTitleButton *previousClickedTitleButton; @end @implementation HKEssenceViewController - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. self.view.backgroundColor = kWhiteColor; // 初始化子控制器 [self setupAllChildVcs]; // 设置导航条 [self setupNavBar]; // scrollView [self setupScrollView]; // 标题栏 [self setupTitlesView]; } /** * 初始化子控制器,分模块管理 */ - (void)setupAllChildVcs { [self addChildViewController:[[HKAllViewController alloc] init]]; [self addChildViewController:[[HKVideoViewController alloc] init]]; [self addChildViewController:[[HKVoiceViewController alloc] init]]; [self addChildViewController:[[HKPictureViewController alloc] init]]; [self addChildViewController:[[HKWordViewController alloc] init]]; } - (void)setupNavBar { // 左边按钮 // 把UIButton包装成UIBarButtonItem.就导致按钮点击区域扩大 self.navigationItem.leftBarButtonItem = [UIBarButtonItem itemWithimage:[UIImage imageNamed:@"nav_item_game_icon"] highImage:[UIImage imageNamed:@"nav_item_game_click_icon"] target:self action:@selector(game)]; // 右边按钮 self.navigationItem.rightBarButtonItem = [UIBarButtonItem itemWithimage:[UIImage imageNamed:@"navigationButtonRandom"] highImage:[UIImage imageNamed:@"navigationButtonRandomClick"] target:self action:@selector(game)]; // titleView self.navigationItem.titleView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"MainTitle"]]; } - (void)game { } /** scrollView */ - (void)setupScrollView { // 不允许自动修改UIScrollView的内边距 self.automaticallyAdjustsScrollViewInsets = NO; UIScrollView *scrollView = [[UIScrollView alloc] init]; scrollView.backgroundColor = [UIColor blueColor]; scrollView.frame = self.view.bounds; scrollView.showsHorizontalScrollIndicator = NO; scrollView.showsVerticalScrollIndicator = NO; scrollView.pagingEnabled = YES; scrollView.delegate = self; [self.view addSubview:scrollView]; self.scrollView = scrollView; // 添加子控制器的view NSUInteger count = self.childViewControllers.count; CGFloat scrollViewW = scrollView.width; CGFloat scrollViewH = scrollView.height; for (NSUInteger i = 0; i < count; i++) { // 取出i位置子控制器的view UIView *childVcView = self.childViewControllers[i].view; //TableViewController默认Y = 20 childVcView.frame = CGRectMake(i * scrollViewW, 0, scrollViewW, scrollViewH); [scrollView addSubview:childVcView]; } //如果TableView和scrollView都能向上滑动,这个事件交由TableView处理 scrollView.contentSize = CGSizeMake(count * scrollViewW, 0);//设置左右滑动 //TableViewController默认Y = 20 HKLog(@"%@",NSStringFromCGRect([[UIViewController alloc] init].view.frame));// {{0, 0}, {414, 736}} HKLog(@"%@",NSStringFromCGRect([[UITableViewController alloc] init].view.frame));// {{0, 20}, {414, 716}} } /** 标题栏 */ - (void)setupTitlesView { UIView *titlesView = [[UIView alloc] init]; // 设置半透明背景色 titlesView.backgroundColor = [[UIColor whiteColor] colorWithAlphaComponent:0.5]; //titlesView.backgroundColor = [UIColor colorWithWhite:1.0 alpha:0.5]; //子控件会继承父控件设置的alpha透明度 //titlesView.alpha = 0.5; titlesView.frame = CGRectMake(0, HK_NAVBAR_HEIGHT, self.view.width, 35); [self.view addSubview:titlesView]; self.titlesView = titlesView; // 标题栏按钮 [self setupTitleButtons]; // 标题下划线 [self setupTitleUnderline]; } /** * 标题栏按钮 */ - (void)setupTitleButtons { // 文字 NSArray *titles = @[@"全部", @"视频", @"声音", @"图片", @"段子"]; NSUInteger count = titles.count; // 标题按钮的尺寸 CGFloat titleButtonW = self.titlesView.width / count; CGFloat titleButtonH = self.titlesView.height; // 创建5个标题按钮 for (NSUInteger i = 0; i < count; i++) { HKTitleButton *titleButton = [[HKTitleButton alloc] init]; [titleButton addTarget:self action:@selector(titleButtonClick:) forControlEvents:UIControlEventTouchUpInside]; [self.titlesView addSubview:titleButton]; // frame titleButton.frame = CGRectMake(i * titleButtonW, 0, titleButtonW, titleButtonH); titleButton.tag = i; // 文字 [titleButton setTitle:titles[i] forState:UIControlStateNormal]; [titleButton setTitleColor:[UIColor darkGrayColor] forState:UIControlStateNormal]; [titleButton setTitleColor:[UIColor redColor] forState:UIControlStateSelected]; //[titleButton setTitleColor:[UIColor redColor] forState:UIControlStateDisabled]; } } /** * 标题下划线 */ - (void)setupTitleUnderline { // 标题按钮 HKTitleButton *firstTitleButton = self.titlesView.subviews.firstObject; // 下划线 UIView *titleUnderline = [[UIView alloc] init]; titleUnderline.height = 2; titleUnderline.y = self.titlesView.height - titleUnderline.height; titleUnderline.backgroundColor = [firstTitleButton titleColorForState:UIControlStateSelected]; [self.titlesView addSubview:titleUnderline]; self.titleUnderline = titleUnderline; // 切换按钮状态 firstTitleButton.selected = YES; self.previousClickedTitleButton = firstTitleButton; [firstTitleButton.titleLabel sizeToFit]; // 让label根据文字内容计算尺寸 self.titleUnderline.width = firstTitleButton.titleLabel.width + 10; self.titleUnderline.centerX = firstTitleButton.centerX; } #pragma mark - 监听 /** * 点击标题按钮 */ - (void)titleButtonClick:(HKTitleButton *)titleButton { self.previousClickedTitleButton.selected = NO; titleButton.selected = YES; self.previousClickedTitleButton = titleButton; [UIView animateWithDuration:0.25 animations:^{ // 处理下划线 HKLog(@"%@", [titleButton titleForState:UIControlStateNormal]) //titleLabel.text 要根据状态取,一般采用currentTitle //self.titleUnderline.width = [titleButton.currentTitle sizeWithFont:titleButton.titleLabel.font].width; //NSMutableDictionary *attributes = [NSMutableDictionary dictionary]; //attributes[NSFontAttributeName] = titleButton.titleLabel.font; //self.titleUnderline.width = [titleButton.currentTitle sizeWithAttributes:attributes].width; self.titleUnderline.width = titleButton.titleLabel.width + 10; self.titleUnderline.centerX = titleButton.centerX; // 滚动scrollView //NSUInteger index = [self.titlesView.subviews indexOfObject:titleButton]; //CGFloat offsetX = self.scrollView.width * index; CGFloat offsetX = self.scrollView.width * titleButton.tag; //偏移y值保持原来 self.scrollView.contentOffset = CGPointMake(offsetX, self.scrollView.contentOffset.y); }]; } #pragma mar - 数据源 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { if (tableView.tag == 0) return 10; return 20; } - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *ID = @"ID"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"ID"]; if (cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ID]; cell.backgroundColor = [UIColor clearColor]; } cell.textLabel.text = [NSString stringWithFormat:@"test-%zd", indexPath.row]; return cell; } #pragma mark - <UIScrollViewDelegate> /** * 当用户松开scrollView并且滑动结束时调用这个代理方法(scrollView停止滚动的时候) */ - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView { // 求出标题按钮的索引 NSUInteger index = scrollView.contentOffset.x / scrollView.width; // index == [0, 4] // 点击对应的标题按钮 HKTitleButton *titleButton = self.titlesView.subviews[index]; //HKTitleButton *titleButton = [self.titlesView viewWithTag:index]; //此代码 索引为0时会报错(viewWithTag 递归查找,包括自己 先查找自己的tag,再查找子视图的tag,父视图默认tag为0,找到的是UIView而不是Button,所以setSelected方法找不到) [self titleButtonClick:titleButton]; } /** * 当用户松开scrollView时调用这个代理方法(结束拖拽的时候) */ - (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate { JKFunc; } @end
效果图如下:
纯代码实现视频、声音、图片、段子Cell
/* HKTopicCell-负责公共的顶部底部(BaseCell) HKVideoCell-视频-中间-视频控件 HKVoiceCell-声音-中间-声音控件 HKPictureCel-图片-中间-图片控件 HKWordCell-段子- */ #import <UIKit/UIKit.h> NS_ASSUME_NONNULL_BEGIN @class HKTopic; @interface HKTopicCell : UITableViewCell /** 模型数据 */ @property (nonatomic, strong) HKTopic *topic; @end NS_ASSUME_NONNULL_END #import "HKTopicCell.h" #import "HKTopic.h" @implementation HKTopicCell - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier { if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) { // 增加顶部的控件,并且设置约束 // ... // 增加底部的控件,并且设置约束 // ... [self.contentView addSubview:[[UISwitch alloc] init]]; UILabel *label = [[UILabel alloc] init]; label.text = NSStringFromClass(self.class); [label sizeToFit]; label.tag = 10; [self.contentView addSubview:label]; } return self; } /* - (void)layoutSubviews { [super layoutSubviews]; // 设置顶部和底部控件的frame }*/ - (void)setTopic:(HKTopic *)topic { _topic = topic; UILabel *label = (UILabel *)[self viewWithTag:10]; label.text = [NSString stringWithFormat:@"%@ - %zd", self.class, topic.type]; [label sizeToFit]; // 设置顶部和底部控件的具体数据(比如文字数据、图片数据) } @end /* cell的重用标识 */ static NSString * const HKVideoCellId = @"HKVideoCellId"; static NSString * const HKVoiceCellId = @"HKVoiceCellId"; static NSString * const HKPictureCellId = @"HKPictureCellId"; static NSString * const HKWordCellId = @"HKWordCellId"; // 注册cell [self.tableView registerClass:[HKVideoCell class] forCellReuseIdentifier:HKVideoCellId]; [self.tableView registerClass:[HKVoiceCell class] forCellReuseIdentifier:HKVoiceCellId]; [self.tableView registerClass:[HKPictureCell class] forCellReuseIdentifier:HKPictureCellId]; [self.tableView registerClass:[HKWordCell class] forCellReuseIdentifier:HKWordCellId]; //根据type区分 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { HKTopic *topic = self.topics[indexPath.row]; HKTopicCell *cell = nil; if (topic.type == 10) { // 图片 cell = [tableView dequeueReusableCellWithIdentifier:HKPictureCellId]; } else if (topic.type == 29) { // 段子 cell = [tableView dequeueReusableCellWithIdentifier:HKWordCellId]; } else if (topic.type == 31) { // 声音 cell = [tableView dequeueReusableCellWithIdentifier:HKVoiceCellId]; } else if (topic.type == 41) { // 视频 cell = [tableView dequeueReusableCellWithIdentifier:HKVideoCellId]; } cell.topic = topic; return cell; } /* 一般情况下,以下这些view的autoresizingMask默认就是18(UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth) 1.从xib里面创建出来的默认控件 2.控制器的view 如果不希望控件拥有autoresizingMask的自动伸缩功能,应该设置为none blueView.autoresizingMask = UIViewAutoresizingNone; */