How to change border of UIButton if touched outside of UIButton? - ios

Question

Currently I am trying to create a stereotypical "selected" action of an object. That is, when I click on the object, its border changes to a different color, and when I click outside the object, the border changes back to its normal color. I can figure out how to change the border of the object when I touch the inside of the object(in this case, a UIButton) however, I cannot figure out how to change the border of the UIButton back to its original state when I touch outside of the UIButton. Here is my code so far:
- (void)longPress:(UILongPressGestureRecognizer*)gesture {
if ( gesture.state == UIGestureRecognizerStateBegan ) {
gesture.view.layer.borderColor = [UIColor lightGrayColor].CGColor;
UIAlertController * alert= [UIAlertController
alertControllerWithTitle:#"Would you like to delete this rep?"
message:nil
preferredStyle:UIAlertControllerStyleAlert];
UIAlertAction* deleteButton = [UIAlertAction
actionWithTitle:#"Delete"
style:UIAlertActionStyleDefault
handler:^(UIAlertAction * action)
{
[gesture.view removeFromSuperview];
[alert dismissViewControllerAnimated:YES completion:nil];
}];
UIAlertAction* cancelButton = [UIAlertAction
actionWithTitle:#"Cancel"
style:UIAlertActionStyleDefault
handler:^(UIAlertAction * action)
{
gesture.view.layer.borderColor = [UIColor blackColor].CGColor;
[alert dismissViewControllerAnimated:YES completion:nil];
}];
[alert addAction:deleteButton];
[alert addAction:cancelButton];
[self presentViewController:alert animated:YES completion:nil];
}
}
- (void)panWasRecognized:(UIPanGestureRecognizer *)panner {
{
panner.view.layer.borderColor = [UIColor lightGrayColor].CGColor;
_draggedView = panner.view;
CGPoint offset = [panner translationInView:_draggedView.superview];
CGPoint center = _draggedView.center;
_draggedView.center = CGPointMake(center.x + offset.x, center.y + offset.y);
_buttonField.layer.borderWidth = 4.0f;
// Reset translation to zero so on the next `panWasRecognized:` message, the
// translation will just be the additional movement of the touch since now.
[panner setTranslation:CGPointZero inView:_draggedView.superview];
}
}
-(void)buttonTouched:(UIButton*)sender forEvent:(id)tap {
NSSet *touches = [tap allTouches];
UITouch *touch = [touches anyObject];
UITouchPhase *phase = touch.phase;
touch.view.layer.borderColor = [UIColor lightGrayColor].CGColor;
}
-(void)doubleTapped:(UIButton*)sender forEvent:(id)twoTaps {
NSSet *touches = [twoTaps allTouches];
UITouch *touch = [touches anyObject];
UITouchPhase *phase = touch.phase;
touch.view.layer.borderColor = [UIColor blackColor].CGColor;
}
- (IBAction)addRepButton:(UIBarButtonItem *)newRep {
self.labelCounter++;
buttonCount ++;
if (buttonCount > 0 )
{
_buttonField = [[UIButton alloc]initWithFrame:CGRectMake(300, 300, 28, 28)];
[_buttonField setTitle:[NSString stringWithFormat:#"%i", self.labelCounter]forState:UIControlStateNormal];
[_buttonField setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
_buttonField.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;
_buttonField.userInteractionEnabled = YES;
_buttonField.layer.cornerRadius = 14;
_buttonField.layer.borderColor = [UIColor blackColor].CGColor;
_buttonField.layer.borderWidth = 4.0f;
_buttonField.titleLabel.font = [UIFont systemFontOfSize: 18];
[_buttonField setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
_buttonField.layer.backgroundColor = [UIColor blackColor].CGColor;
//Pan gesture declared in button
UIPanGestureRecognizer *panner = [[UIPanGestureRecognizer alloc] initWithTarget:self action:#selector(panWasRecognized:)];
[_buttonField addGestureRecognizer:panner];
//Long Press gesture declared in button
UILongPressGestureRecognizer *longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:#selector(longPress:)];
[self.buttonField addGestureRecognizer:longPress];
//Touch down inside declared in button
[self.buttonField addTarget:self action:#selector(buttonTouched:forEvent:) forControlEvents:UIControlEventTouchDown];
//Double Tap inside declared in button
[self.buttonField addTarget:self action:#selector(doubleTapped:forEvent:) forControlEvents:UIControlEventTouchDownRepeat];
[self.view addSubview:_buttonField];
}
}
#end
I need to find out how to change the border of the UIButton back to normal when touching outside of the UIButton in order to get the true "select/deselect" feel.

Answer 1

It seems like the problem isn't that you can't change the border back as much as it is you can't trigger the action when the user touches outside of the button.
I would suggest approaching this problem from the perspective of Setting the button as unselected anytime the user does not touch that button. There are a couple ways to do that.
One option, if all of your other buttons and touch areas disable that button, you could add the action to deselect that button when any other button is touched.
UISegmentedController is designed to only allow one item to be selected a time so this could be an option as well if your design allows for it.
You could look at all touch events on the screen and for any touch with the state UIGestureRecognizerStateBegan that is outside of your button you could set your button to be unselected.
This would look like this:
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(nullable UIEvent *)event {
UITouch *aTouch = [touches anyObject];
CGPoint point = [aTouch locationInView:self.myButton.superView];
if (!CGRectContainsPoint(self.myButton, point)) {
// deselect button
}
}
There are definitely more ways to try to solve the problem, but I find these three generally cover most any situation.