I am using the following code to resize the buttons in my appplication
+(void) processButton:(UIButton*) button buttonType:(NSString*)buttonType {
ENDebug(#"Process button %#" ,[button restorationIdentifier]);
[button setTranslatesAutoresizingMaskIntoConstraints:true];
CGRect rect = [button frame];
float startx = rect.origin.x;
float midx = startx +rect.size.width/2;
float starty = rect.origin.y;
float midy = starty +rect.size.height/2;
if ([buttonType isEqualToString:BUTTON_IPAD_SMALL]||[buttonType isEqualToString:BUTTON_IPHONE_SMALL]) {
rect.size.width = BUTTON_WIDTH_SMALL;
rect.size.height = BUTTON_HEIGHT_SMALL;
} else {
rect.size.width = BUTTON_WIDTH_LARGE;
rect.size.height = BUTTON_HEIGHT_LARGE;
}
rect.origin.x = midx - rect.size.width/2;
rect.origin.y = midy-rect.size.height/2;
button.titleLabel.font = GillSansBold(BUTTON_TITLE_SIZE);
[button setFrame:rect];
}
Using this I am able to resize the code.. but am not able to increase the tap size of the buttons.. Looks like only the view has expanded without the button becoming clickable in entirety.
Check the edge insets of the button. An inset is a margin around the drawing rectangle. Or you cant just try:
button.contentEdgeInsets = UIEdgeInsetsMake(0, 0, 0, 0);
after setting the button's frame.
Related
I call this function at viewDidLoad and didRotateFromInterfaceOrientation
-(void) makeBox{
[self.view1 removeFromSuperview];
float viewWidth = CGRectGetWidth(self.view.frame);
float viewHeight = CGRectGetHeight(self.view.frame);
float startx = (viewWidth / 100) * 10;
float starty = (viewHeight /100) * 20;
float width = (viewWidth / 100) * 80;
float height = (viewHeight /100) * 60;
CGRect frame1 = CGRectMake(startx, starty, width, height);
self.view1 = [[UIView alloc] initWithFrame:frame1];
[self.view1 setBackgroundColor:[UIColor redColor]];
[self.view addSubview:self.view1];
}
When the view does change, its very 'sketchy' & not very graceful at all. I'm using simulator but i assume that it would be the same if i were to run on a device. How would i go about making this transition smoother? I would post to user experiance page, but i wish todo this programmatically
The overall point of this, other than to learn, is to achieve orientation independent graphics from code (without autolayout).
There's no need to remove the view and create a new one with the desired frame if its the only thing you're changing. Just modify the view frame in-place:
- (void)makeBox {
CGFloat viewWidth = CGRectGetWidth(self.view.frame);
CGFloat viewHeight = CGRectGetHeight(self.view.frame);
CGFloat startx = (viewWidth / 100) * 10;
CGFloat starty = (viewHeight /100) * 20;
CGFloat width = (viewWidth / 100) * 80;
CGFloat height = (viewHeight /100) * 60;
CGRect view1Frame = CGRectMake(startx, starty, width, height);
if (!self.view1) {
// The view doesn't exists yet, we create it
self.view1 = [[UIView alloc] initWithFrame:view1Frame];
[self.view1 setBackgroundColor:[UIColor redColor]];
[self.view addSubview:self.view1];
}
else {
// Just update the frame
self.view1.frame = view1Frame;
}
}
For extra-nice UX, wrap the frame update in an animation block:
// ... snip ...
else {
[UIView animateWithDuration:0.3 animations:^() {
self.view1.frame = view1Frame;
}];
}
I'm trying to change the position of a UILabel contained inside a custom UITableViewCell, but it doesn't move. I have auto layout enabled.
- (void)updateLayout
{
NSArray* comp = [self.accessibilityHint componentsSeparatedByString:#"/"];
if (comp.count > 1)
{
CGRect rect = _imageViewT.frame;
rect.origin.x = 20 * comp.count;
rect.size.width = 44.0;
[_imageViewT setFrame:rect];
[_imageConstraint setConstant:_imageViewT.frame.origin.x-8];
rect = _lableT.frame;
rect.origin.x = _imageViewT.frame.size.width+_imageViewT.frame.origin.x+8;
rect.size.width = self.frame.size.width-rect.origin.x-40;
[_lableT setFrame:rect];
//[_imageConstraint setConstant:_imageViewT.frame.origin.x-8];
}
else
{
CGRect rect = _imageViewT.frame;
rect.origin.x = 10;
rect.size.width = 43.0;
[_imageViewT setFrame:rect];
[_imageConstraint setConstant:2];
rect = _lableT.frame;
rect.origin.x = 62;
rect.size.width = self.frame.size.width-rect.origin.x-40;
[_lableT setFrame:rect];
}
}
I am calling update method from cellForRowAtIndexPath.
self.accessibilityHint contain string like aa/bb/cc, aa/cc
UITableViewCell will layout subviews in layoutSubviews: after cellForRowAtIndexPath:, so your layout will be reset in cell's layoutSubviews.
You should move your layout code from cellForRowAtIndexPath: to cell's layoutSubviews.
Set label's autoresizingMask property, i always use it with cell's subviews.
I custom a uitableviewcell with nib, and want to custom the highlighted style. When the cell highlighted, I want to reduce the size of the subview of the cell and keep the position of the imageview in the cell not changing. So, it looks like the frame of a imageview zoomed out, but the image itself stay there not changing its position.
However, this code snippet doesn't work as I wanted.Could anybody help me to figure out where I am wrong. Any help will be appreciated!
tips: the imageview is a subview of self.frameView and frameView is a subview of frameBgView.
- (void)setHighlighted:(BOOL)highlighted animated:(BOOL)animated
{
if (highlighted)
{
self.frameView.backgroundColor = UIColorFromRGBA(0, 0, 0, 0.1);
CGRect rect = self.frameBgView.frame;
rect.origin.x += 10;
rect.size.width -= 20;
self.frameBgView.frame = rect;
rect = self.frameView.frame;
rect.origin.x -= 10;
self.frameView.frame = rect;
}
else
{
....
}
}
EDIT: some screenshots to explain the question:
oky i tried your solution but i got like this i am posting the code as well as the output how it looks, if there is any problem just comment , i am deleted the frameBgView it is not required
code
- (void)setHighlighted:(BOOL)highlighted animated:(BOOL)animated
{
if (highlighted)
{
self.frameView.backgroundColor = [UIColor grayColor];
CGRect rect = self.contentView.bounds;
rect.origin.x += 15;
rect.size.width -= 30;
//rect = self.frameView.frame;
// rect.origin.x -= 10;
self.frameView.frame = rect;
}
else
{
self.frameView.backgroundColor = [UIColor whiteColor];
CGRect rect = self.contentView.bounds;
rect.origin.x += 10;
rect.size.width -= 20;
self.frameView.frame = rect;
}
}
and i am not using auto layout .. the result what i got is, before
and after highlighted,
EDIT:
this is the cell structure
as u can see in the picture, in content view i hav added frameView which is blue in colour, and within frameView i hav added imageView and also don't forget t set content mode scale to fill and also auto resizing masks for both frameView and imageView for example
autoresizing masks for content view
autoresizing masks for frameView
autoresizing masks for imageView
END EDIT
I'm working on an iPad app and part of the UI is a scrollview that has buttons for its contents. I'm working on adding images to these buttons, but when I do so, I only ever get the image in one spot, when I should be seeing it on all the buttons. This is what I'm doing:
float scrollCurrTop = 0;
CGRect currProcedureButtonFrame = CGRectMake(0,
scrollCurrTop,
self.fProceduresView.frame.size.width,
self.fLabelAndButtonHeight);
PatientIDButton* currProcedureButton = [PatientIDButton buttonWithType:UIButtonTypeCustom];
[currProcedureButton setFrame:currProcedureButtonFrame];
[currProcedureButton.layer setBorderColor: [self.fPanelViewBorderColor CGColor]];
[currProcedureButton.layer setBorderWidth: self.fBorderWidth];
currProcedureButton.titleLabel.font = self.fLabelFont;
NSString* displayName = [grabbing name];
if (displayName == nil)
{
displayName = currPlanName;
}
[currProcedureButton setTitle:displayName
forState:UIControlStateNormal];
[currProcedureButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
currProcedureButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;
currProcedureButton.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
// is the plan approved?
if ([self isPlanApproved:currPlanName])
{
// add the checkmark to this plan button
CGRect currPlanButtonFrame = currProcedureButton.frame;
float originX = currPlanButtonFrame.size.width - (currPlanButtonFrame.size.width/3.0f);
float originY = currPlanButtonFrame.origin.y;
float width = currPlanButtonFrame.size.width - originX;
float height = currPlanButtonFrame.size.height;
CGRect currPlanApprovalImageFrame = CGRectMake(originX, originY, width, height);
UIImageView* currPlanApprovalImage = [[UIImageView alloc] initWithFrame:currPlanApprovalImageFrame];
[currPlanApprovalImage setBackgroundColor:[UIColor colorWithRed:(63.0f/255.0f)
green:(179.0f/255.0f)
blue:(79.0f/255.0f)
alpha:1.0f]];
[currPlanApprovalImage setImage:self.fCheckMarkIcon];
[currProcedureButton addSubview:currPlanApprovalImage];
}
[self.fProceduresView addSubview:currProcedureButton];
scrollCurrTop += self.fLabelAndButtonHeight;
Where 'fProceduresView' is the scrollview that houses the buttons. What am I doing wrong?
It seems that you're misunderstanding the logic behing setting the frame of the imageview's those you're trying to add
CGRect currPlanButtonFrame = currProcedureButton.frame;
float originX = currPlanButtonFrame.size.width - (currPlanButtonFrame.size.width/3.0f);
float originY = currPlanButtonFrame.origin.y;
float width = currPlanButtonFrame.size.width - originX;
float height = currPlanButtonFrame.size.height;
CGRect currPlanApprovalImageFrame = CGRectMake(originX, originY, width, height);
UIImageView* currPlanApprovalImage = [[UIImageView alloc] initWithFrame:currPlanApprovalImageFrame];
You don't need to set originY to currPlanButtonFrame.origin.y;
All subviews have relative coordinates to their's superviews.
So in your case originY should be 0
For example:
// Image is visible
Button frame [0, 0, 100, 100]
image in button [0, 0, 100, 100]
// Button is visible, but image is not because it will be clipped by bounds of the button.
Button frame [100, 100, 100, 100]
image in button [100, 100, 100, 100]
Also you will be able to "see" your images, if you set
currProcedureButton.clipsToBounds = NO
Is there an equivalent padding for UIButton, just like in CSS?.
I seem to have a problem with small buttons so I want to expand the button size for it to be easily clickable.
I made a work around code to resize a UIButton and have the contents remain as they are supposed to be:
- (void)adjustButtonView:(UIButton *)button toSize:(CGSize)size
{
CGRect previousFrame = button.frame;
CGRect newFrame = button.frame;
newFrame.size = size;
CGFloat adjustX = (size.width - previousFrame.size.width)/2;
CGFloat adjustY = (size.height - previousFrame.size.height)/2;
newFrame.origin.x = previousFrame.origin.x - adjustX;
newFrame.origin.y = previousFrame.origin.y - adjustY;
button.frame = newFrame;
UIEdgeInsets edgeInsets = UIEdgeInsetsMake(adjustY, adjustX, adjustY, adjustX);
button.contentEdgeInsets = edgeInsets;
}
I'm just wondering if there is an easier way to expand the UIButtons.
I don't think there's an easier way than what you did. But we can make your code better by moving the method to a UIButton category.
UIButton+Resize.h
#interface UIButton (Resize)
- (void)adjustToSize:(CGSize)size;
#end
UIButton+Resize.m
#implementation UIButton (Resize)
- (void)adjustToSize:(CGSize)size
{
CGRect previousFrame = self.frame;
CGRect newFrame = self.frame;
newFrame.size = size;
CGFloat adjustX = (size.width - previousFrame.size.width)/2;
CGFloat adjustY = (size.height - previousFrame.size.height)/2;
newFrame.origin.x = previousFrame.origin.x - adjustX;
newFrame.origin.y = previousFrame.origin.y - adjustY;
self.frame = newFrame;
UIEdgeInsets edgeInsets = UIEdgeInsetsMake(adjustY, adjustX, adjustY, adjustX);
self.contentEdgeInsets = edgeInsets;
}
#end
Well actually, there is one stupidly simplistic way to expand the width of UIButtons if you don't want to mess with subclassing.... try this:
[b setTitle:[NSString stringWithFormat:#" %# ", #"Title"] forState:UIControlStateNormal];
No, there's nothing like CSS or style sheets for iOS, if you want to resize a button you'll have to do it manually setting the frame.
In order to automatize this task, you can create a button and subclass it, or use categories.