IOS7样式模糊了UICollectionViewCell的视图

Question

我正试图模糊UICollectionViewCell。我试过的是获取单元格的屏幕截图并模糊屏幕截图。使用模糊的屏幕截图作为背景并隐藏所有标签。

我注意到的行为是

1. 点按小区1：小区1消失

2. 点击手机2：模糊不清但我可以看出错误的手机内容已经模糊

3. 点击手机3：模糊了一点

4. 点击小区4：很多模糊

我认为的问题是：

1. 错误的细胞内容越来越模糊，

2. 当另一个单元格模糊时，Blured截图被重用，因此模糊增加。

然后我编辑了代码，将背景设置为原始的不明显的截图

1. 点按小区1：小区1消失

2. 点按手机2：手机屏幕截图

3. 点按手机3：手机屏幕截图

等等

以下是代码：

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
 //Code to get data from database and add to labels

  if(![[modelArray objectAtIndex:indexPath.row] isEqualToString:@"1"]){
      UIGraphicsBeginImageContextWithOptions(cell.overviewView.bounds.size, NO, cell.overviewView.window.screen.scale);
      [cell.overviewView drawViewHierarchyInRect:cell.overviewView.frame afterScreenUpdates:NO];
      UIImage *snapshotImage = UIGraphicsGetImageFromCurrentImageContext();
      UIGraphicsEndImageContext();

      snapshotImage = [snapshotImage applyLightEffect];

      cell.overviewView.backgroundColor = [UIColor colorWithPatternImage:snapshotImage];
      cell.overviewView.alpha = 1;

      cell.descLabel.alpha = 0;
      cell.dayLabel.alpha = 0;
      cell.weatherImage.alpha = 0;
      cell.tempLabel.alpha = 0;
  }


  NSLog(@"Cell :%d condition : %@", indexPath.row, weather.desc );
  return cell;
}
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
  WeekCell *cell = (WeekCell*)[collectionView cellForItemAtIndexPath:indexPath];
  NSLog(@"%@", cell.descLabel.text);
  if([[modelArray objectAtIndex:indexPath.row] isEqualToString:@"1"]){
     [modelArray setObject:@"0" atIndexedSubscript:indexPath.row];
  }else{
    [modelArray setObject:@"1" atIndexedSubscript:indexPath.row];
  }

  NSLog(@"sequence : %@", modelArray);
  [collectionView reloadItemsAtIndexPaths:@[indexPath]];

}

Answer 1

我只是发布你可以尝试的示例代码，

自定义UICollectionViewCell中的

我将其命名为CustomCollectionVIewCell，其nib文件如下所示

在上图中你可以看到View-backgroundVIew包含图像视图以保持模糊图像，View-ForeGround是一个包含普通图像的视图，2个标签包含绿色和黑色文本，这两个标签添加t集合视图单元格而不是任何其他视图。

单元格层次结构如下图

代码中的

将所有这些连接成单元格中的出口， CustomCollectionVIewCell.h

  @interface CustomCollectionVIewCell : UICollectionViewCell

  @property (nonatomic, assign) id<CellFooterDelegate> myCustomdelegate;//define a delegate
  @property (weak, nonatomic) IBOutlet UIView *backGroundView;
  @property (weak, nonatomic) IBOutlet UIImageView *blurImageVIew;
  @property (weak, nonatomic) IBOutlet UIView *forGroundView;
  @property (weak, nonatomic) IBOutlet UIImageView *cellImageView; 
  //..other objects

  @end

在CustomCollectionVIewCell.m中放了这个

//just frame adjustment
- (void)awakeFromNib
 {
    self.backGroundView.frame  = self.contentView.bounds;
    self.blurImageVIew.frame = self.backGroundView.bounds;

    self.forGroundView.frame = self.contentView.bounds;
    self.cellImageView.frame = self.forGroundView.bounds;
 }

并在控制器中

  -(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
 {
    CustomCollectionVIewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier forIndexPath:indexPath];
    cell.myCustomdelegate = self;
    cell.cellImageView.image = [dataSourceArray objectAtIndex:indexPath.row];
    return cell;
 }

选择单元格后，您可以将模糊图像放在下面

 - (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
 {

   CustomCollectionVIewCell *cell = (CustomCollectionVIewCell *)[collectionView cellForItemAtIndexPath:indexPath];
   UIGraphicsBeginImageContext(cell.cellImageView.bounds.size);
   [cell.forGroundView.layer renderInContext:UIGraphicsGetCurrentContext()];
   UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
   UIGraphicsEndImageContext();
   //   self.blurrImage = [image applyTintEffectWithColor:[UIColor colorWithRed:25.0f/255.0f green:77.0f/255.0f blue:108.0f/255.0f alpha:1.0f ]];
   cell.forGroundView.alpha = 0.0f;
   cell.blurImageVIew.image = [image applyLightEffect];
 }

取消选择后

只需更改前景视图的alpha值

 - (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath
 {
    CustomCollectionVIewCell *cell = (CustomCollectionVIewCell *)[collectionView cellForItemAtIndexPath:indexPath];
    cell.blurImageVIew.image = nil;
    cell.forGroundView.alpha = 1.0f;
 }

out将如下所示

希望这有助于你......：）