当单元格处于焦点时,iOS将视图放在TableViewCell上

时间:2014-07-19 12:48:19

标签: ios objective-c uitableview uiview

在VC中,我有一个带有自定义Cell" ChartListCell"的tableView。当用户在任何特定单元格上时,我想在单元格顶部打开一个带有2个按钮的视图,让用户点击任何按钮,并对该单元格采取适当的操作。实现此功能的最佳方法是什么?我被困在: -

  1. 选择查找单元格/行的事件。
  2. 将视图放在单元格中。位置 - 所以它保持在单元格顶部。
  3. 使用2个btns创建视图 - 最好以编程方式创建它,这样事件只能在同一个VC中提及或者创建一个xib会更好吗?
  4. 选择丢失时再次隐藏视图。
  5. 更新: -    所以我点击单元格,出现视图(如下面的2个按钮)。如果我滚动表格,视图将保留在单元格上。一旦我点击新视图上的选项,或点击另一个单元格或外面的某个地方就消失了。

    更新: - 我创建了一个xib文件并在didSelectRowAtIndexPath尝试显示该视图,但它没有出现。

            // Get the SELECTED CELL
        ChartListCell *cell = (ChartListCell*)[tableView cellForRowAtIndexPath:indexPath];
    
        NSLog(@"ABOUT TO SHOW VOV");
    
        NSArray *visitorOptView = [[NSBundle mainBundle] loadNibNamed:@"VisitorsOptionsView" owner:self options:Nil];
        VisitorsOptionsView *vov = [visitorOptView objectAtIndex:0];
        vov.frame = cell.frame;
        [self.view addSubview:vov];
        [self.view bringSubviewToFront:vov];
    

    什么都没有出现。我哪里错了?为了给出与单元格相同的位置,我尝试vov.frame = cell.frame,但我认为在这一步可能是错的。还有什么应该在那个地方?

    实施上述方法的最佳方法是什么?能帮我指导一下吗?任何帮助都非常感谢。

    下图显示了我想要满足的设计: - enter image description here

2 个答案:

答案 0 :(得分:1)

我做了类似的事情,我在创建自定义单元格时做了什么我在底部放置了另一个包含两个按钮的视图,将两个按钮设为其类的IBOutlets。

当我使用CellForROwAtIndexpath中的常规方法将其加载到我的表视图中时,我定义如下...

- (UITableViewCell *)couchTableSource:(CBLUITableSource*)source
                cellForRowAtIndexPath:(NSIndexPath *)indexPath
{

      NSString *cellid=@"Cell";

            CustomTableCell* cell=(CustomTableCell*)[_Mytableview     dequeueReusableCellWithIdentifier:cellid];

            if(cell==nil)
                {
                NSArray *nib=[[NSBundle mainBundle] loadNibNamed:@"CustomTableCell" owner:self options:nil];
                cell=[nib objectAtIndex:0];
                }

    [cell.firstButton addTarget:self action:@selector(firstButtonClicked:event:) forControlEvents:UIControlEventTouchUpInside];
        [cell.secondButton addTarget:self action:@selector(SecondButtonClicked:event:) forControlEvents:UIControlEventTouchUpInside];

}

我将全局整数标志维护为SelectedIndex并按如下方式使用

在didSelectRowAtIndexPath中我做过像这样的事情..

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
 if(selectedIndex == indexPath.row)
        {
        selectedIndex = -1;
        [_Mytableview reloadRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationFade];

        return;
        }

    //First we check if a cell is already expanded.
    //If it is we want to minimize make sure it is reloaded to minimize it back
    if(selectedIndex >= 0)
        {
        NSIndexPath *previousPath = [NSIndexPath indexPathForRow:selectedIndex inSection:0];
        selectedIndex = indexPath.row;
        [_Mytableview reloadRowsAtIndexPaths:[NSArray arrayWithObject:previousPath] withRowAnimation:UITableViewRowAnimationFade];
        }

    //Finally set the selected index to the new selection and reload it to expand
    selectedIndex = indexPath.row;

    [_Mytableview reloadRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationFade];


}

也是heightForRowAtIndexPath

中最重要的一步
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{

    if(indexPath.row == selectedIndex)
        {

        return  (return the actual size of the cell, Including the view with two buttons);
        }
    else
        {
        return (return the size of cell -(the size of view containing the two buttons));
        }
}

在viewWillAppear中,确保分配这个,以便每当出现时单元格都是正常的

-(void)viewWillAppear:(BOOL)animated
{

  selectedIndex=-1;

   [myTableView reloadData];
}

答案 1 :(得分:1)

我为你制作了这个演示项目:http://goo.gl/Y6GFmj,你可以下载它

您可以将视图添加到表格单元格而不是视图中。您需要子类化表视图单元格并添加属性以保存叠加视图。

    @interface MyTableViewCell : UITableViewCell
    @property (weak, nonatomic) UIView * overlayView;
    @end

请注意,叠加视图应该是弱属性,因为单元格视图将具有对它的强引用,就像IBOutlet一样。

您需要在表视图控制器中添加另一个属性来保存最后选择的索引路径,以便在选择新行时,可以删除旧行中的叠加视图。

    @property (strong, nonatomic) NSIndexPath * lastSelectedRow;

使用以下功能从单元格中删除叠加视图

    - (void)removeViewInCellOfIndexPath:(NSIndexPath *)indexPath
    {
        if (!indexPath)
        return;

        MyTableViewCell * cell = (MyTableViewCell *)[self.tableView cellForRowAtIndexPath:indexPath];
        if (cell.overlayView)
        {
            [cell.overlayView removeFromSuperview];
        }

    }

现在您可以处理选择:

    - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
    {
        // deselecte the row
        [tableView deselectRowAtIndexPath:indexPath animated:NO];

        // remove the overlay view from the last selected row
        [self removeViewInCellOfIndexPath:self.lastSelectedRow];

        // add overlay view to this row
        MyTableViewCell * cell = (MyTableViewCell *)[tableView cellForRowAtIndexPath:indexPath];

        // note the origin of the frame is (0, 0) since you are adding itto the cell instead of the table view
        UIView * view = [[UIView alloc]initWithFrame:CGRectMake(0, 0, cell.frame.size.width, cell.frame.size.height)];
        view.backgroundColor = [UIColor greenColor];
        [cell.contentView addSubview:view];

        // remember this view and this indexpath
        cell.overlayView = view;
        self.lastSelectedRow = indexPath;
    }