使用bgcolor制作透明图像按钮 [英] Making a Transparent image button with bgcolor

问题描述

我有一张想要变成按钮的透明图像(下面是"hold_empty.png").在按钮内将有一个带有彩色背景的视图，该背景的大小比实际图像要小一些，以保持背景颜色.

I have a transparent image which ("hold_empty.png", below) which I want to turn into a button. Inside the button there will be a view with a colored background which is slightly smaller size than the actual image to hold the background color.

其原因是因为图像具有圆角，所以我不能简单地在图像上放置背景色，因为它看起来会比图像大.

The reason for this is because the image has rounded corners and so I cannot simply put a background color on the image as it will appear to be bigger than the image.

图像是带有圆角"的透明正方形.我尝试创建的效果应该类似于图层.

The image is a transparent square with "rounded corners". The effect I am trying to create should be like layers.

1. 背景色层(红色，绿色等)
2. "hold_empty.png"图片(上方)
3. 整个对象(包括bg颜色层)应该是可单击的.

我遇到的问题是只有图像(及其边框)似乎是可单击的，而不是整个对象.

The problem I am experiencing is that only the image (and its borders) appears to be clickable, and not the whole object.

代码如下.

// x,y,w,h
CGRect frame = CGRectMake(10, 10, 72, 72);
CGRect frame2 = CGRectMake(5, 5, 60, 60); // I know this is not filling the image, its just a test

UIView *bgColorView = [[UIView alloc] initWithFrame:frame2];
[bgColorView setFrame:frame2];
bgColorView.backgroundColor = [UIColor redColor];

UIImage *image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"hold_empty" ofType:@"png"]];

UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
[btn addSubview:bgColorView];
[btn setImage:image  forState:UIControlStateNormal];
btn.frame = frame;
[btn addTarget:self action:@selector(btnSelectColor:) forControlEvents:UIControlEventTouchUpInside];


[self.view addSubview:btn];
[bgColorView release];

因此，总结一下:如何制作具有可点击背景色的透明图像按钮?

So, to summarize: How do I make a transparent image button with a background color clickable?

谢谢.

推荐答案

我现在已经破解了.我遇到的问题之一是它无法与化身一起使用(有时它会出现在图层后面，有时甚至根本不显示).

I've cracked it now. One of the problems I was having was that it was not working with avatars (sometimes it would appear behind the layer, othertimes it would not show at all).

这是我的解决方法.

UIImage *image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"some_avatar" ofType:@"png"]];
    UIImageView *imgView = [[UIImageView alloc] initWithImage:image];

    CGRect fullFrame = CGRectMake(25, 10, 70,72);   
    CGRect frame = CGRectMake(28, 13, 63,65);

    UIButton *h=[UIButton buttonWithType:UIButtonTypeCustom];
    [h setFrame:fullFrame];
    [[h layer] setMasksToBounds:YES];
    //[h setBackgroundImage:image forState:UIControlStateNormal];
    //[h setImage:image forState:UIControlStateNormal];
    [h setShowsTouchWhenHighlighted:YES];
    [h setClipsToBounds:YES];
    CAGradientLayer *gradientLayer = [[CAGradientLayer alloc] init];
    [gradientLayer setBounds:frame];
    [gradientLayer setPosition:CGPointMake([h bounds].size.width/2, [h bounds].size.height/2)];
    [gradientLayer setColors:[NSArray arrayWithObjects:
                              (id)[[UIColor darkGrayColor]CGColor],(id)[[UIColor blackColor] CGColor], nil]];
    [[h layer] insertSublayer:gradientLayer atIndex:0];
    [h insertSubview:imgView atIndex:1];
    [h addTarget:self action:@selector(btnSelectColor:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:h];
    [imgView release];

这篇关于使用bgcolor制作透明图像按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！