SWTableViewCell 0.3.7

SWTableViewCell 0.3.7

测试测试
语言语言 Obj-CObjective C
许可证 MIT
发布最后发布2014 年 12 月

Christopher Wendel 维护。



  • 作者:
  • Chris Wendel

一个易于使用的 UITableViewCell 子类,它实现了一个可滑动的内容视图,可显示实用按钮(类似于 iOS 7 邮件应用程序)

用法

在您的 Podfile 中

pod 'SWTableViewCell', '~> 0.3.7'

或者只是克隆此仓库并将源代码手动添加到项目中

功能

右侧实用按钮

当用户向左滑动时,在 Table View Cell 的右侧可见的实用按钮。该行为类似于 iOS 应用程序“邮件”和“提醒”中的行为。

左侧实用按钮

当用户向右滑动时,在 Table View Cell 的左侧可见的实用按钮。

功能

  • 动态实用按钮缩放。您向一个单元格添加更多按钮时,该侧的其他按钮会变小以留出空间
  • 智能选择:单元格将拾取触摸事件,并可选择将单元格滚动回中心或触发代理方法 - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath

    因此,当用户在实用按钮可见时触摸单元格时,单元格不会被视为选中,而是单元格会滑动回原位(与 iOS 7 邮件应用程序功能相同)
  • 可以使用标题、图标以及 RGB 颜色创建实用按钮
  • 在 iOS 6.1 及以上版本上进行测试,包括 iOS 7

用法

标准的 Table View Cells

在您的 tableView:cellForRowAtIndexPath: 方法中设置 SWTableView 单元格,并使用所提供的 NSMutableArray+SWUtilityButtons 类别添加任意数量的实用按钮。

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *cellIdentifier = @"Cell";

    SWTableViewCell *cell = (SWTableViewCell *)[tableView dequeueReusableCellWithIdentifier:cellIdentifier];

    if (cell == nil) {
        cell = [[SWTableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:cellIdentifier];
        cell.leftUtilityButtons = [self leftButtons];
        cell.rightUtilityButtons = [self rightButtons];
        cell.delegate = self;
    }

    NSDate *dateObject = _testArray[indexPath.row];
    cell.textLabel.text = [dateObject description];
    cell.detailTextLabel.text = @"Some detail text";

    return cell;
}

- (NSArray *)rightButtons
{
    NSMutableArray *rightUtilityButtons = [NSMutableArray new];
    [rightUtilityButtons sw_addUtilityButtonWithColor:
     [UIColor colorWithRed:0.78f green:0.78f blue:0.8f alpha:1.0]
                                                title:@"More"];
    [rightUtilityButtons sw_addUtilityButtonWithColor:
     [UIColor colorWithRed:1.0f green:0.231f blue:0.188 alpha:1.0f]
                                                title:@"Delete"];

    return rightUtilityButtons;
}

- (NSArray *)leftButtons
{
    NSMutableArray *leftUtilityButtons = [NSMutableArray new];

    [leftUtilityButtons sw_addUtilityButtonWithColor:
     [UIColor colorWithRed:0.07 green:0.75f blue:0.16f alpha:1.0]
                                                icon:[UIImage imageNamed:@"check.png"]];
    [leftUtilityButtons sw_addUtilityButtonWithColor:
     [UIColor colorWithRed:1.0f green:1.0f blue:0.35f alpha:1.0]
                                                icon:[UIImage imageNamed:@"clock.png"]];
    [leftUtilityButtons sw_addUtilityButtonWithColor:
     [UIColor colorWithRed:1.0f green:0.231f blue:0.188f alpha:1.0]
                                                icon:[UIImage imageNamed:@"cross.png"]];
    [leftUtilityButtons sw_addUtilityButtonWithColor:
     [UIColor colorWithRed:0.55f green:0.27f blue:0.07f alpha:1.0]
                                                icon:[UIImage imageNamed:@"list.png"]];

    return leftUtilityButtons;
}

自定义 Table View Cells

感谢 Matt Bowman,您现在可以使用 Interface Builder 创建具有 SWTableViewCell 功能的自定义 Table View Cells

首先步骤是设计您的单元格,无论是在独立的 nib 中还是在表视图内使用原型单元格。确保将自定义类设置在 Interface Builder 中的单元格上,以匹配您为其制作的子类

然后设置单元格重用标识符

在编写您自定义 Table View Cell 的代码时,请确保您的单元格是 SWTableViewCell 的子类

#import <SWTableViewCell.h>

@interface MyCustomTableViewCell : SWTableViewCell

@property (weak, nonatomic) UILabel *customLabel;
@property (weak, nonatomic) UIImageView *customImageView;

@end

如果您使用的是独立的笔尖而不是原型单元格,请确保在您的表格视图中注册笔尖

- (void)viewDidLoad
{
    [super viewDidLoad];

    [self.tableView registerNib:[UINib nibWithNibName:@"MyCustomTableViewCellNibFileName" bundle:nil] forCellReuseIdentifier:@"MyCustomCell"];
}

然后,在您的 UITableViewDelegate(通常是您的视图控制器)的 tableView:cellForRowAtIndexPath: 方法中,初始化您的自定义单元格

- (UITableViewCell*)tableView:(UITableView*)tableView cellForRowAtIndexPath:(NSIndexPath*)indexPath
{
    static NSString *cellIdentifier = @"MyCustomCell";

    MyCustomTableViewCell *cell = (MyCustomTableViewCell *)[tableView dequeueReusableCellWithIdentifier:cellIdentifier 
                                                                                           forIndexPath:indexPath];

    cell.leftUtilityButtons = [self leftButtons];
    cell.rightUtilityButtons = [self rightButtons];
    cell.delegate = self;

    cell.customLabel.text = @"Some Text";
    cell.customImageView.image = [UIImage imageNamed:@"MyAwesomeTableCellImage"];
    [cell setCellHeight:cell.frame.size.height];
    return cell;
}

代理

开发者使用 SWTableViewCellDelegate 代理来找出哪个按钮被按下。共有五个方法

// click event on left utility button
- (void)swipeableTableViewCell:(SWTableViewCell *)cell didTriggerLeftUtilityButtonWithIndex:(NSInteger)index;

// click event on right utility button
- (void)swipeableTableViewCell:(SWTableViewCell *)cell didTriggerRightUtilityButtonWithIndex:(NSInteger)index;

// utility button open/close event
- (void)swipeableTableViewCell:(SWTableViewCell *)cell scrollingToState:(SWCellState)state;

// prevent multiple cells from showing utilty buttons simultaneously
- (BOOL)swipeableTableViewCellShouldHideUtilityButtonsOnSwipe:(SWTableViewCell *)cell;

// prevent cell(s) from displaying left/right utility buttons
- (BOOL)swipeableTableViewCell:(SWTableViewCell *)cell canSwipeToState:(SWCellState)state;

索引表示用户按下了哪个工具按钮,每侧的按钮索引从右到左排序 0...n

示例

#pragma mark - SWTableViewDelegate

- (void)swipeableTableViewCell:(SWTableViewCell *)cell didTriggerLeftUtilityButtonWithIndex:(NSInteger)index {
    switch (index) {
        case 0:
            NSLog(@"check button was pressed");
            break;
        case 1:
            NSLog(@"clock button was pressed");
            break;
        case 2:
            NSLog(@"cross button was pressed");
            break;
        case 3:
            NSLog(@"list button was pressed");
        default:
            break;
    }
}

- (void)swipeableTableViewCell:(SWTableViewCell *)cell didTriggerRightUtilityButtonWithIndex:(NSInteger)index {
    switch (index) {
        case 0:
            NSLog(@"More button was pressed");
            break;
        case 1:
        {
            // Delete button was pressed
            NSIndexPath *cellIndexPath = [self.tableView indexPathForCell:cell];

            [_testArray removeObjectAtIndex:cellIndexPath.row];
            [self.tableView deleteRowsAtIndexPaths:@[cellIndexPath] 
                    withRowAnimation:UITableViewRowAnimationAutomatic];
            break;
        }
        default:
            break;
    }
}

(以下代码均来自包含的示例项目)

注意事项

分隔符内边距

  • 如果您在 iOS 7 上有左侧工具按钮,建议您更改您的表格视图的分隔符内边距,以便分隔符拉伸至屏幕长度
     tableView.separatorInset = UIEdgeInsetsMake(0, 0, 0, 0); 

贡献

请使用 Github 问题的功能来跟踪错误和功能请求。

联系方式

Chris Wendel

许可

MIT