在 tableView:editActionsForRowAt 中使用 buttons/images:

Using buttons/images in tableView:editActionsForRowAt:

我正在尝试使用 tableView:editActionsForRowAt:,按钮带有图像而不是通常的文本。 但也有一些挑战。有人可以帮助我吗?

首先这是我已经在做的事情,-- 在 SOF 的一些宝贵帮助下--

这是我理想中想要得到的:

相关代码如下。上面的第一种情况是在 xShift 和 xShiftInc 都设置为 0.0 时获得的。 第二种情况是将xShift初始化为30.0,将xShiftInc初始化为20.0.

图形上我得到了我想要的结果,但问题是按钮的触摸区域没有像图像那样移动。换句话说,在第二种情况下,如果我触摸垃圾,它会打印 "upBtn touched!"。 要打印 "rmvBtn touched!",我需要触摸垃圾箱的左侧。

此外,我对单元格高度使用 46.0 不是很满意,我想要一个更通用的参数(rowHeigh 等于 -1,所以不能使用)。但这是一个不同的问题。

func tableView(_ tableView: UITableView,
               editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {
    var patternImg:UIImage?, xShift = CGFloat(30.0)//CGFloat(0.0)//
    let xShiftInc = CGFloat(20.0)//CGFloat(0.0)//

    let downBtn = UITableViewRowAction(style: .normal, title: "") {
        action, index in
        print("downBtn touched!")
    }
    patternImg = swipeCellImage(named: "DownIcn", side: 46.0, horizOffSet: xShift)
    downBtn.backgroundColor = UIColor(patternImage: patternImg!)

    let upBtn = UITableViewRowAction(style: .normal, title: "") {
        action, index in
        print("upBtn touched!")
    }
    xShift += xShiftInc
    patternImg = self.swipeCellImage(named: "UpIcn", side: 46.0, horizOffSet: xShift)
    upBtn.backgroundColor = UIColor(patternImage: patternImg!)

    let rmvBtn = UITableViewRowAction(style: .destructive, title: "") {
        action, index in
        print("rmvBtn touched!")
    }
    xShift += xShiftInc
    patternImg = swipeCellImage(named: "TrashIcn", side: 46.0, horizOffSet: xShift)
    rmvBtn.backgroundColor = UIColor(patternImage: patternImg!)

    return [downBtn,upBtn,rmvBtn]
}


func swipeCellImage(named name: String, side: CGFloat, horizOffSet: CGFloat) -> UIImage? {
    let theImage = UIImage(named: name)
    UIGraphicsBeginImageContextWithOptions(CGSize(width: UIScreen.main.bounds.width,
                                                  height: side), false, UIScreen.main.scale)
    let context = UIGraphicsGetCurrentContext()
    context!.setFillColor(UIColor.clear.cgColor)
    theImage?.draw(in: CGRect(x: horizOffSet, y: 0, width: side, height: side))
    let resultImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return resultImage
}

简单的逻辑..!!手动我们不给 xshift 和 xshiftinc。

案例一:

let downBtn = UITableViewRowAction(style: .normal, title: "") {
        action, index in
        print("downBtn touched!")
}

此处标题的文本是“”[没有 spaces 的空字符串]

因此,tableview 自动为每个宽度取 30px。如果我们添加文本,它会自动增加它的宽度。

案例二:

let downBtn = UITableViewRowAction(style: .normal, title: " ") {
        action, index in
        print("downBtn touched!")
}

此处标题的文本是“”[带 1 的空字符串 space]

因此,tableview 为此自动采用宽度 35px。

希望你明白以上内容。

现在,我修改了你的代码。

 func tableView(_ tableView: UITableView,
               editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {


    let cell = tableView.cellForRow(at: indexPath) as!      myTableViewCell

    print("cell_height    ", cell.frame.size.height) // U MAY GET ROW HEIGHT HERE

    var patternImg:UIImage?

    let downBtn = UITableViewRowAction(style: .normal, title: "  ") {
        action, index in
        print("downBtn touched!")
    }
    patternImg = swipeCellImage(named: "down", rowHeight: cell.frame.size.height)
    downBtn.backgroundColor = UIColor(patternImage: patternImg!)

    let upBtn = UITableViewRowAction(style: .normal, title: "  ") {
        action, index in
        print("upBtn touched!")
    }

    patternImg = self.swipeCellImage(named: "up", rowHeight: cell.frame.size.height)
    upBtn.backgroundColor = UIColor(patternImage: patternImg!)

    let rmvBtn = UITableViewRowAction(style: .destructive, title: "  ") {
        action, index in
        print("rmvBtn touched!")
    }

    let patternIm = swipeCellImage(named: "trash", rowHeight: cell.frame.size.height)

    rmvBtn.backgroundColor = UIColor(patternImage: patternIm!)


    return [downBtn,upBtn,rmvBtn]
}


func swipeCellImage(name: String, rowHeight: CGFloat) -> UIImage? {

    let imgYposition : CGFloat = (rowHeight - 30) / 2

    // NOTE: This 30px is image height. Image height is always should be less than Rowheight.

    let theImage = UIImage(named: name)
    UIGraphicsBeginImageContextWithOptions(CGSize(width: UIScreen.main.bounds.width,
                                                  height: rowHeight), false, UIScreen.main.scale)
    let context = UIGraphicsGetCurrentContext()
    context!.setFillColor(UIColor.yellow.cgColor)
    context!.fill(CGRect(x: 0, y: 0, width: (self.view.frame.width) / 3, height: side))

    theImage?.draw(in: CGRect(x: 5, y: imgYposition, width: 30, height: 30))

    // In this sample, am taking rowHeight as 44px.
    // Images should be 30 * 30 sizes.
    // I gave two spaces in title. So total width is 40px.
    // So,x = 5px and y = 7px.

    let resultImage : UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
    return resultImage
}

输出

如果您想在三个按钮之间留出更多间距,只需增加标题的空白文本并计算宽度并保持图片居中。