Question

我想模仿标准联系人应用程序的分组表（左）。每个部分上方和下方都有灰线分隔线。在我的分组表（右）中，每个部分上方没有行。甚至更奇怪的是，中间部分完全没有线条。

enter image description here

#import "GroupViewController.h"
#import "UserCollectionViewCell.h"
#import "UIView+position.h"
#import "UIColor+style.h"
#import "UserPublicViewController.h"
#import "RecipientsGroupsModel.h"

static NSString* AVATAR_CELL_ID = @"groupUserCollectionUserView";
static const CGFloat AVATAR_ITEM_SPACING = 16.0;
static const CGFloat AVATAR_LINE_SPACING = 9.0;
static const CGFloat AVATAR_MARGIN = 15.5;
static const CGFloat AVATAR_CELL_WIDTH = 45.0;
static const CGFloat AVATAR_CELL_HEIGHT = 58.0;

typedef enum {
    GroupViewControllerTableSectionTitle,
    GroupViewControllerTableSectionUsers,
    GroupViewControllerTableSectionDelete
} GroupViewControllerTableSection;

@interface GroupViewController ()

@property(nonatomic, strong) Group* group;
@property(nonatomic, strong) UICollectionView* avatarCollectionView;
@property(nonatomic, readonly) CGFloat usersHeight;

- (void)didLongTapAvatars:(UILongPressGestureRecognizer*)gesture;

@end

@implementation GroupViewController

#pragma mark UIViewController

- (NSString*)title
{
    return @"Group";
}

- (void)loadView
{
    [super loadView];
    self.view.backgroundColor = [UIColor backgroundColor];
}

- (void)viewDidLoad
{
    [super viewDidLoad];

    self.navigationItem.rightBarButtonItem = self.editButtonItem;
}

- (void)setEditing:(BOOL)editing animated:(BOOL)animated
{
    [super setEditing:editing animated:animated];
    [self.tableView reloadData];
    [self.avatarCollectionView reloadData];
}

#pragma mark GroupViewController ()

- (void)didLongTapAvatars:(UILongPressGestureRecognizer *)gesture
{
    if (gesture.state == UIGestureRecognizerStateBegan) {
        [self setEditing:!self.isEditing animated:YES];
    }
}

- (CGFloat)usersHeight
{
    return ceilf(
        self.group.users.count
        / floorf(
            (
                self.view.width
                - 2 * AVATAR_MARGIN
                + AVATAR_ITEM_SPACING
            )
            / (
                AVATAR_ITEM_SPACING
                + AVATAR_CELL_WIDTH
            )
        )
    )
    * (AVATAR_CELL_HEIGHT + AVATAR_LINE_SPACING)
    + AVATAR_LINE_SPACING;
}

#pragma mark GroupViewController

- (instancetype)initWithGroup:(Group *)group
{
    if (self = [super init]) {
        self.group = group;
    }
    return self;
}

#pragma mark UITableViewDelegate

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    switch (indexPath.section) {
        case GroupViewControllerTableSectionTitle:
        case GroupViewControllerTableSectionDelete:
            return 44.0f;
            break;
        case GroupViewControllerTableSectionUsers:
            return self.usersHeight;
            break;
        default:
            return 0.0f;
    }
}

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    return 22.0f;
}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
{
    switch (section) {
        case GroupViewControllerTableSectionDelete:
            return 22.0f;
            break;
        default:
            return 0.0f;
    }
}

- (UIView*)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    // iOS 7 applies a transclucent view if you don't return your own view
    return [[UIView alloc] init];
}

- (UIView*)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section
{
    return [[UIView alloc] init];
}

#pragma mark UITableViewDataSource

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    if (self.isEditing) {
        return GroupViewControllerTableSectionDelete + 1;
    } else {
        return GroupViewControllerTableSectionUsers + 1;
    }
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 1;
}

- (UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    NSString* identifier = [NSNumber numberWithInteger:indexPath.section].stringValue;
    UITableViewCell* cell = [tableView dequeueReusableCellWithIdentifier:identifier];

    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier];
        switch (indexPath.section) {
            case GroupViewControllerTableSectionTitle:
                cell.textLabel.text = self.group.title;
                break;
            case GroupViewControllerTableSectionUsers: {
                if (self.avatarCollectionView == nil) {
                    UICollectionViewFlowLayout* layout = [[UICollectionViewFlowLayout alloc] init];
                    layout.scrollDirection = UICollectionViewScrollDirectionVertical;
                    layout.sectionInset = UIEdgeInsetsMake(
                        AVATAR_LINE_SPACING,
                        AVATAR_MARGIN,
                        AVATAR_LINE_SPACING,
                        AVATAR_MARGIN
                    );
                    layout.itemSize = CGSizeMake(AVATAR_CELL_WIDTH, AVATAR_CELL_HEIGHT);
                    layout.minimumInteritemSpacing = AVATAR_ITEM_SPACING;
                    layout.minimumLineSpacing = AVATAR_LINE_SPACING;

                    self.avatarCollectionView = [[UICollectionView alloc]
                        initWithFrame:CGRectMake(
                            0.0,
                            0.0,
                            self.view.width,
                            self.usersHeight
                        )
                        collectionViewLayout:layout
                    ];
                    self.avatarCollectionView.backgroundColor = [UIColor clearColor];
                    self.avatarCollectionView.dataSource = self;
                    self.avatarCollectionView.delegate = self;
                    [self.avatarCollectionView registerClass:[UserCollectionViewCell class] forCellWithReuseIdentifier:AVATAR_CELL_ID];
                    [self.avatarCollectionView addGestureRecognizer:[[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(didLongTapAvatars:)]];
                }
                [cell.contentView addSubview:self.avatarCollectionView];
                break;
            }
            case GroupViewControllerTableSectionDelete:
                cell.textLabel.text = @"Delete Group";
                cell.textLabel.textColor = [UIColor redColor];
                break;
        }
    }
    return cell;
}

- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath
{
    return NO;
}

#pragma mark UICollectionViewDataSource

- (UICollectionViewCell*)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    UserCollectionViewCell* cell;
    cell = [self.avatarCollectionView dequeueReusableCellWithReuseIdentifier:AVATAR_CELL_ID forIndexPath:indexPath];
    cell.user = [self.group.users objectAtIndex:indexPath.row];
    cell.isEditing = self.isEditing;
    return cell;
}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return self.group.users.count;
}

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
    return 1;
}

#pragma mark UICollectionViewDelegate

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    User* user = [self.group.users objectAtIndex:indexPath.row];

    if (self.isEditing) {
        if (self.group.users.count <= 1) {
            [RecipientsGroupsModel removeGroup:self.group];
            [self.navigationController popViewControllerAnimated:YES];
        } else {
            [self.group.users removeObject:user];
            [RecipientsGroupsModel updateGroup:self.group];
            [self.avatarCollectionView deleteItemsAtIndexPaths:@[indexPath]];
        }
    } else {
        [self.navigationController pushViewController:[[UserPublicViewController alloc] initWithUser:user] animated:YES];
    }
}

@end

Answer 1

您可以使用UITableViewDelegate方法：

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section;
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section;

您可以在其中指定任何部分的页眉和页脚所需的任何高度。如果您不需要页眉或页脚，请返回0.

然后使用另外两种方法：

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section;
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section;

在每个内容中，您可以编写自定义代码，使其按照您的需要显示：

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 40)];

view.backgroundColor = [UIColor grayColor];

// ...
// Other customizations, like adding the gray line, etc.
// ...

return view;

如何显示分组表格部分的线分隔线？

1 个答案: