ios collection 컨트롤 의 사용자 정의 레이아웃 구현 및 디자인

collection 컨트롤 은 인터페이스의 각종 사용자 정의 레이아웃 을 실현 하 는 데 사용 되 며 가로,세로 레이아웃 컨트롤 로 가장 많이 사용 된다.오래 전 까지 만 해도 시스템 이 collection 에 대한 지원 이 좋 지 않 았 다.그래서 사용자 정의 레이아웃,사용자 정의 cell 을 지원 하 는 collection 컨트롤 을 스스로 실현 했다.사용자 정의 collection 은 모든 제품 의 특수 한 수요 와 동적 효 과 를 만족 시 킬 수 있 습 니 다.예 를 들 어 특정한 상황 에서 cell 을 제외 한 다른 cell 에서 레이아웃 애니메이션 을 실행 해 야 할 수도 있 습 니 다.collection 을 바탕 으로 저 는 cell 드래그,드래그 창 을 지원 하 는 tabview 컨트롤 을 실 현 했 습 니 다.본 고 는 주로 사용자 정의 collection 의 디자인 과 실현 을 소개 하고 다 tab 의 tabview 컨트롤 을 지속 적 으로 업데이트 합 니 다.
나 는 몇 장의 아 리 운 행운 권 을 너 에 게 나 누 어 줄 것 이다.쿠폰 으로 아 리 운 의 해당 제품 을 구 매 하거나 업그레이드 하면 특혜 서 프 라 이 즈 가 있 을 것 이다!사고 싶 은 제품 의 행운 권 을 모두 가 져 가세 요!빨리 착수 해라,곧 다 빼 앗 을 것 이다.
제품 중의 일부 실현 효과

mac 왕성 한 표정 패 널,grid 와 가로 레이아웃 실현

mac 천우 테이블 은 가로 레이아웃 으로 사 용 됩 니 다.

iOS 천우 과거 기록 로그 인 페이지 에서 현재 선택 한 cell 이 커지 고 cell 전체 중 가장 중간 위치 교정 효 과 를 선택 하 십시오.
collection
collection 은 주로 scrollview 를 계승 하 는 collection View,데이터 소스 프로 토 콜 collection View DataSource,이벤트 응답 프로 토 콜 collectoinView Delegate,레이아웃 기본 클래스 collectoinLayout 및 전시 장치 collection CellView 를 포함한다.
모듈 그림 은 다음 과 같다.

 collectionView
collection 용 기 는 collection ViewDataSource,collectoinViewDelegate 프로 토 콜 을 실현 하 는 지침 과 collectoinLayout 구성원 을 포함 하 며,collectoinCellView 를 유지 하 는 컨트롤 을 다시 사용 합 니 다.

@interface WWCollectionView : NSScrollView
//     
@property (retain) WWCollectionViewLayout *layout;
//    
@property (weak) id dataSource;
//     
@property (weak) id delegate;
//      
(void)reloadData;
//    
(void)invalidateLayout;
//       
(void)unSelectedAll;
//       
(void)registerClass:(Class)cellClass forCellWithReuseIdentifier:(NSString *)identifier;
//     
(id)dequeueReusableCellWithReuseIdentifier:(NSString )identifier forIndexPath:(NSIndexPath )indexPath;
//       
(void)selectItemAtIndexPath:(NSIndexPath *)indexPath animated:(BOOL)animated;
//       
(NSIndexPath *)selectedItem;
//    indexPath item
(void)reloadItemsAtIndexPath:(NSIndexPath *)indexPath;
//   
(void)insertItemsAtIndexPath:(NSIndexPath *)indexPath withAnimate:(BOOL)animate;
//   
(void)deleteItemsAtIndexPath:(NSIndexPath *)indexPath withAnimate:(BOOL)animate;
//     
(void)relayoutWithAnimation:(BOOL)animated completion:(void (^)(BOOL finished))completion;
//    aPoint
(void)scrollToPoint:(NSPoint)aPoint withAnimate:(BOOL)animate;
@end

collectionViewDataSource
collection 에서 보 여 준 데이터 원본 은 숙주 에 의 해 이 루어 집 니 다.

@protocol WWCollectionViewDataSource 
//   indexPath   cell
(WWCollectionCellView )collectView:(WWCollectionView )collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath;
//  cell  
(NSInteger)numberOfItemInCollectionView:(WWCollectionView *)collectionView;
// cell   
(id)collectionView:(WWCollectionView )colletionView objectValueAtIndexPath:(NSIndexPath )indexPath;
@end

collectoinViewDelegate
collection 이벤트 의 리 셋 응답 은 숙주 에 의 해 이 루어 집 니 다.

@protocol WWCollectionViewDelegate 
// indexPath     
(void)collectionView:(WWCollectionView )collectionView didSelectItemAtIndexPath:(NSIndexPath )indexPath;
//       
(BOOL)collectionView:(WWCollectionView )collectionView shouldSelectItemsAtIndexPaths:(NSIndexPath )indexPath;
@end

collectoinLayout
collection CellView 의 레이아웃 방안 입 니 다.

@interface WWCollectionViewLayout : NSObject
//     
@property (weak) WWCollectionView *collectionView;
//   cell    
@property (assign) NSSize itemSize;
// edgeInsets
@property (assign) NSEdgeInsets edgeInsets;
// scrollview  ，        
@property (assign) NSSize viewContentSize;
(instancetype)initWithCollectionView:(WWCollectionView *)collectionView;
(void)invalidateLayout;
//   index cell  
(NSRect)frameForIndexPath:(NSIndexPath *)index total:(NSInteger)total;
(NSSize)collectionViewContentSize;
@end
//       
@interface WWFlowCollectionViewLayout : WWCollectionViewLayout
@property (assign) CGFloat headMargin;
@property (assign) CGFloat tailMargin;
@end
// grid    
@interface WWGridCollectionViewLayout : WWCollectionViewLayout
//      
@property (assign) NSInteger numberPerRow;
@property (assign) CGFloat headMargin;
@property (assign) CGFloat tailMargin;
@end

@implementation WWFlowCollectionViewLayout

(void)invalidateLayout {
NSInteger cellCount = [self.collectionView.dataSource numberOfItemInCollectionView:self.collectionView];
CGRect bounds = self.collectionView.bounds;
//     
CGFloat width = _headMargin + _tailMargin + (cellCount - 1) (self.edgeInsets.left + self.edgeInsets.right) + self.itemSize.width cellCount;
if (width < bounds.size.width) {
width = bounds.size.width;
}
self.viewContentSize = NSMakeSize(width, bounds.size.height);
[super invalidateLayout];
}
(NSRect)frameForIndexPath:(NSIndexPath *)index total:(NSInteger)total {
CGFloat leftPos = self.headMargin + [index indexAtPosition:0] * (self.itemSize.width + self.edgeInsets.left + self.edgeInsets.right);
//   cell rect
return NSMakeRect(leftPos, self.edgeInsets.top, self.itemSize.width, self.itemSize.height);
}
@end

collectoinCellView
collection 에서 보 여 주 는 cell 컨트롤.

@interface WWCollectionCellView : NSView
//   cell   
@property (nonatomic, assign) BOOL selected;
//   
@property (nonatomic, retain) id dataValue;
//          
(void)reset;
@end