代码之家  ›  专栏  ›  技术社区  ›  Michel

在tableView中使用按钮/图像:编辑操作错误:

  •  0
  • Michel  · 技术社区  · 7 年前

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

    首先是我已经在做的工作,在SOF的宝贵帮助下--

    enter image description here

    以下是我理想中想要得到的:

    enter image description here

    相关代码如下所示。当xShift和xShiftInc都设置为0.0时,会出现上述第一种情况。 第二种情况是将xShift初始化为30.0,将xShift inc初始化为20.0。

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

    此外,我对使用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
    }
    
    1 回复  |  直到 7 年前
        1
  •  1
  •   McDonal_11    7 年前

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

    案例1:

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

    此处标题的文本为“”[无空格的空字符串]

    enter image description here

    因此,tableview会自动为每个视图获取30px的宽度。如果我们添加文本,它将自动增加其宽度大小。

    案例2:

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

    此处标题的文本为“”[带1个空格的空字符串]

    enter image description here

    因此,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
    }
    

    输出

    enter image description here

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