在由笔尖制作的自定义表格单元格中单击更改图像

时间:2017-12-12 00:48:47

标签: ios objective-c uilabel xib

我有一个表格,其中包含由nib文件制作的自定义单元格。当用户单击一个单元格时,它会在高度上展开,从而模拟下拉列表。在自定义单元格中,有一个imageView在未单击单元格时具有dropDown图像。但是,单击单元格时,应将图像更改为折叠图像或向上箭头图像,以显示单元格已打开。

当单元格从向下箭头向下扩展到向上箭头时,我在更改图像时遇到问题,反之亦然。我想帮助实现这一目标。

这是我的代码:

ViewController.h

@interface ViewController : UIViewController <UITableViewDelegate, 

UITableViewDataSource>
@property (weak, nonatomic) IBOutlet UITableView *tableView;

@property(nonatomic, strong) NSArray *items;
@property (nonatomic, assign) BOOL expandFlag;
@property (nonatomic, assign) NSIndexPath* selectedIndex;

ViewController.m

- (NSArray *) items
{
    if (!_items) {
        _items = [NSArray new];
    }
    return _items;
}

- (void)viewDidLoad {
    [super viewDidLoad];

    UINib *nib = [UINib nibWithNibName:@"CustomTableViewCell" bundle:nil];
    [self.tableView registerNib:nib forCellReuseIdentifier:@"cell"];

    _items = @[
                        @{@"title":@"Simpson", @"short":@"Homer", @"long":@"Mr jhvjm,b;k t  tyfy rctrc rtcf rvty rthvgh bb r5ertvyg hg r5 tyhg 6ruygj 8rutyj r6yiugg tygdtjhgfdt hg tvt gthgfgni7yjftgjhb ftgfh b yjh gtfjfyhh j jj j", @"image":@"There are many ways to create expandable cells in the table view. Few of them you can easily find on this blog or somewhere in Google. One of that is the official Apple “Date cell” demo code. However, most of that describing the little hard way by using operations directly on constraints."},
                        @{@"title":@"Simpson", @"short":@"Marge", @"long":@"Mrs bjyvhm uikn o utv jb k", @"image":@"There are many ways to create expandable cells in the table view. Few of them you can easily find on this blog or somewhere in Google. One of that is the official Apple “Date cell” demo code. However, most of that describing the little hard way by using operations directly on constraints."},
                        @{@"title":@"Simpson", @"short":@"Bart", @"long":@"Mr vubj cbjknuy  iubyuvjh biubkj ", @"image":@"There are many ways to create expandable cells in the table view. Few of them you can easily find on this blog or somewhere in Google. One of that is the official Apple “Date cell” demo code. However, most of that describing the little hard way by using operations directly on constraints."},
                        @{@"title":@"Simpson", @"short":@"Lisa", @"long":@"Miss jbjvjbbiuvu yuvhj uby ", @"image":@"There are many ways to create expandable cells in the table view. Few of them you can easily find on this blog or somewhere in Google. One of that is the official Apple “Date cell” demo code. However, most of that describing the little hard way by using operations directly on constraints."},
                        @{@"title":@"Simpson", @"short":@"Maggie", @"long":@"Miss iubniyujh k iuuh  ", @"image":@"There are many ways to create expandable cells in the table view. Few of them you can easily find on this blog or somewhere in Google. One of that is the official Apple “Date cell” demo code. However, most of that describing the little hard way by using operations directly on constraints."},
                        @{@"title":@"Flanders", @"short":@"Ned", @"long":@"Mr hbuyvj iybkj nui  uhc n", @"image":@"There are many ways to create expandable cells in the table view. Few of them you can easily find on this blog or somewhere in Google. One of that is the official Apple “Date cell” demo code. However, most of that describing the little hard way by using operations directly on constraints."}
                        ];
    // Do any additional setup after loading the view, typically from a nib.
}


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

-(void) didExpandCell{

    _expandFlag = !_expandFlag;
    [self.tableView reloadRowsAtIndexPaths:@[_selectedIndex] withRowAnimation:UITableViewRowAnimationAutomatic];

}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
   return self.items.count;
}

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

    CustomTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell" forIndexPath:indexPath];
    NSDictionary *item = _items[indexPath.row];
    cell.titleImage.text = [item objectForKey:@"title"];
    cell.longLabel.text = [item objectForKey:@"long"];
    cell.shortLabel.text = [item objectForKey:@"image"];

    return cell;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{

    _selectedIndex = indexPath;
    [self didExpandCell];
}

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{

    if (_expandFlag && _selectedIndex == indexPath) {
        return 400;
    }
    return 200;

}

CustomeTableViewcell.h

@interface CustomTableViewCell : UITableViewCell

@property (weak, nonatomic) IBOutlet UIImageView *thumbImage;
@property (weak, nonatomic) IBOutlet UILabel *titleImage;
@property (weak, nonatomic) IBOutlet UILabel *shortLabel;
@property (weak, nonatomic) IBOutlet UILabel *longLabel;
@property (weak, nonatomic) IBOutlet UIImageView *dropDownImage;

CustomerTableViewCell.m

- (void)awakeFromNib {
    [super awakeFromNib];
}

- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
    [super setSelected:selected animated:animated];
}

enter image description here

1 个答案:

答案 0 :(得分:2)

您应该在dropDownImage方法中检查并更改cellForRowAtIndexPath。有点喜欢下面的代码

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

  CustomTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell" forIndexPath:indexPath];
  NSDictionary *item = _items[indexPath.row];
  cell.titleImage.text = [item objectForKey:@"title"];
  cell.longLabel.text = [item objectForKey:@"long"];
  cell.shortLabel.text = [item objectForKey:@"image"];

  NSString *dropDownImageName = [indexPath isEqual:_selectedIndex] && _expandFlag ? @"ARROW_DOWN" : @"ARROW_UP";
  cell.dropDownImage.image = [UIImage imageNamed:dropDownImageName];

  return cell;
}

使用您的图片名称更改ARROW_UPARROW_DOWN