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.
Related
I have a UIToolbar in one of my VCs, it has 3 color buttons which changes the color of my drawing. Anyways I want to change the button's image when its selected. The images are shown below, the problem is apparently the button's "tintcolor" is messing with the original image.
If i set the "tintcolor" to red my active button looks like a bigger red circle, if its "clearcolor" it doesn't show. Any help would be much appreciated guys.
UIImage *image = [UIImage imageNamed:#"red-selected"];
[button setImage:image];
I even tried:
UIImage *image = [[UIImage imageNamed:#"red-selected"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
[btn setImage:#"red-selected.png" forState:UIControlStateNormal];
you can also do it in the interface builder - indicates a photo for selected mode.
pay attention the type of the photo- is it png?
try #"red-selected.png"/ #"red-selected.jpg"
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 want to build a UIButton out of 3 images (A,B,C). A and C are stretchable components (depending on the button text) the middle part is fixed.
What is the best way to attach these images to one another? How can I be flexible in the implementation without specifying all origins and widths and so on... Is it necessary to have a surrounding rectangle?
You need to stitch your images together in an image editor to create a single image. Then you'll load this image, and create a resizable version using the UIImage resizableImageWithCapInsets:resizingMode: method. You'll specify UIEdgeInsets that mirror the original widths of your two "end cap" images.
For the button itself you need to make this resizable image the background image of the button. It won't work as a foreground image.
UIImage* bgImage = [[UIImage imageNamed:#"my_bg_image"] resizableImageWithCapInsets: UIEdgeInsetsMake(0, 10, 0, 10)];
UIButton* b = [UIButton buttonWithType: UIButtonTypeCustom];
[b setBackgroundImage: bgImage forState: UIControlStateNormal];
I've had to implement something like this recently.
My strategy was to build what I wanted using UIView objects, and then write the created view to a UIImage.
I'd recommend:-create a container view-create UILabels for the button text, add to container view-for labels A and C, sizeToFit them after they have their text, and then use that information to place the stretchable buttons in the view-once the subviews are positioned, you'll probably want to reset the frame of your container view to make sure it is still correct.
once your view looks the way you want it, write it to an image using:
UIGraphicsBeginImageContextWithOptions(container.frame.size, NO, 0); //or YES if you have no opacity in your images
[container.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
-you can then set this as the image for your UIButton
The best way to do this is to put the 3 images into one file, and use resizableImageWithCapInsets:. See the doco here.
Here's a good tutorial on how to do this.
// Set the button background image
UIImage * buttonImage = [UIImage imageNamed:#"button_resizable.png"];
UIImage * resizableButtonImage = [buttonImage resizableImageWithCapInsets:UIEdgeInsetsMake(0, 12, 0, 12)];
[button setBackgroundImage:resizableButtonImage forState:UIControlStateNormal];
I have the following custom button:
_button = [UIButton buttonWithType:UIButtonTypeCustom];
_button.backgroundColor = [UIColor darkGrayColor];
UIImage *bg = [UIImage imageNamed:#"btn_bg_highlighted.png"];
[_button setBackgroundImage:bg forState:UIControlStateHighlighted];
As expected, the button has a dark gray background. When I press the button, the background image is shown (red square).
Later in the program I'm setting the buttons foreground image, which is transparent (red rectangle). After that the gray background changes to white. When I press the button, it becomes gray.
When I'm setting the image right after [UIButton buttonWithType:UIButtonTypeCustom] it works great.
Do you know what the problem is?
OK, I'm stupid. I'm getting the image from a NSData object. At the server the UIImage is converted to NSData with UIImageJPEGRepresentation(image, quality). But this should be UIImagePNGRepresentation(image), otherwise the transparency gets lost at the client. Now everything works great!
I have run into a strange issue. I have a UIButton with UIButtonTypeCustom.
For it's background image, I am using a transparent image. The issue is that the transparency on the actual image doesn't seem to be correct. The odd thing is that it is in fact transparent, because the background shows correctly behind the button.
Below is an example of what the button looks like (left) and what the button should look like (right). I took a screenshot and overlaid the image on the background in Photoshop, and the background shows correctly inside the image, while in the actual button on the left it does not. Noticeably, the glow is more intense on the left UIButton vs. the actual image when inserted onto the background.
Here's the image I am using to show that it does in fact have transparency:
Here's my code:
UIButton *nextButton = [UIButton buttonWithType:UIButtonTypeCustom];
nextButton.backgroundColor = [UIColor clearColor];
nextButton.frame = CGRectMake(0, 0, 30, 30);
[nextButton setBackgroundImage:[[UIImage imageNamed:#"ButtonBackground.png"] stretchableImageWithLeftCapWidth:5 topCapHeight:5] forState:UIControlStateNormal];
forState:UIControlStateHighlighted];
[self addSubview:nextButton];
I have used the exact same image elsewhere to draw with and had no issue with transparency.
UPDATE: Adding other transparent images similarly increases the intensity of the alpha. While they're transparent, they seem darker and therefore less transparent. Again, works perfect elsewhere.
UPDATE 2: Even worse, I just created a new project with the exact same image dragged from the other project, created a button and had no issues with the button displaying correctly. How incredibly annoying!
You shouldn't have to set the background color for it to be transparent. Also, try removing the stretchable call on the image.
Also, you should be setting the image, not the background image.
If none of that helps, then Apple may just be improperly rendering your image. Try creating a CALayer and set its contents to your image and see if that works properly.
try this
UIButton *nextButton = [UIButton buttonWithType:UIButtonTypeCustom];
nextButton.frame = CGRectMake(0, 0, 30, 30);
nextButton.alpha=0.5f;
[nextButton setBackgroundColor:[UIColor clearColor]];
[nextButton setOpaque:NO];
[nextButton setBackgroundImage:[UIImage imageNamed:#"ButtonBackground.png"]
forState:UIControlStateNormal];