swift 如何创建滑动开始按钮与移动箭头

zbdgwd5y  于 2023-08-02  发布在  Swift
关注(0)|答案(2)|浏览(151)

我想创建完全相同的滑动按钮,如https://github.com/shadowfaxtech/proSwipeButton。我想知道如何改变用户触摸按钮的箭头
我这么做是为了获得刷卡行动。

let rightSwipe = UISwipeGestureRecognizer(target: self, action: #selector(handleSwipes(_:)))
rightSwipe.direction = .right
view.addGestureRecognizer(rightSwipe)

字符串
但问题是如何添加箭头到按钮,改变有用户触摸的位置。

oipij1gg

oipij1gg1#

下面是我写的用于在按钮上滑动的代码。将图像指定给图像视图。

func createSwipeButton() {
        let button = UIButton.init(type: .custom)
        button.backgroundColor = UIColor.brown
        button.setTitle("PLACE ORDER", for: .normal)
        button.frame = CGRect.init(x: 10, y: 200, width: self.view.frame.size.width-20, height: 100)
        button.addTarget(self, action: #selector(swiped(_:event:)), for: .touchDragInside)
        button.addTarget(self, action: #selector(swipeEnded(_:event:)), for: .touchUpInside)
        self.view.addSubview(button)
        
        let swipableView = UIImageView.init()
        swipableView.frame = CGRect.init(x: 0, y: 0, width: 20, height: button.frame.size.height)
        swipableView.tag = 20
        swipableView.backgroundColor = UIColor.white
        button.addSubview(swipableView)
    }
    
    @objc func swiped(_ sender : UIButton, event: UIEvent) {
        let swipableView = sender.viewWithTag(20)!
        let centerPosition = location(event: event, subView: swipableView, superView: sender,isSwiping: true)
        UIView.animate(withDuration: 0.2) {
            swipableView.center = centerPosition
        }
    }
    
    @objc func swipeEnded(_ sender : UIButton, event: UIEvent) {
        let swipableView = sender.viewWithTag(20)!
        let centerPosition = location(event: event, subView: swipableView, superView: sender, isSwiping: false)
        UIView.animate(withDuration: 0.3, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 5, options: .curveEaseInOut, animations: {
            swipableView.center = centerPosition
        }) { _ in
           let halfScreenWidth = UIScreen.main.bounds.width/2
           if centerPosition.x > halfScreenWidth {
            print("button pressed action")
           }
        }
    }
    
    func location(event: UIEvent, subView: UIView, superView: UIButton, isSwiping: Bool) -> CGPoint {
        if let touch = event.touches(for: superView)?.first{
            let previousLocation = touch.previousLocation(in: superView)
            let location = touch.location(in: superView)
            let delta_x = location.x - previousLocation.x;
            print(subView.center.x + delta_x)
            var centerPosition = CGPoint.init(x: subView.center.x + delta_x, y: subView.center.y)
            let minX = subView.frame.size.width/2
            let maxX = superView.frame.size.width - subView.frame.size.width/2
            centerPosition.x = centerPosition.x < minX ? minX : centerPosition.x
            centerPosition.x = centerPosition.x > maxX ? maxX : centerPosition.x
            if !isSwiping{
                let normalPosition = superView.frame.size.width * 0.5
                centerPosition.x = centerPosition.x > normalPosition ? maxX : minX
                centerPosition.x = centerPosition.x <= normalPosition ? minX : centerPosition.x
            }
            return centerPosition
        }
        return CGPoint.zero
    }

字符串


的数据

完整的项目在github上:https://github.com/IamSaurav/SwipeButton

twh00eeo

twh00eeo2#

嗯,像这样的怎么样?您可以在swipeImage var的故事板中添加UIImage。如果图像与文本颜色相同,则效果最佳。
导入UIKit

@IBDesignable
class UISwipeableLabel: UILabel {

    @IBInspectable var swipeImage: UIImage? {
        didSet {
            configureSwipeImage()
        }
    }

    private var swipeImageView: UIImageView?
    private var rightSwipe: UIPanGestureRecognizer?
    private var shouldActivateButton = true

    override func awakeFromNib() {
        super.awakeFromNib()
        configureSwipeImage()
         clipsToBounds = true
    }
}

private extension UISwipeableLabel {

    @objc func handleSwipes(_ sender:UIPanGestureRecognizer) {
        if let centerX = swipeImageView?.center.x {
            let translation = sender.translation(in: self)
            let percent = centerX/frame.width

             if sender.state == .changed {
                if centerX < frame.width - frame.height/2 {
                    swipeImageView?.center.x = centerX + translation.x
                    sender.setTranslation(CGPoint.zero, in: swipeImageView)
                } else {
                    swipeImageView?.center.x = frame.width - frame.height/2
                    if shouldActivateButton {
                        activateButton()
                    }
                }
            }

             if sender.state == .ended || sender.state == .cancelled || sender.state == .failed {
                if shouldActivateButton {
                    UIView.animate(withDuration: 0.25 * TimeInterval(percent)) {
                        self.swipeImageView?.center.x = self.frame.height/2
                    }
                }
            }
        }
    }

    func configureSwipeImage() {
        if swipeImageView != nil {
            swipeImageView?.removeFromSuperview()
        }

        swipeImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: frame.height, height: frame.height))

        if let swipeImageView = swipeImageView {
            swipeImageView.image = swipeImage
            swipeImageView.isUserInteractionEnabled =  true
             swipeImageView.alpha = 0.5
             addSubview(swipeImageView)

             rightSwipe = UIPanGestureRecognizer(target: self, action: #selector(handleSwipes(_:)))
            if let rightSwipe = rightSwipe {
                swipeImageView.addGestureRecognizer(rightSwipe)
            }
        }
    }

    func activateButton() {
        print("*** DO YOUR STUFF HERE ***")
        }
}

字符串
您从UILabel开始,如果需要,可以将其更改为使用自动布局。

相关问题