iOS how to manually tweak UIImageView to make it acts like a button?

Question

For some reason I have to use a customized UIView which contains several UIImageViews in it to act as a button. (I cannot use a button instead, since the imageViews have independent dynamic contents)

I want them(all the imageViews in my customized UIView) to be dimmed when the touch begins then back to normal when the touch ends.

I plan to use a UITapGestureRecognizer to implement this. So in my customized UIView, I have a tapGestureRecognizer. My code looks like this:

- (void)costomizedViewTapped:(UITapGestureRecognizer *)tapRecognizer {
  if (tapRecognizer.state == UIGestureRecognizerStateBegan) {
    // dim all my imageViews
    NSLog(@"dimmed");
  }
  if (tapRecognizer.state == UIGestureRecognizerStateCancelled ||
      tapRecognizer.state == UIGestureRecognizerStateEnded ||
      tapRecognizer.state == UIGestureRecognizerStateFailed) {
    // make all my imageViews back to normal
    NSLog(@"normaled");
    if (tapRecognizer.state == UIGestureRecognizerStateEnded) {
      // do something to handle the tap
    }
  }
}

My simple silly question is that how can I dim the imageViews to make them appear like a button being pressed?

Also, I found that my code can only log out the message normaled for each tap, but I want it to be able to log out dimmed when the tap begins, how can I modify my code to do that?

May be a dup of http://stackoverflow.com/questions/4681903/how-to-implement-highlighting-on-uiimage-like-uibutton-does-when-tapped — danh, Sep 29 '14 at 04:16

score 2 · Answer 1 · answered Sep 29 '14 at 04:31

2

Why can't you use UIButton ? If you are worried about the image size, you can always handle it like this:

[myButton.imageView setContentMode:UIViewContentModeScaleAspectFill];

Other options are:

typedef NS_ENUM(NSInteger, UIViewContentMode) {
    UIViewContentModeScaleToFill,
    UIViewContentModeScaleAspectFit,      
    UIViewContentModeScaleAspectFill,     
    UIViewContentModeRedraw,              
    UIViewContentModeCenter,              
    UIViewContentModeTop,
    UIViewContentModeBottom,
    UIViewContentModeLeft,
    UIViewContentModeRight,
    UIViewContentModeTopLeft,
    UIViewContentModeTopRight,
    UIViewContentModeBottomLeft,
    UIViewContentModeBottomRight,
};

This ways you won't have to implement the tap gestures.

And, the button has a highlight property so that will solve your dimming problem.

answered Sep 29 '14 at 04:31

nr5

4,228
8
42
82

This is *absolutely* what you should do. – NRitH Sep 29 '14 at 04:56
The reason I'm not using a `UIButton` is that `UIButton` doesn't support heavy customization: I cannot add subviews to a `UIButton` through interface builder (I can do that in code but in my case I have some image views that need to be added to the button and each of them has auto layout constraints, I would rather work with auto layout in interface builder) – axl411 Sep 29 '14 at 05:08
Perhaps, take a UIView (Add whatever imageviews and set the auto layout props.) > Change its subclass to UIControl > This way your view can respond to all the events (UIControlEventTouchUpInside, UIControlEventTouchDown, etc). In short, your view will act as a button :) – nr5 Sep 29 '14 at 05:13
@114100웃 Good point, this is a new thing I learned today, thanks! – axl411 Sep 29 '14 at 05:21

dfmuir · Accepted Answer · 2014-11-24T02:59:40.633

1

I would think for a while about your reasons for not using a UIButton. If you decide you are doing the right thing then you can "dim" a UIImageView by adding a sublayer.

I would subclass UIImageView and use something like this:

CALayer *downStateLayer = [CALayer layer];
downStateLayer.backgroundColor = [[UIColor grayColor] CGColor];
downStateLayer.opacity = 0.5;
downStateLayer.frame = self.view.frame;
[self.view.layer addSublayer:downStateLayer];

To remove the dim effect:

[downStateLayer removeFromSuperlayer];

There are lots more properties of CALayer that you can use to customize your downstate further.

edited Nov 24 '14 at 02:59

answered Sep 29 '14 at 04:48

dfmuir

2,048
1
17
14

This solves my problem, thanks! The category on `UIImageView` solution mentioned by @danh is quite nice but in my case my images are not in the app bundle, they are downloaded from a server in code, so if I go with that I'll have to manually keep the old records of the original image my self. – axl411 Sep 29 '14 at 05:19

iOS how to manually tweak UIImageView to make it acts like a button?

2 Answers2