如何在UIImageView上制作可點擊的UIButton？

Question

我想創建一個UIButton來顯示在UIImageView上 。 我的代碼段如下所示：

imageView = [[UIImageView alloc] initWithImage:image]; //initWithImage:image

imageView.userInteractionEnabled = YES; //to enable touch interaction with image



UIButton *btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[btn setTitle:@"ClickMe" forState:UIControlStateNormal];
[btn.titleLabel setFont:[UIFont systemFontOfSize:16]];


 btn.frame = CGRectMake(340, 550, 70, 50);

[btn addTarget:self action:@selector(onClickHotSpotButton)   forControlEvents:UIControlEventTouchUpInside]; //it wasnt working


[imageView addSubview:btn];
[self addSubview:imageView]; 

我的應用程序在我想要的圖像的一部分上顯示按鈕，但它不響應點擊圖像。 相反，它確實檢測到單擊，因為它在檢測時記錄輸出。 但我希望這個按鈕被點擊選擇並執行一些功能。

提前致謝。

wahib

Answer 1

我試過這個，它對我有用.......

UIImageView * imageView = [[UIImageView alloc]init];
[imageView setImage:[UIImage imageNamed:@"image.jpeg"]];
[imageView setFrame:CGRectMake(10,10,300,300)];
[imageView setContentMode:UIViewContentModeScaleToFill];
[imageView setUserInteractionEnabled:TRUE];

UIButton * ButtonOnImageView = [[UIButton alloc]init];
[ButtonOnImageView setFrame:CGRectMake(135,120,60,30)];
[ButtonOnImageView setImage:[UIImage imageNamed:@"image.jpeg"] forState:UIControlStateHighlighted];
 [ButtonOnImageView setImage:[UIImage imageNamed:@"image2.jpeg"] forState:UIControlStateNormal];
[ButtonOnImageView addTarget:self action:@selector(OnClickOfTheButton) forControlEvents:UIControlEventTouchUpInside];

 [imageView addSubview:ButtonOnImageView];
 [self.view addSubview:imageView];

Answer 2

1. 你必須添加定義按鈕作為custom.It將為你工作。

   UIButton * Button = [UIButton buttonWithType：UIButtonTypeCustom];

Answer 3

您只需使用一個按鈕即可：

[UIButton setImage:[imageNamed:@"image.png"]];

Answer 4

你需要添加按鈕作為a的子類

滾動視圖

不

ImageView的

..如果按鈕是uiimageview的子類，它將無法點擊..為每個按鈕分配一個特殊標簽以識別單擊的按鈕

希望這可以幫助

Answer 5

嘗試設置啟用按鈕的用戶交互。

[btn setEnabled:YES];

因為UIImageView將默認設置禁用按鈕的用戶交互。

否則你可以試試這個。只需改變最后兩行。

更換：

[imageView addSubview:btn];
[self addSubview:imageView]; 

有了這個：

[self addSubview:imageView];
[self addSubview:btn];

確保首先添加imageview，然后按照我提到的那樣添加第二個按鈕。 否則按鈕會放在imageview后面，似乎是隱藏的。

Answer 6

如果它是可點擊的圖像，我更喜歡圖像超過按鈕。

UIButton *sampleButton = [UIButton buttonWithType:UIButtonTypeCustom];
[sampleButton setFrame:CGRectMake(kLeftMargin, 10, self.view.bounds.size.width - kLeftMargin -      kRightMargin, 52)];
[sampleButton setTitle:@"Button Title" forState:UIControlStateNormal];
[sampleButton setFont:[UIFont boldSystemFontOfSize:20]];
[sampleButton setBackgroundImage:[[UIImage imageNamed:@"redButton.png"] stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0] forState:UIControlStateNormal];
[sampleButton addTarget:self action:@selector(buttonPressed) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:sampleButton];

Answer 7

我在我的一個應用程序中做了類似的事情。 我創建了一個包含一系列圖像的xib文件，每個圖像都有一個從頂部繪制的按鈕。 我將它們連接到類文件中的相應插座。 然后我解決了在touchesBegan點擊使用：

if(CGRectContainsPoint(btnFirstButton.frame, touchLocation)){
    //do something useful
}else if(CGRectContainsPoint(btnSecondButton.frame, touchLocation)){
    //do something useful
}

希望有所幫助 - 為我工作:-)

Answer 8

我能夠在UIImageVIew上顯示UIButton，這是更新代碼。 我已經提到了最近的問題。

imageView = [[UIImageView alloc] initWithImage:image]; //initWithImage:image

//imageView.tag = i; // tag our images for later use when we place them in serial form
[imageView setContentMode:UIViewContentModeScaleToFill]; //though it has no impact
imageView.userInteractionEnabled = YES; //to enable touch interaction with image

[self addSubview:imageView];

UIButton *btn = [[UIButton buttonWithType:UIButtonTypeContactAdd] retain]; //Plus icon button

btn.frame = CGRectMake(215, 550, 100, 100);
[btn addTarget:self action:@selector(onClickHotSpotButton) forControlEvents:UIControlEventTouchUpInside]; //it wasnt working

**[self addSubview:btn]; //Buttons are clickable but shows button on all images**

//[imageView addSubview:btn]; //Buttons are not clickable and are shown on all images

我現在有兩個選擇。 我是否將我的按鈕設為ImageView或ScrollView的子視圖，它是ImageView的父級。 如果我像[self addSubView：btn]那樣制作Scrollview的按鈕子視圖; 它顯示在正確的位置並且是可點擊的但問題是它是在隊列中的所有圖像上創建的，因為我將它作為父視圖的子視圖，即scrollview。 否則，如果我將其視為子視圖的子視圖，即ImageView，它對於每個圖像都是唯一的，但仍然顯示在所有圖像上且不可點擊：/

any1可以指導我如何使其可點擊並保持動態按鈕和圖像之間的鏈接唯一，以便我在隊列中的每個圖像上的不同位置具有不同的按鈕。