通过动画向 UITableViewCell 添加单选按钮：iOS

Question

我想知道如何通过动画实现这种自定义 UITableViewCell，就像 UITableViewCell 向左或向右滑动时的开箱即用功能。

到目前为止我所做的（并且正在工作）是：

添加带有该圆形图像的按钮。
切换该按钮的可见性。
切换按钮的突出显示和正常状态。
在 #2 中显示或隐藏单选按钮时切换整个视图的约束。
重新加载数据。

我认为这个问题可能会使我的实现更清晰，而不是切换我的自定义 tableViewCell 的可见性和约束，只是滑动它或为其设置动画。

EDIT：这些单选按钮仅在特定模式下出现，如编辑模式。所以通常情况下，我的单元格中没有单选按钮。

Answer 1

你可以试试这个我创建的简单演示。

ViewController.h

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController<UITableViewDelegate,UITableViewDataSource>
{
    NSMutableArray *dataArray;
}

    @property (weak, nonatomic) IBOutlet UITableView *mTableView;
// You can toggle the Selection by Means you can show hide the checkboxes
    - (IBAction)didTapBringCheckBoxBtn:(id)sender;

@end

查看controller.m

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    dataArray=[[NSMutableArray alloc]init];
    [dataArray addObject:@"Apple"];
    [dataArray addObject:@"Mango"];
    [dataArray addObject:@"Papaya"];
    [dataArray addObject:@"Guava"];
    [dataArray addObject:@"Pineapple"];
    [dataArray addObject:@"Strawberry"];
    [dataArray addObject:@"Banana"];
    [dataArray addObject:@"Grapes"];
    [dataArray addObject:@"Pomegranate"];
    [dataArray addObject:@"Green Tea"];
    [dataArray addObject:@"Raisin"];

    self.mTableView.delegate=(id)self;
    self.mTableView.dataSource=(id)self;
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

#pragma mark - Check Box Button Action

- (IBAction)didTapBringCheckBoxBtn:(id)sender {

     if(self.mTableView.editing==YES)
{
[self.mTableView setEditing:NO animated:YES];
}else{
[self.mTableView setEditing:YES animated:YES];
}

}

#pragma mark - UITableView DataSource Methods

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return [dataArray count];
}

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

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier];

    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
    }

    cell.textLabel.text = [dataArray objectAtIndex:indexPath.row];
    return cell;
}

#pragma mark - UITableView Delegate Methods

- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return 3;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"user selected %@",[dataArray objectAtIndex:indexPath.row]);
}
- (void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath
{
     NSLog(@"user de-selected %@",[dataArray objectAtIndex:indexPath.row]);
}

@end

OutPut 将如下所示：

开始时不显示复选框：

点击显示复选框：

Answer 2

让我们假设您的数据源看起来像

NSMutableDictionary *sampleRecord = [[NSMutableDictionary alloc] initWithObjectsAndKeys:@"isSelected",@"true",@"title",@"title text", nil];
records = [[NSMutableArray alloc] init];
[records addObject:[sampleRecord copy]];
[records addObject:[sampleRecord copy]];
[records addObject:[sampleRecord copy]];

你的 table delegate/data 源方法应该是

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return [records count];
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{

    //Initialize your cell
    //Read the all views from your cell
    //Now add the click event to your radio button (UIButton)

    [myButton addTarget:self action:@selector(changeRadioState) forControlEvents: UIControlEventTouchUpInside];

    return cell;
}

- (IBAction)changeRadioState:(id)sender
{
    //Detect the row index fro table where is the button present
    CGPoint buttonPosition = [sender convertPoint:CGPointZero toView:tableView];
    NSIndexPath *indexPath = [tableView indexPathForRowAtPoint:buttonPosition];

    //Now get the resource data for clicked row
    NSMutableDictionary *record = [records objectAtIndex:indexPath.row];

    //Change the selected state images
    if ([[records valueForKey:@"isSelected"] isEqualToString:@"true"]) {
        [sender setImage:[UIImage imageNamed:@"unSelectStateImage"] forState:UIControlStateNormal];
        [record setValue:@"false" forKey:@"isSelected"];

    }
    else{
        [sender setImage:[UIImage imageNamed:@"selectedStateImage"] forState:UIControlStateNormal];
        [record setValue:@"true" forKey:@"isSelected"];
    }

    //Reload entire table
    [tableView reloadData];

    //Or else you can reload the single row by
    [tableView beginUpdates];
    [tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationFade];
    [tableView endUpdates];
}

Answer 3

MGSwipeTableCell 是一个易于使用的 UITableViewCell 子类，它允许显示具有各种转换的可滑动按钮。

https://github.com/MortimerGoro/MGSwipeTableCell

Answer 4

你更努力了，你只需要隐藏你的按钮，这是一个类似的实现，我有一个删除按钮并在没有确认的情况下删除它。

1) 在内容视图中创建子视图，并使其大于内容视图，前导为负space（-42 为滑动偏移值）

然后把你的复选标记按钮放在这个隐藏的 space 中，就像我为我所做的那样：

然后当您将编辑模式设置为 true 时，您的复选框将出现并带有幻灯片动画 ;)

通过动画向 UITableViewCell 添加单选按钮：iOS

Add a Radio Button To UITableViewCell By Animating: iOS

ios

objective-c

swift

uitableview

tableviewcell