iOS 5 UIButton title showing with ellipsis - iphone

I have a problem regarding the UIButton title in iOS5. They are clipped and show like in this photo. I don't want them to be clipped, i want to show the full title.
In iOS6, they work perfectly.
Please tell me how can i resolve this?

you simply need to increase the width of your UIButton to show full Title, i have posted sample snippet for better idea, try it. You just need to increase the width of button.
UIButton *btn1 = [UIButton buttonWithType:UIButtonTypeCustom];
[btn1 setFrame:CGRectMake(20, 200, 150, 25)];
[btn1 setTitle:#"This is Long Title" forState:UIControlStateNormal];
[self.view addSubview:btn1];

Guys i have found the solution.
It was pretty simple, you just need to set the button font size in the interface builder to a larger or the same font size than that of the UIapperance font proxy.

I think AutoLayout may be the culprit for this. Check to see if your constraints aren't forcing the label to shrink.

I assume that you are setting your custom font from the code but you are setting the text for the buttons from the IB. So my simple explanation is that as #MichaelScaria said, your custom font is larger. The text is clipping because the size of the label inside the button is adjusted for the current font and size. Since you are changing the font and size after the text is set you need to re-set the title of the button or call 'sizeToFit' on that button.

For those of you here due to ellipsis and use of UIBarButtonItem know that there is a possibleTitles property on UIBarButtonItem with docs that read:
Use this property to provide a hint to the system on how to correctly size the bar button item to be wide enough to accommodate your widest title. Set the value of this property to an NSSet object containing all the titles you intend as possible titles for the bar button item. Use the actual text strings you intend to display.
This property applies to bar button items placed on navigation bars or toolbars.

Related

How to create a gray overlay for a UIButton in touched state programmatically?

I would like to make a generic class that when tapped, makes the element grayish.
Facebook's app is the perfect example of what I want to achieve. All their links and images become gray when tapped.
I can only guess that they are subclassing UIButton.
I have made my button's style UIButtonTypeCustom to get rid of the rounded border. Beyond this, I don't know how to have the gray overlay because I see no such property in the documentation.
Its simple:
#define TAG_GRAYVIEW 5671263 // some random number
// add the gray overlay
UIView *grayView = [[UIView alloc] initWithFrame:button.bounds];
grayView.backgroundColor = [UIColor grayColor];
grayView.tag = TAG_GRAYVIEW;
[button addSubview:grayView];
// remove the gray overlay
UIView *grayView = [button viewWithTag:TAG_GRAYVIEW];
[grayView removeFromSuperview];
I think you need to use a semi transperant grey image PNG file. You need to then set Image of button in Highlighted state.
Also note that both the images for Normal State and Highlighted State need to have the images with titles on them.
As once we set the image to button, btn.titleLabel.text won't be displayed.
So you can have a image with transperant background and title on it for Normal state. And an grey image with title on it for Highlighted State.
Code for doing it programmatically is
[btn setImage:#"Transperant.png" forState:UIControlStateNormal];
[btn setImage:#"Grey.png" forState:UIControlStateHighlighted];
Hope this helps you.
The default UIButton masks the opaque content using a gray highlight. For example when using a transparent png, only the parts that contain non-transparent pixels will be grayed out on touch. The default UIButton highlight has no effect on subviews/sublayers, and will only work on provided images. What you see in the Facebook app is probably just a UIWebView highlight, possibly customized using css.
To create something similar using your own control (to prevent the overhead of a UIWebView) you should probably create your own UIControl subclass and highlight the content on touch using a transparent CALayer. You can even mask the CALayer to only highlight the actual contents, instead of a rectangular shape.
Also see my stackoverflow post on creating custom controls for iOS by subclassing UIControl.
Try setting the button up something like this.
*mind you I didn't create the image for this example.
Set your button type to custom, and in "State Config" select "Highlighted" from there you will want to set the image of the button to be a semi-transparent grey image. There are probably several other ways to achieve this same effect but this one should be nice and simple.

UINavigation Bar custom font

I have assigned a label to my navigation item.titleview
The problem is if I use system font then the label is centered on the navigation bar, but if I use custom font it is not.
There is a way to work around this without adding a custom label. By setting self.title from the viewDidLoad method, the titleLabel will resize. However, you need to use a different title then defined in your storyboard. It won't call sizeToFit when the contents of the label doesn't change (which sounds logical to me).
It is a known bug BUT you can circumvent it in the following way:
// adds a custom title label to the view
-(void)addNavBarTitle:(NSString*)titleText
{
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 360, 30)]; // NOTE: YOU CAN ADD PADDING TO THE LABEL BY CHANGING ITS Y ORIGIN
[label setFont:[UIFont fontWithName:#"Arial-BoldMT" size:14]]; // Use custom font if needed
[label setBackgroundColor:[UIColor clearColor]];
[label setTextColor:[UIColor whiteColor]];
[label setText:titleText]; // Dynamically change title. Else just explicitly set the string here
label.textAlignment = UITextAlignmentCenter;
[self.navigationController.navigationBar.topItem setTitleView:label];
[label release];
}
That should do the trick,
Happy Coding!
This looks like a bug, so please file a report at https://bugreport.apple.com. Including the code from which you generated these screenshots would be extremely helpful.
In the meantime, you can try positioning the label yourself via the titleView property of the corresponding UINavigationItem.
The navigation bar centers the label based on its frame size. If you have made the label's frame larger than necessary or put extra whitespace after the visible text, it will appear off-center.
To make the label exactly as big as necessary for its text, send the sizeToFit message to the label. Or if you created the label in your nib, select the label and choose Editor > Size to Fit Content from the menu bar.
You could also set the label's textAlignment property to UITextAlignmentCenter.
Test project here: http://dl.dropbox.com/u/26919672/navbartitleview.zip
All above three answers are helpful ..
To sum up :
From the above answers.. i can too say it is a bug
#Dave Delong .. i tried updating its frame via titleView ..only origin.x and width had an effect..y values didn't.
#rob mayoff my first code include size to fit it didn't worked... then i tried many things.. making a button and setting its title.. etc.. still the bug persist.
#rinzler i tried that ..didn't worked for me.bug was still there with my font...might work for someone else..
So the solution was simple enough for me.. since my navigation bar title does not change.. i just replaced it with the text image.
using
UIImageView *TitleImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"MyImage.png"]];
self.navigationItem.titleView = TitleImage;
[TitleImage release];
this won't work for those whose title changes.. Thanks all..
Assuming you're supporting iOS 5+, then you want to use [UINavigationBar appearance] method to set custom title fonts, bar button fonts, bar button images, etc.
Read more here:
http://www.raywenderlich.com/21703/user-interface-customization-in-ios-6

Left-aligned text at viewDidLoad instead of center with custom font

I'm using a custom font on an iPhone app. This font is used on UIButtons and is displaying well.
In IB, I'm setting up horizontal alignement to center and changing the font programaticly with :
[self.playButton.titleLabel setFont:[UIFont fontWithName:#"myfont" size:30]];
when the viewDidLoad is reached.
On the screen, when the view appear, the button's label is first left-aligned in my button and then, 1/2 sec later, it switch to center like I want.
It looks really strange ... if anyone have a clue about this, thanks a lot !
EDIT:
When using
[self.playButton.titleLabel setTextAlignment:UITextAlignmentCenter];
It's nearly the same, the text is cut and then appears totaly.
I am having EXACTLY the same problem. It appears using (sorry for the code, is Xamarin.iOS's C#, not obj-c) UILabel.Appearance.Font = UIFont.FromFile... Removing that let me set font even in the ViewDidLoad!

UINavigationItem title label set width?

In my UIViewController i set my title dynamically so i do not know the length of the string that will be shown in the navigation bar and because of that i have the current situation:
alt text http://img94.imageshack.us/img94/2484/picture3vf.png
is there any way to set the width of the label that displays the title in the navigation bar? or should i think of a with, compare the text length to it and if it is too long should i resize it and display the famous "..." ?
I know that i can add an UILabel as subview to the navigationBar but i don't want to use that solution.
Thank you!
Maybe you could add some dummy buttons to the navigation bar that will sit directly underneath your buttons. That would show the normal text behavior, but also allow you to play with your colors.
I'm not sure how you did that. If I'm creating a navigation view and setting a title that is too long it will be shortened with "..." by default. These black buttons do not seem to be default buttons.
You can use sizeWithFont method of NSString to know the size your label will take. Note that you can add a maximum size if you know your label width shouldn't be greater than a certain value
// Get the size really needed for the label string
CGSize expectedLabelSize = [self.text sizeWithFont:self.font
constrainedToSize:maximumSize
lineBreakMode:self.lineBreakMode];

How to set height for a textfield in size inspector

i created a UITextField of type rounded textfield, using Interface Builder,so in order to set the Height of a textfield its window was disabled(not to set any height manually) in SizeInspector.so if we want to set height manually,what procedure should we follow.
One thing i would like to mention is ,we can do that in coding part,but what i would like to know is ,how can we acheive that in interfacebuilder.
Answers from you were always appreciated.
Change the border style, like this:
Unfortunately you can't set the Height of a UITextField using Interface Builder. You will have to set it programatically and be sure it doesn't break any rules from iPhone Human Interface Guidelines
You can change the height of UITextField by editing the .xib file. Just open it using Textedit or Dashcode and search for the IBUITextField. Edit to NSFrame parameter to whatever size u want.
increase the size of the font and the box's height will increase
Change the Border Style property of the text field to something other than the rounded rectangle. After that you can freely set the height of the box.
Right click on .xib file and click on "Open As"-> "Source Code". Then search for UITextField's NSFrame. Change the height as you want.
Successful solution with my condition:
After trying all above ways, I could not change the height of UITextField.
Finally, I found out that I put UITextField in stack view (or it was affected by some constraints).
So, I added Height Constraint for UITextField then put my expected height in Constant of Constraint.
And it works.
Specially, it works for all Border-style (None, Line, Bezel, RoundedRect).
No code is needed.
After a bit of playing around, I realized that UITextField can be thought of as a UIButton (Rounded rect style) with a UILabel on top of it. Or, it is a UITextView on top of UIButton Rounded rect style. The number of lines, dimensions and position of the label inside the button can be easily adjusted in IB.
In my case, I wanted a read only text-field so I used UILabel on top of UIButton. I adjusted the size of button as per requirement and also label size. I also had to uncheck the 'Enable' box for the button in IB so that it does not get highlighted on touching.
You can easily change that using source code. Just right click on your storyboard, open it as source code, then search for your text field and change the height.
The easiest way that i have found to accomplish this is to change the border style and then edit the other attributes to your liking. Here's an example.
emailField.layer.borderColor = [[UIColor blackColor] CGColor];
emailField.layer.borderWidth = 2.0f;
emailField.layer.cornerRadius = 8.0f;
emailField.alpha = .75f;
emailField.layer.backgroundColor = [[UIColor whiteColor] CGColor];
!
I resolved textfield (with rounded rect) height problem. You must define height constraint for your textfield object.
Define height constraint for Textfield.
We can change height of Text Field with any type of border style other than rounded rectangle by simply dragging. But for the Rounded Rectangle Text fields it is not possible...of course we can change height using some code.
And here I found a simple way. It worked for me
Select the text field and at the below right corner we can see the pins option..
There select the height constrain it is 30 pre-defined...
select that height and you can see "Add 1 Constraint" is enabled.
Click on that..therefore we have added height constraint for that text field.
Now go to the size inspector. There find the Height constraint in "Constraints"...which is above the "Content Hugging Priority"
You can edit the height there...give whatever value you want to give. Now see the textfield it is changed to its height which you have given.
It worked for me :) Can use this scenario for UISwitch, Segment, etc..
As #peterdoesco.de said, Just add an Height constraint, and change it's value, this can works fine.