Implementation of custom single selection function in UITableView Cell in iOS

Today, I will share the single selection of the cell, which is customized and not like the tick mark in the picture below, which I found on the Internet. I searched for a long time, and most of the articles were about tick marks, so I decided to write one myself. Every app basically has its own style, and we can't always use the tick mark method (it looks pretty low, doesn't it).

What we need to achieve is the following form. It looks much better and more sophisticated, right?

Let me introduce it to you in detail. This method may not be very good, and I welcome any experts to come and exchange more.

Firstly, add a UIImageView to your custom cell, because you definitely need to have two images, one for selected and one for unselected, so this UIImageView is used to switch the images.

@property(nonatomic,strong)UIImageView *seletImage;

Note: Why didn't I use a button? I mainly considered that if the button is only as big as a small circle, it is not easy to click. My method is mainly implemented by combining the UITableViewDelegate method didSelectRowAtIndexPath.

Of course, you need to add this subview and initialize this object in your own cell. The following code is written at the corresponding position.

 //Add it to the cell
[self.contentView addSubview:self.seletImage];
//Initialization
-(UIImageView *)seletImage{
if (!_seletImage) {
  _seletImage = [[UIImageView alloc]init];
}
return _seletImage;
}
//Coordinate position
[self.seletImage mas_makeConstraints:^(MASConstraintMaker *make) {
  @strongify(self);
  make.right.equalTo(self.contentView.mas_right).with.offset(-15);
  make.centerY.equalTo(self.self.contentView);
  make.height.mas_equalTo(22);
  make.width.mas_equalTo(22);
 };

Then we also need a ViewModel for the cell to record various value changes within the cell. In this ViewModel, we add a parameter to determine whether this row cell is clicked.

@property(nonatomic)BOOL isSelected;

Then, back in this cell, we need to use RAC to observe the changes in the isSelected parameter and replace the image

  [[[[RACObserve(self.viewModel, isSelected) takeUntil:self.rac_prepareForReuseSignal] deliverOnMainThread] subscribeNext:^(NSString *x){
  @strongify(self);
  if ([x boolValue]==YES) {
    [self.seletImage setImage:[UIImage imageNamed:@"alarmsetting_selected"]];
  }else{
    [self.seletImage setImage:[UIImage imageNamed:@"alarmsetting_notselected"]];
  }
};

Alright, the final step, let's go back to the ViewController corresponding to this cell and do something with the didSelectRowAtIndexPath.

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
  [tableView deselectRowAtIndexPath:indexPath animated:YES];
 //Iterate through the viewModel array, if the viewModel corresponding to the clicked row number is the same, change isSelected to Yes, otherwise to No
  for (NSInteger i = 0; i<[self.viewModel.ItemArray count]; i++) {
    ItemViewModel *itemViewModel = self.viewModel.ItemArray[i];
    if (i!=indexPath.row) {
      itemViewModel.isSelected = NO;
    }else if (i == indexPath.row){
      itemViewModel.isSelected = YES;
    }
  }
  [self.tableView reloadData];
}

Here is a brief explanation, because each cell has a corresponding ViewModel, and this ViewModel is placed in the ViewModel array of ViewController. Therefore, iterate, retrieve the ViewModel corresponding to the clicked row number, and change the parameter to achieve this effect.

That's all for this article. I hope it will be helpful to everyone's learning and also hope everyone will support the Yelling Tutorial.

Declaration: The content of this article is from the Internet, and the copyright belongs to the original author. The content is contributed and uploaded by Internet users spontaneously, and this website does not own the copyright, has not been manually edited, and does not assume any relevant legal liability. If you find any content suspected of copyright infringement, please send an email to: notice#w3Please report via email to codebox.com (replace # with @ when sending an email) and provide relevant evidence. Once verified, this site will immediately delete the content suspected of infringement.