瀑布流的实现,Storyboard下修改控件边框颜色

作者: 新金沙平台  发布:2019-09-15

今天改公司的代码,知道怎么解决,但是不知道原因在哪,bug很简单,一个tableView,指定第二行的背景色为绿色。点击第一个按钮时,会调用reloadRowsAtIndexPaths方法重新加载第二行,点击第二个按钮时,在tableView的最后插入一行,这时,问题就来了,我插入的cell的背景色也是绿色!

今天有一个页面有很多uibutton,所以就用xib搭了界面,然后问题来了,如何在xib下修改控件的边框颜色和大小、圆角?我之前知道利用IB面板下的“UserDefined Runtime Attributes”,然后问题来了,设置圆角可以成功设置,但是设置uibutton的边框颜色不行。然后一直百度找到的方法都是跟我的做法一样,而且不行,然后想到我可以Google,好吧,第一条就出来答案了····

我们经常见到一些类似于照片墙的东西,其实它是通过自定义UICollectionViewLayout去实现的.我们仿照系统定义一些属性,利用这些属性重新布局完成照片墙的效果.

写了个Demo,终于找出问题。我们都知道cell会复用,问题的关键就在于当我们调用reloadRowsAtIndexPaths的时候,系统是重新创建了一个cell,替换掉我们想reload的cell,这样,重载之后,复用池里就已经有了一个可复用的cell,当我们再想插入cell时,系统就会从复用池里去取可用的cell(就是之前换下来的背景为绿色的cell),这样,我们插入的cell的背景就成了绿色的了。

图片 1IB 下UserDefined Runtime Attributes 面板

#import <UIKit/UIKit.h>@class CustomWaterFallLayout ;@protocol CustomWaterFallLayoutDelegate <NSObject>// 此方法是为了从ViewController中得到相应位置的item的size值,以便布局// 第一个参数:将当前类对象传递过去,是为了获得当前类对象的itemSize属性,进一步得到该item的宽度,根据比例计算高度.// 第二个参数:是为了在viewcontroller中根据indexPath得到相应位置的item,然后从相应的数据源中取出对应的数据以便计算// 返回值就是我们得到的想要的单元格的size.- layoutWithCustomLayout:(CustomWaterFallLayout *)layout indexPath : (NSIndexPath *)indexPath ;@end@interface CustomWaterFallLayout : UICollectionViewLayout// 得到item的大小@property (nonatomic,assign)CGSize itemSize ;// 行间距@property (nonatomic,assign)float lineSpace ;// 列间距@property (nonatomic,assign)float columnSpace ;// 列数@property (nonatomic,assign)int columnNumber ;// 内边距@property (nonatomic,assign)UIEdgeInsets sectionInsets ;// 代理对象@property (nonatomic,assign)id<CustomWaterFallLayoutDelegate> delegate ;@end

#import "CustomWaterFallLayout.h"@interface CustomWaterFallLayout ()@property (nonatomic,retain)NSMutableArray *attributesArray ; // 保存所有的单元格的属性模型,属性模型里面包含单元格的frame值.@property (nonatomic,retain)NSMutableArray *columnHeightArray ; // 保存所有列的高度,用来比较,以便找出最短列来布局新的单元格.- (NSInteger)shortestColumnIndex ; // 得到最短列的下标,来确定最短列是哪一列,根据列数来计算当前item的X坐标的位置.根据最短列的列数,从上面的数组中可以取出对应的长度,根据长度,可以确定当前item的Y坐标.- (NSInteger)longestColumnIndex ; // 得到最长列的下标,根据最长列的下标从上面的数组中取出最长长度,用来确定collectionView的可滚动区域.@end@implementation CustomWaterFallLayout// 懒加载- (NSMutableArray *)attributesArray{ if (!_attributesArray) { _attributesArray = [[NSMutableArray alloc] init] ; } return _attributesArray ;}- (NSMutableArray *)columnHeightArray{ if (!_columnHeightArray) { _columnHeightArray = [[NSMutableArray alloc] init] ; } return _columnHeightArray ;}// 得到最短列在数组(columnHeightArray)中的下标- (NSInteger)shortestColumnIndex{ int index = 0 ; // 存储最短列下标 float shortestHeight = MAXFLOAT ; // 用来存储最短列长度. for (int i = 0; i<self.columnHeightArray.count; i  ) { float height = [[self.columnHeightArray objectAtIndex:i] floatValue] ; if (height < shortestHeight) { shortestHeight = height ; index = i ; } } return index ;}// 得到最长列在数组(columnHeightArray)中的下标- (NSInteger)longestColumnIndex{ int index = 0 ; float longestHeight = 0 ; // 用来存储最短列 for (int i = 0; i<self.columnHeightArray.count; i  ) { float height = [[self.columnHeightArray objectAtIndex:i] floatValue] ; if (height>longestHeight) { longestHeight = height ; index = i ; } } return index ;}// 所有单元格的布局方法,实际上就是求所有单元格的frame- customLayoutItem{ // 为所有列赋初始长度 for (int i = 0; i<self.columnNumber; i  ) { //[self.columnHeightArray addObject:[NSNumber numberWithFloat:self.sectionInsets.top]] ; self.columnHeightArray[i] = @(self.sectionInsets.top) ; } // 为了给所有的item布局,我们得得到item的总个数 NSInteger allItems = [self.collectionView numberOfItemsInSection:0] ; // 遍历所有的单元格,为它计算frame for (int i = 0; i<allItems; i  ) { // 计算当前item的X值 // 得到当前item所在的列 NSInteger shortestIndex = [self shortestColumnIndex] ; // 根据列计算X值 float x = self.sectionInsets.left   shortestIndex * (self.columnSpace   self.itemSize.width) ; // 计算item的y值 // 最短列的长度 行间距 float y = [self.columnHeightArray[shortestIndex] floatValue]   self.lineSpace ; // 得到该item的宽高 // 需要一个indexPath来确定是要哪个item的宽高 NSIndexPath *indexPath = [NSIndexPath indexPathForItem:i inSection:0] ; CGSize size = [self.delegate layoutWithCustomLayout:self indexPath:indexPath] ; // 声明一个属性模型,来承载对应item的frame UICollectionViewLayoutAttributes *attributes = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath] ; attributes.frame = CGRectMake(x, y, size.width, size.height) ; [self.attributesArray addObject:attributes] ; // 每次增加一个item,当前列的长度肯定会发生变化,所以我们要更新数组中当前列的长度,以便下次找最短列使用. self.columnHeightArray[shortestIndex] = @(y size.height) ; }}// 开始布局时候所调用的系统方法- prepareLayout{ [super prepareLayout] ; // 在开始布局的时候,使用我们自定义的布局方法 [self customLayoutItem] ;}// 为当前区域保存所有的属性模型- (NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:rect{ return self.attributesArray ;}// 返回每个item的属性模型- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath{ return self.attributesArray[indexPath.item] ;}// collectionView的可滚动区域- collectionViewContentSize{ CGSize contentSize = self.collectionView.frame.size ; // 得到可滚动的高度 float height = [[self.columnHeightArray objectAtIndex:[self longestColumnIndex]] floatValue] ; contentSize.height = height ; return contentSize ;}@end

#pragma mark -- 自定义布局类的代理方法// 通过该代理方法可以获得相应的indexPath的item的大小- layoutWithCustomLayout:(CustomWaterFallLayout *)layout indexPath:(NSIndexPath *)indexPath{ // 先得到宽度,根据宽度等比例计算高度 float width = layout.itemSize.width ; // 得到原来的宽高 NSDictionary *dic = [self.allDataArray objectAtIndex:indexPath.item] ; float originalHeight = [[dic objectForKey:@"height"] floatValue] ; float originalWidth = [[dic objectForKey:@"width"] floatValue] ; // 得到真实需要的高度 float height = width*originalHeight/originalWidth ; return CGSizeMake(width, height) ;}

但是reloadData方法就不一样了,他不会创建新的cell,会将当前可见的cell重新走一遍代理方法,也就是说,如果使用reloadData方法,再插入一个cell就不会出现上面的问题。

找到原因在于borderColor接受的参数是CGColor类型,而此处的Color为UIColor,所以导致注入时参数类型不一致

这是tableView内部的实现细节,我们在用的时候,就要多注意。

自定义一个CALayer类别,然后使用这个属性

图片 2

//CALayer RumtimeAttribute.h

#import

@interfaceCALayer (RumtimeAttribute)

@property(nonatomic,assign)UIColor* borderIBColor;

@end

//CALayer RumtimeAttribute.m

#import"CALayer RumtimeAttribute.h"

本文由新金沙平台发布于新金沙平台,转载请注明出处:瀑布流的实现,Storyboard下修改控件边框颜色

关键词: 新金沙平台 金沙4166娱乐