I am attempting to increase the hit area of my UIButton. I have a new Xcode project with a UIButton in the center of the storyboard. The button is connected to my view controller with an outlet and action. I'm programmatically able to change the button title and just for fun made it's action change the background of the view when I tap the button. So I know everything is connected and works.
From what I've read online, this should work but it's not.
[button setFrame: CGRectMake(button.frame.origin.x, button.frame.origin.y, -64, -64)];
Any thoughts? I've tried without the negative margins and that doesn't work either. BTW, I have tried the many places this question is asked but it's not working. Thank you for your help. Also, I've heard subclassing UIButton could create an issue, any thoughts on that?
Update:
The UIButton I want to make has a background color and is a specific size. I want to keep that size the same but increase the hit area around it without distorting the look of the button.
i think you just want to use the same button for restricting the background color or back ground image to the same area and increase the touch area?
as per my knowledge you cannot do that in interface builder. But thru coding you can by using layers.
take outlet of the button
CALayer *buttonlayer=[CALayer layer];
buttonlayer.frame=CGRectMake(50 , 50, 50, 50); // set the frame where you want to see the background color or background image to be visible in your button
buttonlayer.backgroundColor=[[UIColor colorWithPatternImage:[UIImage imageNamed:#"yourimage.png"] ] CGColor]; // if u want image (but remember the image size must same as your layer frame it may look bad if the image bounds does not mach your layer bounds, because you are setting color not image)
// to set color (donot use if you want image, use colorWithPatternImage to set image color)
buttonlayer.backgroundColor=[[UIColor graycolor] CGColor]; // if you want only color
// you can add round rects to the button layer
buttonlayer.cornerRadius=2.5f;
[yourbutton.layer addSublayer:buttonlayer];
i am not sure what you are looking for i hope this help you but check the image once
To increase the hit area without distorting the background color or image, it would probably be easiest just to separate them. Have a clear UIButton, with no background color, above a UIView (or UIImage, etc) that provides the visuals. That way, you can do whatever you want to the frame of the UIButton, and it won't affect the visuals unless you apply the same transformations to the other UIView.
As for why that line of code doesn't work, the third and fourth elements in CGRectMake aren't margins, they're dimensions: you can't have a negative height and width. Put in the ultimate size you want it to be, not the change or the margins, (i.e. if you want to shrink a width of 100 by 20, input 80).
Subclass UIButton and implement the backgroundRectForBounds method.
Expand the frame to your desired touch area size, then shrink the bounds of the background by adding insets.
- (CGRect)backgroundRectForBounds:(CGRect)bounds {
return CGRectInset(bounds, -50, -50);
}
More info here:
https://developer.apple.com/library/ios/documentation/uikit/reference/uibutton_class/index.html#//apple_ref/occ/instm/UIButton/backgroundRectForBounds:
Related
well am trying to make this UI :
the above UI contains a ProgressView on UITableViewCell and the vertical line is a UIView (if i should use something else then a UIView for this vertical line then please do provide your suggestions ) well am stuck in moving this vertical line ? how can i place this line at the point where the bar is filled as shown in the image , if anybody knows then please let me it'll be so helpful for me
the pseudocode for what i need will be like
verticleLine.xAxisPostion = progressBar.progress.xAxis
Trying to think out of the box here: maybe you could use a UISlider instead with userInteractionEnabled set to false? With UISlider you can specify not only the track color, but also the thumb image (being a tiny plain grey vertical bar in your case).
To expand a little bit: you set the minimumTrackTintColor to green, the maximumTrackTintColor to red (or stretchable images for minimum/maximumTrackImage), minimumValue to 0, maximumValue to 1. Instead of progress you can now use value — and it should give you roughly the same behaviour with the thumb (grey bar) following the value.
the above UI contains a ProgressView
Don't use a UIProgressView. Just create your own self-drawing view that looks exactly the way you want it to. The view that you've designed — green to the left of the progress point, red to the right of the progress point, and a vertical line right at the progress point — is trivial to draw, and trivial to redraw when progress happens (i.e. when the value changes).
Sorry I'm not sure if I have the terminology correct but I'd like to see the borders of the controls I use in Xcode as I work with them on my storyboard.
For example, I have a UITextView but I'm unable to see how much space it takes up until I click it.
I'm convinced there's an option for it and a google hasn't turned up anything, probably because I'm searching for the wrong thing!
Thanks in advance.
In Xcode, Editor > Canvas > Show Layout Rectangles will draw a red rectangle around each view, and the baseline for views where that makes sense.
You can see the bounds of any view in the screen using this code:
view.layer.borderColor = [UIColor redColor].CGColor;
view.layer.borderWidth = 1.f;
Look you can use this for ANY view you want. Also, you can change the color and border size if you need.
If you can't see the bounds, check out if your view hasn't ambiguously layout or if the frame has defined correctly.
If you do not want to use code to do this you can go into the Interface Builder and click on the desired object and in the Attribute Inspector set the background to any color. This will not give you a border, but rather a filled rectangle over the whole area of the object which will allow you to see the objects bounds.
I have a very specific requirement to fulfil.
Lets say this is my original background image (on the right).
This is how my image should be on the screen by default.
And this is how it should be when I do a "pull down" gesture on the UITableView.
I want to set an image (shown above) as a view's background. A UITableView to be specific.
NOTE: Image size is more than the view size.
When I try to pull down the view beyond the bounds of the view, the image should continue to show up and should not break. With the current implementation the image from the bottom part shows up.
Any ideas how I can achieve this? Pardon me if the solution is obvious.
You can do this by only one line of code
[yourView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:#"YourBGImgName.png"]]];
OR Alternately
put one UIScrollView and set it's background color with above way and you can find your background repeating when you scrolling your scrollView.
Set the top part as the background for a UITableViewHeaderFooterView in the header and do the same for the footer. Then set a negative inset for your tableView.
Something like
[self.tableView setContentInset:(UIEdgeInsets){-headerHeight, 0, -footerHeight, 0}];
May be the question is elementary, but I have a bug with setBackgroundColor.
I have the UIView which contain UITableView. UITableView is clearColored. I'm trying to set background on UIView:
[self.viewForTable setBackgroundColor: [UIColor colorWithPatternImage:[UIImage imageNamed:#"bgIngrList.png"]]];
On normal iPad it's looks like:
But on retina iPad (like the second image began showing):
I have two images "bgIngrList.png" and "bgIngrList#2x.png" with 290x260 and 580x520.
Where can be the bug?
EDIT
I have solved the problem by using UIImageView instead of UIView.
Thanks to everybody!!!
colorWithPatternImage: (as the name suggests) thinks your image as pattern to fill. so if the image you give is smaller than the size of the view, its gonna draw the pattern image again rather than stretching it. that is what happening here. your image's size is smaller than view's size hence its drawing the image again at the bottom. You can avoid this by adding a UIImageView and setting the image property rather than setting the backgroundColor of UIView.
I'm having trouble figuring out how much I can adjust the imageView property of a UIButton. In the docs, it says:
Although this property is read-only, its own properties are read/write. Use these properties to configure the appearance and behavior of the button’s view.
I'm hoping to perform a transition where I shrink the size of the button in an animation, and I'd like the button's image to also shrink accordingly. However, I find that I have no control over the size of that image. If I modify either the frame or the bounds of UIButton's imageView property, nothing seems to happen. The image seems to want to retain it's standard dimensions. Changing autolayout properties on the imageView or contentMode properties on the button don't seem to help either.
In fact, the only thing that seems to work at all is to use UIEdgeInsetsMake to "squish" the image from all sides, but that isn't animatable.
I'd prefer not to use the backgroundImage property either, since I'm already using that to style the button in the first place.
You could add an own UIImageView as subview to the UIButton instead of using the "embedded" imageView.
You can set the frame of "your" image view as usually relative to the surrounding UIButton. You will have full control on it's position and you will also be able to animate it.