在UICollectionView中设置边框

这是我第一次创build一个UICollectionView。 这是我想要的样子:

在这里输入图像说明

我读了一些教程,我知道它是如何工作的。 事情就像你在图像中看到的那样,UICollection单元格有上,下,左,右的边界。 你知道如何在Collection View中设置这种边框吗?

当你看到两个项目被选中的红色。 在UICollectionView有可能有多个选定的项目? 如果是的话,可否请给我一些教程。

小例子项目在这里: https : //github.com/erikt/ETMultiSelect

首先你必须在UICollectionViewselect多个单元格。 这是通过在集合视图allowsMultipleSelection属性设置为YES来完成的。

视图控制器看起来像这样:

 #import "ETViewController.h" #import "ETCellView.h" @implementation ETViewController static NSString *cellIdentifier = @"cvCell"; - (void)viewDidLoad { [super viewDidLoad]; // Register our custom collection view cell [self.collectionView registerClass:ETCellView.class forCellWithReuseIdentifier:cellIdentifier]; // Make it possible to select multiple cells self.collectionView.allowsMultipleSelection = YES; } #pragma mark - UICollectionViewDataSource - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView { return 1; } - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return 10; } #pragma mark - UICollectionViewDelegate - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { ETCellView *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier forIndexPath:indexPath]; return cell; } @end 

UICollectionViewCell由几个视图组成。 它有一个内容视图,一个背景视图和一个选定的背景视图。

有许多方法可以实现类似于您的图片的function,但是我在所选的背景图层上设置了边框,并在插入的内容视图中添加了一个子视图,以便背景边框可见:

 #import "ETCellView.h" #import <QuartzCore/QuartzCore.h> @implementation ETCellView - (id)initWithFrame:(CGRect)frame { self = [super initWithFrame:frame]; if (self) { self.restorationIdentifier = @"cvCell"; self.backgroundColor = [UIColor clearColor]; self.autoresizingMask = UIViewAutoresizingNone; CGFloat borderWidth = 3.0f; UIView *bgView = [[UIView alloc] initWithFrame:frame]; bgView.layer.borderColor = [UIColor redColor].CGColor; bgView.layer.borderWidth = borderWidth; self.selectedBackgroundView = bgView; CGRect myContentRect = CGRectInset(self.contentView.bounds, borderWidth, borderWidth); UIView *myContentView = [[UIView alloc] initWithFrame:myContentRect]; myContentView.backgroundColor = [UIColor whiteColor]; myContentView.layer.borderColor = [UIColor colorWithWhite:0.5f alpha:1.0f].CGColor; myContentView.layer.borderWidth = borderWidth; [self.contentView addSubview:myContentView]; } return self; } @end 

结果是这样的:

iPhone屏幕截图

克隆和玩示例项目 。

在一个真实的项目中,您将需要跟踪用户在视图控制器中select的内容,方法是将选定的数据模型实体添加到UICollectionViewDelegate协议的– collectionView:didSelectItemAtIndexPath:方法中的某个结构(如NSMutableArray )。