RxSwift: How to add gesture to UILabel? - ios

Question

I have a label with isUserInteractionEnabled set to true. Now, I need to add UITapGestureRecognizer for the label. Is there a way to add in Rx way.
I have looked at the RxSwift library here. Which they didn't provide any extension for adding gesture. The UILabel+Rx file has only text and attributedText.
Is there any workaround to add gesture to label?

Answer 1

A UILabel is not configured with a tap gesture recognizer out of the box, that's why RxCocoa does not provide the means to listen to a gesture directly on the label. You will have to add the gesture recognizer yourself. Then you can use Rx to observe events from the recognizer, like so:
let disposeBag = DisposeBag()
let label = UILabel()
label.text = "Hello World!"
let tapGesture = UITapGestureRecognizer()
label.addGestureRecognizer(tapGesture)
tapGesture.rx.event.bind(onNext: { recognizer in
print("touches: \(recognizer.numberOfTouches)") //or whatever you like
}).disposed(by: disposeBag)

Answer 2

Swift 5 (using RxGesture library).
Best and simplest option imho.
label
.rx
.tapGesture()
.when(.recognized) // This is important!
.subscribe(onNext: { [weak self] _ in
guard let self = self else { return }
self.doWhatYouNeedToDo()
})
.disposed(by: disposeBag)
Take care! If you don't use .when(.recognized) the tap gesture will fire as soon as your label is initialised!

Answer 3

Swift 4 with RxCocoa + RxSwift + RxGesture
let disposeBag = DisposeBag()
let myView = UIView()
myView.rx
.longPressGesture(numberOfTouchesRequired: 1,
numberOfTapsRequired: 0,
minimumPressDuration: 0.01,
allowableMovement: 1.0)
.when(.began, .changed, .ended)
.subscribe(onNext: { pan in
let view = pan.view
let location = pan.location(in: view)
switch pan.state {
case .began:
print("began")
case .changed:
print("changed \(location)")
case .ended:
print("ended")
default:
break
}
}).disposed(by bag)
or
myView.rx
.gesture(.tap(), .pan(), .swipe([.up, .down]))
.subscribe({ onNext: gesture in
switch gesture {
case .tap: // Do something
case .pan: // Do something
case .swipeUp: // Do something
default: break
}
}).disposed(by: bag)
or event clever, to return an event. i.e string
var buttons: Observable<[UIButton]>!
let stringEvents = buttons
.flatMapLatest({ Observable.merge($0.map({ button in
return button.rx.tapGesture().when(.recognized)
.map({ _ in return "tap" })
}) )
})

Answer 4

Those extensions are technically part of the RxCocoa libary which is currently packaged with RxSwift.
You should be able to add the UITapGestureRecognizer to the view then just use the rx.event (rx_event if older) on that gesture object.
If you have to do this in the context of the UILabel, then you might need to wrap it inside the UILabel+Rx too, but if you have simpler requirements just using the rx.event on the gesture should be a good workaround.

Answer 5

You can subscribe label to the tap gesture
label
.rx
.tapGesture()
.subscribe(onNext: { _ in
print("tap")
}).disposed(by: disposeBag)

Answer 6

As Write George Quentin. All work.
view.rx
.longPressGesture(configuration: { gestureRecognizer, delegate in
gestureRecognizer.numberOfTouchesRequired = 1
gestureRecognizer.numberOfTapsRequired = 0
gestureRecognizer.minimumPressDuration = 0.01
gestureRecognizer.allowableMovement = 1.0
})
.when(.began, .changed, .ended)
.subscribe(onNext: { pan in
let view = pan.view
let location = pan.location(in: view)
switch pan.state {
case .began:
print(":DEBUG:began")
case .changed:
print(":DEBUG:changed \(location)")
case .ended:
print(":DEBUG:end \(location)")
nextStep()
default:
break
}
})
.disposed(by: stepBag)

Answer 7

I simple use this extension to get the tap as Driver in UI layer.
public extension Reactive where Base: RxGestureView {
func justTap() -> Driver<Void> {
return tapGesture()
.when(.recognized)
.map{ _ in }
.asDriver { _ in
return Driver.empty()
}
}
}
When I need the tap event I call this
view.rx.justTap()