Snapchat-like text on image

后端 未结 4 922
独厮守ぢ
独厮守ぢ 2021-02-06 13:51

I have been trying to implement a Snapchat-like edit text on an image. What I did so far is implement a UILabel in the center of the UIImageView and I added 3 gestures to this U

相关标签:
4条回答
  • 2021-02-06 14:19

    I'm not sure if this is exactly what you're looking for (I've never used snapchat), but this could give you some ideas

    https://github.com/danielinoa/DIImageView

    I'm not sure this one has a pinch gesture, but I'm not entirely sure how you mean it to be used anyway.

    Here is a demo of that project: https://www.cocoacontrols.com/controls/diimageview

    In general, I recommend checking cocoacontrols every time you venture to implement something like this. There are usually solid examples to get you started, and sometimes, you'll find exactly what you need.

    0 讨论(0)
  • 2021-02-06 14:38

    Found a solution, apparently all I needed to do in the Rotation & Pinch is to always reset the view's rotation / scale. For instance, setting my recognizer.scale to 1.0 and recognizer.rotation to 0.0.

    Here is an example of my code:

    func handlePan(recognizer: UIPanGestureRecognizer) {
        let translation = recognizer.translationInView(view)
        if let view = recognizer.view {
            view.center = CGPoint(x:view.center.x + translation.x,
                y:view.center.y + translation.y)
        }
        recognizer.setTranslation(CGPointZero, inView: view)
    }
    
    func handlePinch(recognizer: UIPinchGestureRecognizer) {
        if let view = recognizer.view as? UILabel {
            let pinchScale: CGFloat = recognizer.scale
            view.transform = CGAffineTransformScale(view.transform, pinchScale, pinchScale)
            recognizer.scale = 1.0
        }
    }
    
    func handleRotate(recognizer: UIRotationGestureRecognizer) {
        if let view = recognizer.view as? UILabel {
            let rotation: CGFloat = recognizer.rotation
            view.transform = CGAffineTransformRotate(view.transform, rotation)
            recognizer.rotation = 0.0
        }
    }
    
    0 讨论(0)
  • 2021-02-06 14:39

    The issue you have is that your code takes the current transform and adds another transform based on the current "movement", so you accumulate changes (compound them, really) as you move during a single gesture.

    Keep instance variables for rotation, scale, and movement, update the relevant one in each of your gesture recognizer's actions (you'll also need to store the state of each at the beginning of each gesture, so you can apply the delta to the initial state), and create the transform from scratch using those three variables. The transform creating should of course be factorized in a separate function, since you're going to use it several times.

    0 讨论(0)
  • 2021-02-06 14:40

    For "it scales up / down way too much in a very aggressive way":

    You need to handle the pinch gesture scale value according to your need.

    From your recogniser method, you get the scale value as:

        var pinchScale: CGFloat = recogniser.scale
    

    You need to modify this value either like decrease it by /10 or /100 as per your need, and use this value in the label transformation instead of using the pangesture scale.

    0 讨论(0)
提交回复
热议问题