如何在下方顶部的collections视图中为节添加标题

我正在使用search栏的集合视图。 我已经添加search栏通过鳕鱼从（0,0）orgin从顶部。 所以现在我的形象是这样的：

[！[在这里input图片描述] [1]] [1]

但我需要在我的search栏下面的标题。 我通过故事board.But，但运行我的标题名称和search栏是在相同的orgin.I需要把我的标题部分在myseaarch酒吧下面。

注：我唱3段header.any想法或代码是非常有帮助的。

在这里我的search栏的代码…

#import "CollectionViewController.h" #import "CollectionViewCell.h" @interface CollectionViewController ()<UISearchBarDelegate> @property (nonatomic,strong) NSArray *dataSource; @property (nonatomic,strong) NSArray *dataSourceForSearchResult; @property (nonatomic) BOOL searchBarActive; @property (nonatomic) float searchBarBoundsY; @property (nonatomic,strong) UISearchBar *searchBar; @property (nonatomic,strong) UIRefreshControl *refreshControl; @end @implementation CollectionViewController static NSString * const reuseIdentifier = @"Cell"; - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. // datasource used when user search in collectionView self.dataSourceForSearchResult = [NSArray new]; // normal datasource self.dataSource =@[@"Modesto",@"Rebecka",@"Andria",@"Sergio",@"Robby",@"Jacob",@"Lavera",@"Theola",@"Adella",@"Garry", @"Lawanda", @"Christiana", @"Billy", @"Claretta", @"Gina", @"Edna", @"Antoinette", @"Shantae", @"Jeniffer", @"Fred", @"Phylis", @"Raymon", @"Brenna", @"Gus", @"Ethan", @"Kimbery", @"Sunday", @"Darrin", @"Ruby", @"Babette", @"Latrisha", @"Dewey", @"Della", @"Dylan", @"Francina", @"Boyd", @"Willette", @"Mitsuko", @"Evan", @"Dagmar", @"Cecille", @"Doug", @"Jackeline", @"Yolanda", @"Patsy", @"Haley", @"Isaura", @"Tommye", @"Katherine", @"Vivian"]; } -(void)viewWillAppear:(BOOL)animated{ [super viewWillAppear:animated]; [self prepareUI]; } -(void)dealloc{ // remove Our KVO observer [self removeObservers]; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } #pragma mark - actions -(void)refreashControlAction{ [self cancelSearching]; dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{ // stop refreshing after 2 seconds [self.collectionView reloadData]; [self.refreshControl endRefreshing]; }); } #pragma mark - <UICollectionViewDataSource> - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView { return 1; } - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { if (self.searchBarActive) { return self.dataSourceForSearchResult.count; } return self.dataSource.count; } - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath]; // Configure the cell if (self.searchBarActive) { cell.laName.text = self.dataSourceForSearchResult[indexPath.row]; }else{ cell.laName.text = self.dataSource[indexPath.row]; } return cell; } #pragma mark - <UICollectionViewDelegateFlowLayout> - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{ return UIEdgeInsetsMake(self.searchBar.frame.size.height, 0, 0, 0); } - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{ CGFloat cellLeg = (self.collectionView.frame.size.width/2) - 5; return CGSizeMake(cellLeg,cellLeg);; } #pragma mark - search - (void)filterContentForSearchText:(NSString*)searchText scope:(NSString*)scope{ NSPredicate *resultPredicate = [NSPredicate predicateWithFormat:@"self contains[c] %@", searchText]; self.dataSourceForSearchResult = [self.dataSource filteredArrayUsingPredicate:resultPredicate]; } - (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText{ // user did type something, check our datasource for text that looks the same if (searchText.length>0) { // search and reload data source self.searchBarActive = YES; [self filterContentForSearchText:searchText scope:[[self.searchDisplayController.searchBar scopeButtonTitles] objectAtIndex:[self.searchDisplayController.searchBar selectedScopeButtonIndex]]]; [self.collectionView reloadData]; }else{ // if text lenght == 0 // we will consider the searchbar is not active self.searchBarActive = NO; } } - (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar{ [self cancelSearching]; [self.collectionView reloadData]; } - (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar{ self.searchBarActive = YES; [self.view endEditing:YES]; } - (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar{ // we used here to set self.searchBarActive = YES // but we'll not do that any more... it made problems // it's better to set self.searchBarActive = YES when user typed something [self.searchBar setShowsCancelButton:YES animated:YES]; } - (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar{ // this method is being called when search btn in the keyboard tapped // we set searchBarActive = NO // but no need to reloadCollectionView self.searchBarActive = NO; [self.searchBar setShowsCancelButton:NO animated:YES]; } -(void)cancelSearching{ self.searchBarActive = NO; [self.searchBar resignFirstResponder]; self.searchBar.text = @""; } #pragma mark - prepareVC -(void)prepareUI{ [self addSearchBar]; [self addRefreshControl]; } -(void)addSearchBar{ if (!self.searchBar) { self.searchBarBoundsY = self.navigationController.navigationBar.frame.size.height + [UIApplication sharedApplication].statusBarFrame.size.height; self.searchBar = [[UISearchBar alloc]initWithFrame:CGRectMake(0,self.searchBarBoundsY, [UIScreen mainScreen].bounds.size.width, 44)]; self.searchBar.searchBarStyle = UISearchBarStyleMinimal; self.searchBar.tintColor = [UIColor whiteColor]; self.searchBar.barTintColor = [UIColor whiteColor]; self.searchBar.delegate = self; self.searchBar.placeholder = @"search here"; [[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setTextColor:[UIColor whiteColor]]; // add KVO observer.. so we will be informed when user scroll colllectionView [self addObservers]; } if (![self.searchBar isDescendantOfView:self.view]) { [self.view addSubview:self.searchBar]; } } -(void)addRefreshControl{ if (!self.refreshControl) { self.refreshControl = [UIRefreshControl new]; self.refreshControl.tintColor = [UIColor whiteColor]; [self.refreshControl addTarget:self action:@selector(refreashControlAction) forControlEvents:UIControlEventValueChanged]; } if (![self.refreshControl isDescendantOfView:self.collectionView]) { [self.collectionView addSubview:self.refreshControl]; } } -(void)startRefreshControl{ if (!self.refreshControl.refreshing) { [self.refreshControl beginRefreshing]; } } #pragma mark - observer - (void)addObservers{ [self.collectionView addObserver:self forKeyPath:@"contentOffset" options:NSKeyValueObservingOptionNew | NSKeyValueObservingOptionOld context:nil]; } - (void)removeObservers{ [self.collectionView removeObserver:self forKeyPath:@"contentOffset" context:Nil]; } - (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(UICollectionView *)object change:(NSDictionary *)change context:(void *)context{ if ([keyPath isEqualToString:@"contentOffset"] && object == self.collectionView ) { self.searchBar.frame = CGRectMake(self.searchBar.frame.origin.x, self.searchBarBoundsY + ((-1* object.contentOffset.y)-self.searchBarBoundsY), self.searchBar.frame.size.width, self.searchBar.frame.size.height); } } @end 

Answer 1

通过检查属性检查器下的Section Header ，可以在故事板中添加标题 ：

您还需要在集合视图数据源中实现以下方法：

 - (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath { UICollectionReusableView *view = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header" forIndexPath:indexPath]; return view; } 

在标题的故事板中也设置标识符。

标题高度可以通过委托方法来控制：

 - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section { return CGSizeMake(0, 80); } 

以下是故事板的外观：

在手动添加search栏时，您可能无法获得正确的布局。 search栏可以添加到故事板中。 如果您select在故事板中添加search栏，则必须重新构build视图（包括您的集合视图），以便将它们包含在父视图中。 否则，您必须手动操作约束条件以获得search栏的正确位置。

Answer 2

张丹妮说，你是垂直滚动的。 所以你不能用x轴来改变位置。但是你可以做一件事情…..按照以下步骤做：

 1. Add the code @Daniel Zhang suggest and do 2. In story board make the header size height = 80, then place the label over there. 3. Then add constraint (ie as you want where to place your header title).Then give background color for label. so that it will show different from your cell,searchbar. 4. Make you cell top = 0. You can do when you click your collection view & move to size inspector. 

多数民众赞成，运行，看到你会看到你的标题不同，从单元格，search栏。

试试这个工作对我来说。如果它没有工作。试着看这个演示项目，他们使用search栏使用故事板