ios - UITableView 具有开放和封闭的部分

Question

我有一个包含几个部分的 UITableView。我想点击一个部分来“关闭/打开”它的内容，以便显示/隐藏它下面的行。这样，我可以保持一些部分打开（其行可见）而其他部分关闭，下一个部分紧挨上一个部分标题的下方。

我该如何实施？我是否需要继承 UITableView 并添加手势识别器并以某种方式向行添加动画？但我不确定这很容易......

谢谢

Answer 1

我无法评论这个问题，因为我没有足够的声誉。
据我了解，您希望为表格视图实现手风琴功能。
为此，请检查以下内容：-
UItableVIew 中的效果或动画以及
如何为 iPhone SDK 应用程序实现手风琴视图？

Answer 2

1. 用于reloadSections:withRowAnimation触发更改；
2. 在UITableViewDataSource 委托中提供更新的行数

Answer 3

只需继承 sectionHeaderView 并定义这样的委托方法。

@protocol SectionHeaderViewDelegate <NSObject>

@optional
-(void)sectionHeaderView:(SectionHeaderView*)sectionHeaderView sectionOpened:(NSInteger)section;
-(void)sectionHeaderView:(SectionHeaderView*)sectionHeaderView sectionClosed:(NSInteger)section;

@end

然后在 tableViewCOntroller.h

@interface TableViewController : UITableViewController <SectionHeaderViewDelegate>

并在 tableViewCOntroller.m

-(void)sectionHeaderView:(SectionHeaderView*)sectionHeaderView sectionOpened:(NSInteger)sectionOpened 
{

    SectionInfo *sectionInfo = [self.sectionInfoArray objectAtIndex:sectionOpened];

    sectionInfo.open = YES;

    /*
     Create an array containing the index paths of the rows to insert: These correspond to the rows for each quotation in the current section.
     */
    NSInteger countOfRowsToInsert = [sectionInfo.play.quotations count];
    NSMutableArray *indexPathsToInsert = [[NSMutableArray alloc] init];
    for (NSInteger i = 0; i < countOfRowsToInsert; i++) {
        [indexPathsToInsert addObject:[NSIndexPath indexPathForRow:i inSection:sectionOpened]];
    }

    /*
     Create an array containing the index paths of the rows to delete: These correspond to the rows for each quotation in the previously-open section, if there was one.
     */
    NSMutableArray *indexPathsToDelete = [[NSMutableArray alloc] init];

    NSInteger previousOpenSectionIndex = self.openSectionIndex;
    if (previousOpenSectionIndex != NSNotFound) {

        SectionInfo *previousOpenSection = [self.sectionInfoArray objectAtIndex:previousOpenSectionIndex];
        previousOpenSection.open = NO;
        [previousOpenSection.headerView toggleOpenWithUserAction:NO];
        NSInteger countOfRowsToDelete = [previousOpenSection.play.quotations count];
        for (NSInteger i = 0; i < countOfRowsToDelete; i++) {
            [indexPathsToDelete addObject:[NSIndexPath indexPathForRow:i inSection:previousOpenSectionIndex]];
        }
    }

    // Style the animation so that there's a smooth flow in either direction.
    UITableViewRowAnimation insertAnimation;
    UITableViewRowAnimation deleteAnimation;
    if (previousOpenSectionIndex == NSNotFound || sectionOpened < previousOpenSectionIndex) {
        insertAnimation = UITableViewRowAnimationTop;
        deleteAnimation = UITableViewRowAnimationBottom;
    }
    else {
        insertAnimation = UITableViewRowAnimationBottom;
        deleteAnimation = UITableViewRowAnimationTop;
    }

    // Apply the updates.
    [self.tableView beginUpdates];
    [self.tableView insertRowsAtIndexPaths:indexPathsToInsert withRowAnimation:insertAnimation];
    [self.tableView deleteRowsAtIndexPaths:indexPathsToDelete withRowAnimation:deleteAnimation];
    [self.tableView endUpdates];
    self.openSectionIndex = sectionOpened;

}


-(void)sectionHeaderView:(SectionHeaderView*)sectionHeaderView sectionClosed:(NSInteger)sectionClosed 
{

    /*
     Create an array of the index paths of the rows in the section that was closed, then delete those rows from the table view.
     */
    SectionInfo *sectionInfo = [self.sectionInfoArray objectAtIndex:sectionClosed];

    sectionInfo.open = NO;
    NSInteger countOfRowsToDelete = [self.tableView numberOfRowsInSection:sectionClosed];

    if (countOfRowsToDelete > 0) 
    {
        NSMutableArray *indexPathsToDelete = [[NSMutableArray alloc] init];
        for (NSInteger i = 0; i < countOfRowsToDelete; i++) {
            [indexPathsToDelete addObject:[NSIndexPath indexPathForRow:i inSection:sectionClosed]];
        }
        [self.tableView deleteRowsAtIndexPaths:indexPathsToDelete withRowAnimation:UITableViewRowAnimationTop];
    }
    self.openSectionIndex = NSNotFound;
    if ([selectedIndexes count]>0) 
    {
        for(NSIndexPath *indexPath in selectedIndexes)
        {
            if(sectionClosed == indexPath.section)
            {
                [sectionInfo.headerView changeOnHighlighted:YES];
                break;
            }
            else
            {
                [sectionInfo.headerView changeOnHighlighted:NO];
            }
        }
    }
    else
        {
                [sectionInfo.headerView changeOnHighlighted:NO];

        }

}

有关更多详细信息，您可以参考 iOS 开发库中的这个示例项目。

Answer 4

这是一个简单的解决方案，您甚至可以通过它创建自定义展开/折叠视图。这是简单的步骤 1）在其上创建一个自定义视图添加按钮。 /// 加入所有出口并在视图类中创建 BOOL 变量

@property (weak, nonatomic) IBOutlet UIButton *BtnAction;
@property(assign, nonatomic)BOOL isOpen;

// 创建一个标题，其中添加了 tableview 并且你想要它。这是一个简单的逻辑，可以根据需要添加。我在 headertitle 数组中添加了我希望它是动态的。

NSMutableArray * headerTitle = [NSMutableArray arrayWithObjects:@"Your Order", @"Delivery Address", @"Pay By", nil];
for (NSUInteger index = 0; index<headerTitle.count; index++) {
    VGOrderHeader* HeaderView = [[[NSBundle mainBundle] loadNibNamed:@"VGOrderHeader" owner:self options:nil] lastObject];
    HeaderView.frame = CGRectMake(0, 0, 32, 40);
    HeaderView.BtnAction.tag = index;
    if (index == 0) {
        HeaderView.isOpen = YES;
        HeaderView.lblPlus.text = [NSString stringWithFormat:@"open"];

    }
    [HeaderView.BtnAction addTarget:self action:@selector(selectSectionToOpen:) forControlEvents:UIControlEventTouchUpInside];
    [headerArray addObject:HeaderView];
}

/// 这是标题点击动作。

-(void)selectSectionToOpen:(UIButton *)sender{
      for (NSUInteger Increment=0; Increment<headerArray.count; Increment++) {
        if (sender.tag == Increment) {
            DCOrderHeader* HeaderView= headerArray[Increment];
                HeaderView.isOpen = !HeaderView.isOpen;

         }
     }
    // little animation 
        dispatch_async(dispatch_get_main_queue(), ^{
      [UIView transitionWithView:self.tableView
                      duration:0.55f
                              options:UIViewAnimationOptionTransitionCrossDissolve
                    animations:^(void) {
                        [self.tableView reloadData];
                    } completion:NULL];
});

}

/// 最后在表格视图的标题方法中分配视图并提供高度

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    return 40;
}

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    return [headerArray objectAtIndex:section];

}

// 最后的接触

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return headerArray.count;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    DCOrderHeader* HeaderView = headerArray[section];
        if (HeaderView.isOpen == YES) {
              return self.someArray.count;
        }else{
              return 0;
            }
}