在 ios 中展开和折叠表格视图单元格
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19855832/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Expanding and Collapsing table view cells in ios
提问by iOS Developer
I have a table view of custom cells and some buttons in each cell.Clicking on any of the button inside the cell will reveal another custom view below that cell.Next click on the same button will collapse the view and need this same for all cells.I tried with insertrow method on the button click but in vain.How can i do this with using only the table view delegates.
我有一个自定义单元格的表格视图和每个单元格中的一些按钮。单击单元格内的任何按钮将显示该单元格下方的另一个自定义视图。下次单击同一按钮将折叠视图，所有单元格都需要相同的视图.我尝试在按钮单击时使用 insertrow 方法，但徒劳无功。我怎么能只使用表视图委托来做到这一点。
This is what i tried:
这是我试过的：
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *simpleTableIdentifier = @"CustomCell_For_Dashboard";
CustomCellFor_Dashboard *customCell = (CustomCellFor_Dashboard *)[tableView dequeueReusableCellWithIdentifier:simpleTableIdentifier];
if (customCell == nil)
{
NSArray *nib = [[NSBundle mainBundle] loadNibNamed:@"CustomCellFor_Dashboard" owner:self options:nil];
customCell = [nib objectAtIndex:0];
}
[customCell.howyoulfeelBtn addTarget:self action:@selector(buttonclicked:) forControlEvents:UIControlEventTouchUpInside];
customCell.nameLabel.text = @"test";
customCell.imgView.image = [UIImage imageNamed:@"Default.png"];
// customCell.prepTimeLabel.text = [prepTime objectAtIndex:indexPath.row];
return customCell;
}
-(void)buttonclicked:(id)sender{
NSIndexPath *indexPath = [myTable indexPathForCell:sender];
[myTable beginUpdates];
NSIndexPath *insertPath = [NSIndexPath indexPathForRow:indexPath.row inSection:indexPath.section];
[myTable insertRowsAtIndexPaths:[NSArray arrayWithObject:insertPath] withRowAnimation:UITableViewRowAnimationTop];
}
can anyone help me?
谁能帮我？
回答by eagle.dan.1349
I got the same task on one project with just one thing different: There were no buttons, just tapping on cell will expand or collapse it.
我在一个项目上得到了相同的任务，但只有一件事不同：没有按钮，只需点击单元格即可展开或折叠它。
There are several things you should edit in your code. First, the button method code will look something like this:
您应该在代码中编辑几项内容。首先，按钮方法代码如下所示：
- (void) collapseExpandButtonTap:(id) sender
{
UIButton* aButton = (UIButton*)sender; //It's actually a button
NSIndexPath* aPath = [self indexPathForCellWithButtonTag:aButton.tag]; //Let's assume that you have only one section and button tags directly correspond to rows of your cells.
//expandedCells is a mutable set declared in your interface section or private class extensiont
if ([expandedCells containsObject:aPath])
{
[expandedCells removeObject:aPath];
}
else
{
[expandedCells addObject:aPath];
}
[myTableView beginEditing];
[myTableView endEditing]; //Yeah, that old trick to animate cell expand/collapse
}
Now the second thing is UITableViewDelegatemethod:
现在第二件事是UITableViewDelegate方法：
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
if ([expandedCells containsObject:indexPath])
{
return kExpandedCellHeight; //It's not necessary a constant, though
}
else
{
return kNormalCellHeigh; //Again not necessary a constant
}
}
Key thing here is to determine if your cell should be expanded/collapsed and return right height in delegate method.
这里的关键是确定您的单元格是否应该展开/折叠并在委托方法中返回正确的高度。
回答by Kalel Wade
Going off of what @eagle.dan.1349 said, this is how to do it on the clicking of the cell. In storyboard, you also need to set the table cell to clip subviews, otherwise the content that would be hidden will show.
与@eagle.dan.1349 所说的不同，这是单击单元格的方法。在storyboard中，你还需要设置表格单元格来剪辑子视图，否则会显示隐藏的内容。
.h
。H
@property (strong, nonatomic) NSMutableArray *expandedCells;
.m
.m
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
if ([self.expandedCells containsObject:indexPath])
{
[self.expandedCells removeObject:indexPath];
}
else
{
[self.expandedCells addObject:indexPath];
}
[tableView beginUpdates];
[tableView endUpdates];
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
CGFloat kExpandedCellHeight = 150;
CGFloat kNormalCellHeigh = 50;
if ([self.expandedCells containsObject:indexPath])
{
return kExpandedCellHeight; //It's not necessary a constant, though
}
else
{
return kNormalCellHeigh; //Again not necessary a constant
}
}
回答by kgaidis
Saw this post and just wanted to give my 2 cents as my solution to this is very similar to the chosen answer (the tapping of a whole area).
看到这篇文章，只想给我 2 美分，因为我对此的解决方案与所选答案（敲击整个区域）非常相似。
Many people architect this by using just cells alone, but I believe there is a way to build this that might align better with what people are trying to achieve:
许多人仅通过单独使用单元来构建它，但我相信有一种方法可以构建它，以更好地与人们试图实现的目标保持一致：
There are headersand there are cells. Headersshould be tappable, and then cellsunderneath the headers would show or hide. This can be achieved by adding a gesture recognizer to the header, and when tapped, you just remove all of the cells underneath that header (the section), and viceversa (add cells). Of course, you have to maintain state of which headers are "open" and which headers are "closed."
有报头，并有细胞。标题应该是可点击的，然后标题下方的单元格将显示或隐藏。这可以通过向标题添加手势识别器来实现，当点击时，您只需删除该标题下方的所有单元格（部分），反之亦然（添加单元格）。当然，您必须维护哪些标头“打开”和哪些标头“关闭”的状态。
This is nice for a couple of reasons:
这很好，有几个原因：
- The job of headers and cells are separated which makes code cleaner.
- This method flows nicely with how table views are built (headers and cells) and, therefore, there isn't much magic - the code is simply removing or adding cells, and should be compatible with later versions of iOS.
- 标题和单元格的工作是分开的，这使代码更清晰。
- 这种方法与表格视图的构建方式（标题和单元格）很好地结合在一起，因此，没有太多魔法——代码只是删除或添加单元格，并且应该与更高版本的 iOS 兼容。
I made a verysimple library to achieve this. As long as your table view is set up with UITableView section headers and cells, all you have to dois subclass the tableview and the header.
我制作了一个非常简单的库来实现这一点。只要您的表格视图设置了 UITableView 部分标题和单元格，您所要做的就是对表格视图和标题进行子类化。
Link: https://github.com/fuzz-productions/FZAccordionTableView
链接：https: //github.com/fuzz-productions/FZAccordionTableView
回答by Akila Wasala
I also had a same situation and my solution was to put a button on top of the Section Title with viewForHeaderInSectionmethod.
我也有同样的情况，我的解决方案是在带有viewForHeaderInSection方法的部分标题顶部放置一个按钮。
noOfRowsdefines how many rows are there in each section and button.tagkeeps which button of section is pressed.
noOfRows定义每个部分有多少行，并button.tag保持按下部分的哪个按钮。
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
UIButton *btnSection = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, tableView.frame.size.width, tableView.frame.size.height)];
btnSection.tag = section;
[btnSection setTitle:[sectionArray objectAtIndex:section] forState:UIControlStateNormal];
[btnSection addTarget:self action:@selector(sectionButtonTapped:) forControlEvents:UIControlEventTouchUpInside];
return btnSection;
}
- (void)sectionButtonTapped:(UIButton *)button {
sectionIndex = button.tag;
if (button.tag == 0) {
noOfRows = 3;
} else if (button.tag == 1) {
noOfRows = 1;
} else if (button.tag == 2) {
noOfRows = 2;
}
[self.tableView reloadData];
}
Hope this will help you..
希望能帮到你..
