Search code examples
iosswiftuiimageviewuitapgesturerecognizer

Tap gesture on multiple imageview inside scrollview not firing event , only first imageview tap gesture working?


Scenario is I have imageview which I have added inside a scrollview and then tapgesture added on each imageview but only first one imageview firing event .

Have tried following :

1. Created Extension of imageview

extension UIImageView {
  public func openMenu() {
    let tapGestureRecognizer = UITapGestureRecognizer(target:self, action:Selector("handleTapGesture:"))
    //mImg.addGestureRecognizer()
    self.addGestureRecognizer(tapGestureRecognizer)
    print("open")
  }
}

2. Added tap gesture in the loop (the way imageview are added on scrollview same way tapgesture added )

//the loop go till all images will load
for var index = 0; index < imagesName.count; index++ {
  let mImg: UIImageView = UIImageView()          
  let pDict = homePageProductArr[index] as NSDictionary

  //Create a UIVIEW 
  let containerView:UIView = UIView(frame: CGRect(x: 0, y: 0, width: 80, height: 100))
  let nameLabel:UILabel = UILabel(frame:CGRect(x: xOffset+20, y: 85, width: 100, height: 20))
  nameLabel.text = (pDict.objectForKey("CategoryName") as! String)
  nameLabel.font = UIFont(name: "Helvetica Neue", size: 10.0)
  containerView.addSubview(nameLabel)

  let tapMenuCategoryImageTGR = UITapGestureRecognizer(target: self, action: Selector("handleTapGesture:"))
  containerView.addGestureRecognizer(tapMenuCategoryImageTGR)

  // make the imageview object because in scrollview we need image
  mImg.frame = CGRectMake(5 + xOffset, 0, 80, 80)
  // the offset represent the values, used so that topleft for each image will
  // change with(5+xOffset, 0)and the bottomright(160, 110)
  //mImg.image = UIImage(named: imagesName[index])
  mImg.imageFromUrl(imagesName[index])
  //mImg.imageFromServerURL(imagesName[index])
  //Creating Circular Image
  //mImg.layer.borderWidth = 1
  mImg.layer.masksToBounds = true
  mImg.layer.borderColor = UIColor.whiteColor().CGColor
  mImg.layer.cornerRadius = mImg.frame.height/2
  mImg.clipsToBounds = false
  mImg.openMenu()
  mImg.userInteractionEnabled = true
  mImg.addGestureRecognizer = tapMenuCategoryImageTGR

  // The image will put on the img object
  images.insert(mImg, atIndex: index)
  //Put the img object at the images array which is mutable array
  scrollview.contentSize = CGSizeMake(120 + xOffset, 110)
  //scroll view size show after 125 width the scroll view enabled 
  scrollview.addSubview(images[index] as! UIView)
  //set images on scroll view
  xOffset += 100
}

Kindly share your suggestions on it .


Solution

  • Finally solved by adding button on imageview , and making it background color clear and title to "":

    Here is Code Snippet :

     //print(mDict.objectForKey("ImageURL"))
        //var scrollWidth: Int = 120
        scrollview.contentSize = CGSizeMake(120.0, 80.0)
        var xOffset: CGFloat = 5
        //the loop go till all images will load
        for index in 0 ..< imagesName.count {
    
            let mImg: UIImageView = UIImageView()
            //set placeholder image
            mImg.image = UIImage(named: "lazyload_icon.png")
            let pDict = homePageProductArr[index] as NSDictionary
    
            //Create a UIVIEW 
            let containerView:UIView = UIView(frame: CGRect(x: 0, y: 0, width: 80, height: 120))
            let nameLabel:UILabel    = UILabel(frame:CGRect(x: xOffset+20, y: 95, width: 100, height: 20))
            nameLabel.text = (pDict.objectForKey("CategoryName") as! String)
            nameLabel.font = UIFont(name: "Helvetica Neue", size: Constant().HomeLabelFontSize)
            nameLabel.textColor = UIColor.colorWithHexString(Constant().HomeLabelHexColorCode)
            //set line and wrap text
            nameLabel.numberOfLines = 0
            nameLabel.sizeToFit()
            containerView.addSubview(nameLabel)
            containerView.userInteractionEnabled = false
    
            // make the imageview object because in scrollview we need image
            mImg.frame = CGRectMake(xOffset , 0, 90, 90)
            // the offset represent the values, used so that topleft for each image will
            // change with(5+xOffset, 0)and the bottomright(160, 110)
            //mImg.image = UIImage(named: imagesName[index])
            mImg.imageFromUrl(imagesName[index])
            //mImg.imageFromServerURL(imagesName[index])
            //Creating Circular Image
            mImg.layer.masksToBounds = true
            mImg.layer.borderColor = UIColor.whiteColor().CGColor
            mImg.layer.cornerRadius = mImg.frame.height/2
            mImg.clipsToBounds = false
            mImg.userInteractionEnabled = false
    
    
            // The image will put on the img object
            images.insert(mImg, atIndex: index)
            // Put the img object at the images array which is mutable array
            scrollview.contentSize = CGSizeMake(120 + xOffset, 110)
            //scroll view size show after 125 width the scroll view enabled
            containerView.addSubview(images[index] as! UIView)
            scrollview.addSubview(containerView)//images[index] as! UIView)
            // set images on scroll view
            xOffset += 100
    
            //Adding button to fire event
            let touchButton:UIButton = UIButton()
            touchButton.frame = mImg.frame
            touchButton.backgroundColor = UIColor.clearColor()
            touchButton.tag = index
            touchButton.addTarget(self, action: Selector("touchCategoryAction:"), forControlEvents: UIControlEvents.TouchUpInside)
            touchButton.setTitle("", forState: UIControlState.Normal)
            scrollview.addSubview(touchButton)
            scrollview.bringSubviewToFront(touchButton)