I have a UIButton in a circle shape(corner radius=width/2) , and i am trying to center the title of that button , to be in the center of the circle . somehow its not on the center, and i have tried everything ,with no success.
I can see the + sign(its title) a little bit left and up from the center.
With letters its the same-the letter title is not centered :
UIButton *menu = [UIButton buttonWithType:UIButtonTypeCustom];
menu.contentHorizontalAlignment=UIControlContentHorizontalAlignmentCenter;
[menu setTitle:#"M" forState:UIControlStateNormal];
[menu setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
menu.contentHorizontalAlignment=UIControlContentHorizontalAlignmentCenter;
menu.contentVerticalAlignment=UIControlContentVerticalAlignmentCenter ;
menu.frame=CGRectMake(delta, 0, mwidth, mwidth);
menu.layer.cornerRadius=menu.frame.size.width/2.0;
menu.layer.borderWidth=1.0;
Have also tried to set the titleLabel alignment to center without success .
You can try to adopt position of the title by playing with setTitleEdgeInsets method and try with different insets and choose which fits best your customisation
Related
I have to place 6 buttons in the bottom of particular screens like UITabBar. I have placed UIButton with Image and Text but, am not able to move the image on top of the button with centre alignment and place the button text in below of the image with center alignment. It should be look like UITabBarItem.
How can I achieve this in UIButton? Anyone can please help me on this? Thanks.
I tried this code but, text not visible and image not properly aligned. Can you please help me?
[self.languageButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[self.languageButton setTitle:#"Language" forState:UIControlStateNormal];
[self.languageButton.titleLabel setFont:[UIFont boldSystemFontOfSize:10.0]];
UIImage *image = [UIImage imageNamed:#"lang_change_white"];
[self.languageButton setTitleEdgeInsets:UIEdgeInsetsMake(0.0, -image.size.width, -25.0, 0.0)];
[self.languageButton setImage:image forState:UIControlStateNormal];
[self.languageButton setImageEdgeInsets:UIEdgeInsetsMake(-15.0, 0.0, 0.0, -self.languageButton.titleLabel.bounds.size.width)];
Thanks in advance.
your code work fine for me then what is problem ?
plz explein what you want with image and text of the button..?
you have to make 2 special image which contains symbol and text. one image is white image and second one is any color of image . and when user press button set background image as your color image and set initial image as white color image.
I'm developing an iOS app and i have to insert an UIButton.
I want to customize this button and i'd like to have a button like this:
My code is this, but i'm not able to make rounded corners:
_topImagesScrollViewButton = [UIButton buttonWithType:UIButtonTypeCustom];
_topImagesScrollViewButton.frame = CGRectMake(screenWidth/2-25, topBarHeight+paddHeight, 37 , 37);
_topImagesScrollViewButton.backgroundColor = [UIColor colorWithRed:red_middle green:green_middle blue:blue_middle alpha:alpha_middle];
[_topImagesScrollViewButton setTitle:#"Top" forState:UIControlStateNormal];
[_topImagesScrollViewButton setTitleColor:[UIColor colorWithRed:red_text green:green_text blue:blue_text alpha:alpha_text] forState:UIControlStateNormal];forState:UIControlStateNormal];
[_topImagesScrollViewButton addTarget:self action:#selector(topImagesScrollVieButtonTapped) forControlEvents:UIControlEventTouchUpInside];
How can i do?
I would use the above image to set the image of the button, instead of drawing the shape:
[_topImagesScrollViewButton setImage:#"yourimagename.png" forState:UIControlStateNormal];
This is how to make UIView with rounded corners: IOS: create a UIImage or UIImageView with rounded corners
And what about text color... everything seems to be ok. Maybe it doesn't work because you set title color twice for the same state. And the second from the bottom string of your code is excess.
I have a custom UIButton that has some text I am setting on it dynamically.
The problem:
If the text gets too large, it will cover up a white arrow that is on the button's image located on the far right here:
When that text gets too large, that white arrow is covered, which I need to avoid.
Example:
Current code:
[self.filterButton setTitle:#"All" forState:UIControlStateNormal];
self.filterButton.titleLabel.adjustsFontSizeToFitWidth = YES;
self.filterButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;
self.filterButton.contentEdgeInsets = UIEdgeInsetsMake(0, 10, 0, 0);
[self.filterButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
Some approaches I have tried:
Setting the titleText frame to be %0.85 of the buttons frame.
Current code
Tried to code it to where the frame cuts off at a certain point (of the titleText)
Thanks for any guidance
Have you tried setting the titleEdgeInsets rather than the contentEdgeInsets?
So I have a strange issue which could be a bug or me being stupid.
I have a button in a cell. The cell shows the logged in users facebook friends. If they are already a user of the app it shows the button as Play, else it shows Invite Me...
UIButton *playButton = (UIButton *)[cell.contentView viewWithTag:30];
playButton.backgroundColor = [UIColor clearColor];
[playButton setBackgroundImage:[[UIImage imageNamed:#"fbCell_Invite_30h"] resizableImageWithCapInsets:UIEdgeInsetsMake(15, 5, 15, 5)] forState:UIControlStateNormal];
playButton.titleLabel.text = #"Invite me";
if ([self.fbFriendsUsingApp containsObject:[friend valueForKey:#"id"]]) {
playButton.titleLabel.text = #"Play";
}
This all works fine and not an issue. However, when the button text is invite me it shows as this:
In storyboard interface builder the button is setup like this:
What is strange is that if I click the middle arrow <------> to make the width stretch, the title text stops working and they all show 'Play' ???
Try setting the text of the button using
[playButton setTitle:#"Invite Me" forState:UIControlStateNormal];
instead of
playButton.titleLabel.text = #"Invite Me;
I've found that if I don't use the first approach above the changes to the button text don't show up.
You can find the size of the NSString that you are setting as the button label and then resize the button accordingly:
CGSize labelSize = [labelString sizeWithFont:[UIFont systemFontOfSize:12]];
[button setFrame:CGRectMake(10,0,labelSize.width, labelSize.height)];
You will probably want to add a little to the CGSize as padding, but play with it and find the result you desire.
How can I create a UIButton with a background image which is composed by:
A fixed left cap
A fixed right cap
A number of middle images placed one after the other to fill all the available space
like in the example below?
EDIT: I did not realize that in the center there are no N repeated images, but only a streched one. See the accepted answer.
As far as I know it cannot be done. What you can do is stretch an image, but you cannot add n middle images.
The code for adding a stretchable image in between is
//Create an image - Where UIEdgeInsets is in top left bottom right
UIImage* buttonImage = [[UIImage imageNamed:#"button.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 16, 0, 16)];
// Create a custom buttom
UIButton *myButton = [UIButton buttonWithType:UIButtonTypeCustom];
myButton.frame = CGRectMake(0, 0, 100, buttonImage.size.height);
[myButton setBackgroundImage:buttonImage forState:UIControlStateNormal];
[myButton setTitle:#"Button" forState:UIControlStateNormal];
//Add it to view - if it is a view controller self.view
[self addView:myButton];
From Apple's UIImage Class Reference:
"resizableImageWithCapInsets:
You use this method to add cap insets to an image or to change the existing cap insets of an image. [...] During scaling or resizing of the image, areas covered by a cap are not scaled or resized. Instead, the pixel area not covered by the cap in each direction is tiled, left-to-right and top-to-bottom, to resize the image." [emphasis added]
You can read more about it at http://mobiledevelopertips.com/user-interface/ios-5-uiimage-and-resizableimagewithcapinsets.html