SectionIndexTitles的UICollectionView(SectionIndexTi

2019-07-05 08:13发布

所以,我实现了一个正确TableView与搜索功能和sectionIndexTitles 。 现在,我想实现一个UICollectionView ,它是工作,到目前为止,除了我不能轻易拥有sectionIndexTitles (右侧滚动条)。

如果我看的Facebook应用程序,它看起来像一个UICollectionView ,但确实sectionIndexTitles和搜索栏。 我似乎无法找到的这种功能UICollectionView模型。

有任何想法吗?!

谢谢!

Answer 1:

我有一个类似的规定(一水平收集视图),并最终建立一个索引视图子类自己。

我打算开源,但可能会在未来要等到下个月,所以这里的存根让你开始:

YMCollectionIndexView.h

@interface YMCollectionIndexView : UIControl

- (id) initWithFrame:(CGRect)frame indexTitles:(NSArray *)indexTitles;

// Model
@property (strong, nonatomic) NSArray *indexTitles; // NSString
@property (readonly, nonatomic) NSUInteger currentIndex;
- (NSString *)currentIndexTitle;

@end

YMCollectionIndexView.m

#import "YMCollectionIndexView.h"

@interface YMCollectionIndexView ()
@property (readwrite, nonatomic) NSUInteger currentIndex;
@property (strong, nonatomic) NSArray *indexLabels;
@end

@implementation YMCollectionIndexView

- (id) initWithFrame:(CGRect)frame indexTitles:(NSArray *)indexTitles {
    self = [super initWithFrame:frame];
    if (self) {
        self.indexTitles = indexTitles;
        self.currentIndex = 0;
        // add pan recognizer
    }
    return self;
}

- (void)setIndexTitles:(NSArray *)indexTitles {
    if (_indexTitles == indexTitles) return;
    _indexTitles = indexTitles;
    [self.indexLabels makeObjectsPerformSelector:@selector(removeFromSuperview)];
    [self buildIndexLabels];
}

- (NSString *)currentIndexTitle {
    return self.indexTitles[self.currentIndex];
}

#pragma mark - Subviews

- (void) buildIndexLabels {
    CGFloat cumulativeItemWidth = 0.0; // or height in your (vertical) case
    for (NSString *indexTitle in self.indexTitles) {
            // build and add label
        // add tap recognizer
    }
    self.indexLabels = indexLabels;
}

#pragma mark - Gestures

- (void) handleTap:(UITapGestureRecognizer*)recognizer {
    NSString *indexTitle = ((UILabel *)recognizer.view).text;
    self.currentIndex = [self.indexTitles indexOfObject:indexTitle];
    [self sendActionsForControlEvents:UIControlEventTouchUpInside];
}

// similarly for pan recognizer

@end

在您的视图控制器:

- (void)viewDidLoad {
    [super viewDidLoad];
    [self.collectionIndexView addTarget:self action:@selector(indexWasTapped:) forControlEvents:UIControlEventTouchUpInside];
    // similarly for pan recognizer
}

- (void)indexWasTapped:(id)sender {
    [self.collectionView scrollToIndexPath:...];
}

// similarly for pan recognizer


Answer 2:

你有没有找到任何解决办法?

我试图实施UICollectionView相同的功能。

到目前为止,对于sectionIndexTitles我使用的是相同的部分与原UICollectionView自定义的UITableView,但空单元格。 因此,我有一个IndexTableView类

indexTableView = [[IndexTableView alloc] initWithFrame:CGRectZero];
[self.view addSubview:indexTableView];

...

indexTableView.frame = CGRectMake(CGRectGetWidth(self.view.frame) - 40, 0, 40, CGRectGetHeight(self.view.frame));
indexTableView.separatorStyle = UITableViewCellSeparatorStyleNone;
indexTableView.sectionHeaderHeight = 0;
indexTableView.backgroundColor = [UIColor clearColor];

我想补充的UICollectionView的顶部IndexTableView,并得到了作为原始的UITableView相同的视觉效果。 现在,我试图链接索引选择和UICollectionView并使其发挥作用。

编辑:我刚刚加入一个UISearchBar到UICollectionController

下面的代码添加到您的UICollectionController的子类

- (void)viewDidLoad
{
    [super viewDidLoad];
...
    self.searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(0, 0, self.collectionView.frame.size.width, 44)];
    self.searchBar.autocorrectionType = UITextAutocorrectionTypeNo;
    self.searchBar.delegate = self;
    [self.collectionView addSubview:self.searchBar];
    [self.collectionView setContentOffset:CGPointMake(44, 0)];
}

- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {
    if (section == 0) {
        return UIEdgeInsetsMake(CGRectGetHeight(self.searchBar.frame), 6, 0, 6);
    }
    return UIEdgeInsetsMake(0, 6, 0, 6);
}


Answer 3:

现在,您可以简单地使用(如iOS的10.3)

optional func indexTitles(for collectionView: UICollectionView) -> [String]?

它期望像的数组['A', 'B' ,'C']作为它的返回值。



Answer 4:

您可以通过实现和以下函数返回值,提供这个头UICollectionViewDataSource

collectionView:viewForSupplementaryElementOfKind:atIndexPath:

请注意,标头的大小将是从的CGRect的高度值从返回UICollectionViewFlowLayoutDelegate方法的CollectionView:布局:referenceSizeForHeaderInSection:



文章来源: SectionIndexTitles for a UICollectionView