JXCategoryView 上滑页面,悬浮表头,类似淘宝首页


pod引入

pod'JXCategoryView'                #  首页样式 列表分类
pod'JXPagingView/Pager', '~> 1.1.19'  #  首页样式 列表轮播

实现

controller.m  实例化 列表、表头

引入代理

JXPagerViewDelegate,JXCategoryViewDelegate ,JXPagerMainTableViewGestureDelegate

@property (nonatomic, strong) JXPagerView *pagingView;

@property (nonatomic, strong) JXCategoryTitleView *categoryView;

   self.categoryView = [[JXCategoryTitleView alloc] initWithFrame:CGRectMake(20, 10, 320, 60)];

    self.categoryView.layer.cornerRadius = 14;

    self.categoryView.titles = @[@"衣服", @"包包", @"化妆品"];

    self.categoryView.backgroundColor = [UIColor whiteColor];

    self.categoryView.delegate = self;

    self.categoryView.titleSelectedColor = [UIColor Color];//选中颜色

    self.categoryView.titleColor = [UIColor blackColor];//未选中颜色

    self.categoryView.titleFont = [UIFont boldSystemFontOfSize:22];//选中字体大小

    self.categoryView.titleSelectedFont = [UIFont boldSystemFontOfSize:16];//未选中字体大小

    self.categoryView.titleColorGradientEnabled = YES;

    self.categoryView.titleLabelZoomEnabled = YES;

    self.categoryView.titleLabelZoomEnabled = YES;

//    titleview下面的线

    JXCategoryIndicatorLineView *lineView = [[JXCategoryIndicatorLineView alloc] init];

    lineView.indicatorColor = kNColorPink;

    lineView.indicatorWidth=30;

    self.categoryView.indicators = @[lineView];

    _pagingView = [[JXPagerView alloc] initWithDelegate:self];

    _pagingView.mainTableView.gestureDelegate = self;

    [self.view addSubview:self.pagingView];

    //FIXME:如果和JXPagingView联动

    //'JXPagingView/Pager', '~> 1.1.19'  高版本没有此属性

    self.categoryView.contentScrollView = self.pagingView.listContainerView.collectionView;

    self.navigationController.interactivePopGestureRecognizer.enabled = (self.categoryView.selectedIndex == 0);

    [self.view addSubview:self.categoryView];

代理

#pragma mark - JXPagingViewDelegate

- (UIView *)tableHeaderViewInPagerView:(JXPagerView *)pagerView {

    HomePageHeaderView*headerView = [[HomePageHeaderView alloc] initWithFrame: CGRectMake(0, 10, 320,200)];

    return headerView;     //悬浮表头的上面部分在这里实例化

}

- (NSUInteger)tableHeaderViewHeightInPagerView:(JXPagerView *)pagerView {

    return 200;     //悬浮表头的上面部分  高度

}

- (NSUInteger)heightForPinSectionHeaderInPagerView:(JXPagerView *)pagerView {

    return 60;       //悬浮表头  高度

}

- (UIView *)viewForPinSectionHeaderInPagerView:(JXPagerView *)pagerView {

    return  self.categoryView;     //悬浮表头 

}

- (NSInteger)numberOfListsInPagerView:(JXPagerView *)pagerView {

    return 3;        //列表数量   =   悬浮表头title数量

}

 //实例列表 

- (id)pagerView:(JXPagerView *)pagerView initListAtIndex:(NSInteger)index {

    RedListView *list = [[RedListView alloc] init];

    return  list;    

}

#pragma mark - JXCategoryViewDelegate

- (void)categoryView:(JXCategoryBaseView *)categoryView didSelectedItemAtIndex:(NSInteger)index {

    self.navigationController.interactivePopGestureRecognizer.enabled = (index == 0);

}

#pragma mark - JXPagerMainTableViewGestureDelegate

//解决左右滑动冲突

- (BOOL)mainTableViewGestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {

    //禁止scrollView左右滑动的时候,上下和左右都可以滚动 

    // self.headerView  即 悬浮表头的上面部分在这里实例化
    //HomePageHeaderView*headerView = [[HomePageHeaderView alloc] initWithFrame: CGRectMake(0, 10, 320,200)]; 

    if (otherGestureRecognizer == self.headerView.scrollView.panGestureRecognizer) {

        returnNO;

    }

    return [gestureRecognizer isKindOfClass:[UIPanGestureRecognizer class]] && [otherGestureRecognizer isKindOfClass:[UIPanGestureRecognizer class]];

}

你可能感兴趣的:(JXCategoryView 上滑页面,悬浮表头,类似淘宝首页)