How to change a UIView background colour upon swipe?

Question

how can I change the UIView background colour by a SwipeGesture? e.g. Green for a Left Swipe and Red for a Right Swipe. Thank you very much.

code doesn't work:

- (void)viewDidLoad {

    self.view.backgroundColor=[[UIColor alloc]initWithRed:24.0/255 green:96.0/255 blue:120.0/255 alpha:0.5];

    UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100.0, 100.0, 100.0, 100.0)];
    [imageView setUserInteractionEnabled:YES];

    [super viewDidLoad];

    UISwipeGestureRecognizer *swipeLeft = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipe:)];
    UISwipeGestureRecognizer *swipeRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipe:)];

    // Setting the swipe direction.
    [swipeLeft setDirection:UISwipeGestureRecognizerDirectionLeft];
    [swipeRight setDirection:UISwipeGestureRecognizerDirectionRight];

    // Adding the swipe gesture on image view
    [self.view addGestureRecognizer:swipeLeft];
    [self.view addGestureRecognizer:swipeRight];
}

    - (void)handleSwipe:(UISwipeGestureRecognizer *)swipe {

        if (swipe.direction == UISwipeGestureRecognizerDirectionLeft) {

            self.view.backgroundColor=[[UIColor alloc]initWithRed:138.0/255 green:24.0/255 blue:47.0/255 alpha:1.0];
            NSLog(@"Left Swipe");
        }

        if (swipe.direction == UISwipeGestureRecognizerDirectionRight) {

            self.view.backgroundColor=[[UIColor alloc]initWithRed:24.0/255 green:96.0/255 blue:120.0/255 alpha:1.0];
            NSLog(@"Right Swipe");
        }

    }

You should show some of the code that you tried and didn't work, if you didn't try anything, I suggest to do before asking :) — Ahmad F, Mar 27 '17 at 07:12
@TallentSiu I added a working codes for you. Please check it out below. I appreciate upvote and/or accept answer if you found it working. :) Happy to help. — handiansom, Mar 28 '17 at 05:17

score 1 · Answer 1 · answered Mar 28 '17 at 05:15

You need to have separate swipe handler to make it work. This works great.

Your codes in setting up your UISwipeGestureRecognizer should look like this.

 UISwipeGestureRecognizer *swipeRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipeRight:)];
    UISwipeGestureRecognizer *swipeLeft = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipeLeft:)];

    swipeRight.direction = UISwipeGestureRecognizerDirectionRight;
    swipeLeft.direction = UISwipeGestureRecognizerDirectionLeft;
    imageView.userInteractionEnabled = YES;
    // Adding the swipe gesture on image view
    [imageView addGestureRecognizer:swipeRight];
    [imageView addGestureRecognizer:swipeLeft];

And your swipe handle should be like this.

- (void)handleSwipeRight:(UISwipeGestureRecognizer *)swipe {
    self.view.backgroundColor=[[UIColor alloc]initWithRed:24.0/255 green:96.0/255 blue:120.0/255 alpha:1.0];
}

- (void)handleSwipeLeft:(UISwipeGestureRecognizer *)swipe {
    self.view.backgroundColor=[[UIColor alloc]initWithRed:138.0/255 green:24.0/255 blue:47.0/255 alpha:1.0];
}

score 0 · Answer 2 · edited May 23 '17 at 12:25

Declare an imageView property in the interface of the ViewController file. @property (weak, nonatomic) UIImageView *imageView;

- (void)viewDidLoad
    {
    [super viewDidLoad];
  self.imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100.0, 100.0, 100.0, 100.0)];
    [imageView setUserInteractionEnabled:YES];

    UISwipeGestureRecognizer *swipeLeft = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipe:)];
    UISwipeGestureRecognizer *swipeRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipe:)];

    // Setting the swipe direction.
    [swipeLeft setDirection:UISwipeGestureRecognizerDirectionLeft];
    [swipeRight setDirection:UISwipeGestureRecognizerDirectionRight];

    // Adding the swipe gesture on image view
    [self.imageView addGestureRecognizer:swipeLeft];
    [self.imageView addGestureRecognizer:swipeRight];

    }

Handling Swipe Gesture Events //newImage and newImage1 are the images files name in your project or ImageAssets - (void)handleSwipe:(UISwipeGestureRecognizer *)swipe {

    if (swipe.direction == UISwipeGestureRecognizerDirectionLeft) {
        NSLog(@"Left Swipe");
self.view.backgroundColor = [UIColor greenColor];
self.imageView.image = [UIImage imageNamed: @"myNewImage.png"];
    }

    if (swipe.direction == UISwipeGestureRecognizerDirectionRight) {
        NSLog(@"Right Swipe");   
    self.view.backgroundColor = [UIColor redColor];
    self.imageView.image = [UIImage imageNamed: @"myNewImage1.png"];
    } 

}

Hope this helps. Happy Coding. refer to this SO Post

Thanks for your reply, but your code doesn't work on my case as it will first change the imageView and then change the background colour for a second swipe only. Can I change both the imageView and the background colour by a same swipe? Thank you. — Tallent Siu, Mar 27 '17 at 08:28
You need to declare the imageView as a property and change the image. Please check my updated answer. — Md. Ibrahim Hassan, Mar 27 '17 at 08:44

How to change a UIView background colour upon swipe?

2 Answers2