What’s New

  • This page was last updated on 08 March 2020
  • First updated March 08, 2020

CCSheetView

CCSheetView source

Function is introduced

CCSheetView inherits from UITableView. It implements horizontal scrolling of cells, and supports synchronous horizontal scrolling of multiple cells. The effect looks like Office Excel, showing a row view. Users can customize the Cell interface by inheriting the internal Component.

Component has an integrated UICollectionView and provides UIScrollView and UICollectionView properties that point to the same CollectionView. You can customize the column UI by registering a new ColumnCell with the UICollectionView. The advantage of this is that horizontal scrolling is also supported for reuse. You can also simply use UIScrollView as the host view for horizontal scrolling. Or finish rewriting the Component layout and design the Cell yourself.

Note that Cell and Header subclasses must inherit from Component, providing either UIScrollView or a subclass, which is key to enabling horizontal scrolling.

See the tutorial section for more details on how to customize it.

Effect:

compatibility

IOS9 or later is supported

The installation

pod 'CCSheetView'
Copy the code

The tutorial

CCSheetViewDelegate inherits from UITableViewDelegate. Developers can implement a CCSheetViewDelegate method that tells the CCSheetView how many columns are in the current Section.

- (NSArray<NSNumber *> *)sheetView:(CCSheetView *)sheetView columnsNumberAndWidthsInSection:(NSInteger)section {
    // Return the width of each column. The length of the array also represents the number of columns
    if (section == 1) {
        return@ @ (100), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100)];
    }else {
        return@ @ (150), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100), @ (100)]; }}Copy the code

Later, in sections that need to support horizontal scrolling, the developer provides the Cell or Header object that inherits from the Component when returning the Cell. You can also return a normal Cell, so that the Cell is no different than the one in the UITableView.

The Component class has a property called ScrollView that is used for horizontal scrolling. Developers can override the layout of the ScrollView as needed. The default ScrollView points to the UICollectionView, so columns and rows are reusable as well. It is important to note that the Header object creation must use dequeueReusableHeaderFooterViewWithIdentifier: forSection method, otherwise the headers scroll event won’t be passed to the corresponding Section of the Cell

// In the simplest case, return the library Component
- (UIView *)tableView:(CCSheetView *)tableView viewForHeaderInSection:(NSInteger)section {    
    CCSheetHeaderComponent *header = [tableView dequeueReusableHeaderFooterViewWithIdentifier:CCSheetHeaderComponentReuseIdentifier forSection:section];
    return header;
}
- (UITableViewCell *)tableView:(CCSheetView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    CCSheetCellComponent *cell = [tableView dequeueReusableCellWithIdentifier:CCSheetCellComponentReuseIdentifier forIndexPath:indexPath];
    cell.didSelectedBlock = ^(NSIndexPath * _Nonnull indexPath) {
        NSLog(@"select %@", indexPath);
    };
    return cell;
}
Copy the code

To process the Column click event, assign the processing logic to the cell.didSelectedBlock Block.

The following code demonstrates if custom UI, including CCFirstColumnFixedSheetHeader and CCFirstColumnFixedSheetCell is a class library with a first column be hold the view, this view is more common in the stock software.

- (UIView *)tableView:(CCSheetView *)tableView viewForHeaderInSection:(NSInteger)section {
    / / to support horizontal scrolling header, you must call dequeueReusableHeaderFooterViewWithIdentifier: forSection method, so the header would follow in the section where the cell synchronous rolling.
    
    if (section == 1) {
        CCSheetHeaderComponent *header = [tableView dequeueReusableHeaderFooterViewWithIdentifier:CCSheetHeaderComponentReuseIdentifier forSection:section];
        return header;
    }else if (section == 2) {
        CCFirstColumnFixedSheetHeader *header = [tableView dequeueReusableHeaderFooterViewWithIdentifier:CCFirstColumnFixedSheetHeaderReuseIdentifier forSection:section];
        header.firstColumnTitleLabel.text = @" First Column Heading";
        NSInteger count = [self sheetView:tableView columnsNumberAndWidthsInSection:section].count - 1;
        NSMutableArray *contents = @[].mutableCopy;
        for (int i = 0; i < count; i++) {
            [contents addObject:@" Column heading"];
        }
        header.contentItems = contents;
        return header;
    }
    return nil;
}

- (UITableViewCell *)tableView:(CCSheetView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    if (indexPath.section == 1) {
        CCSheetCellComponent *cell = [tableView dequeueReusableCellWithIdentifier:CCSheetCellComponentReuseIdentifier forIndexPath:indexPath];
        cell.didSelectedBlock = ^(NSIndexPath * _Nonnull indexPath) {
            NSLog(@"select %@", indexPath);
        };
        return cell;
    }else if(indexPath.section == 2) {
        / / CCFirstColumnFixedSheetCell are available for the built-in view, developers can develop their own Cell again
        CCFirstColumnFixedSheetCell *cell = [tableView dequeueReusableCellWithIdentifier:CCFirstColumnFixedSheetCellReuseIdentifier forIndexPath:indexPath];
        CCFirstColumnFixedFirstItem *item = [[CCFirstColumnFixedFirstItem alloc] init];
        item.icon = [UIImage imageNamed:@"icon001"];
        item.title = [[NSAttributedString alloc] initWithString:@" Fixed column"];
        cell.firstItem = item;
        
        
        NSMutableArray *contents = @[].mutableCopy;
        ContentItems. Count +1 = total number of contentItems
        for (int i = 0; i < [self sheetView:tableView columnsNumberAndWidthsInSection:indexPath.section].count - 1; i++) {
            CCFirstColumnFixedContentItem *item = [[CCFirstColumnFixedContentItem alloc] initWithIdentifier:CCSheetViewColumnCellOneTextReuseIdentifier];
            item.texts = @[[[NSAttributedString alloc] initWithString:[NSString stringWithFormat:@" Scroll column %@", @(i)]]];
            [contents addObject:item];
        }
        cell.contentItems = contents;
        
        cell.didSelectedBlock = ^(NSIndexPath * _Nonnull indexPath) {
            NSLog(@"select %@", indexPath);
        };
        return cell;
    }else {
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];
        UILabel *label = [cell viewWithTag:1];
        label.text = @" This is a normal Cell.";
        returncell; }}Copy the code

The author

Cocos543, [email protected]

License

CCSheetView is available under the MIT license. See the LICENSE file for more info.