Add UILabel to the left side of a UITextField - ios

I'm trying to consolidate screen space in my iPhone app by putting label text inside of a UITextField that will be uneditable. It will tell the user what to put into the text field. Here is an example of an app that does exactly what I want to do.
I have done my research and found some code to mimic this to some extent.
UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 80, 40)];
label.text= #"Exerise Name:";
label.font = [UIFont fontWithName:#"Arial" size:12];
[label setTextColor:[UIColor blueColor]];
_txtExerciseName.leftViewMode = UITextFieldViewModeAlways;
_txtExerciseName.leftView = label;
[self.view addSubview:_txtExerciseName];
This is inside viewDidLoad. The code yields something like this:
Obviously with styling and tweaking this might work but I was wondering if there is a better way to do this that I am not seeing. If someone has any tips, ideas, or code samples to get me going in the right direction I would really appreciate it.

I saw a really cool solution to this problem. The placeholder text is moved to the top of the textfield when the keyboard comes up/becomes the first responder, then disappears when the textfield resigns the first responder.
Implementations
Objective-C
Swift

The effect you're trying to mimic is almost certainly done by:
Creating what looks like a text box image in an image editing app, importing into your project -- you could also do it via slices so you can create any width field background.
Place the aforementioned image where you want the label and text field
Place a borderless UILabel and a borderless UITextField in the appropriate spot above the image you just dropped.
That should do it. No code changes necessary.

Related

How to set the text color of the UISearchBar's placeholder

I have a UISearchBar with a dark background color so I was trying to change the place holder text color of UISearchBar (which will be gray by default) but I didn't find a way to set it. So I thought of getting some help :) please suggest me how this can be achieved thanks in advance :)
Note: At the time I wrote this answer I was working on iOS 7 & this workaround worked on iOS 8 as well. It may not work on iOS 9.
Ok it's been two days since I posted this question. Though I din't get the answer I got a workaround for this problem.
Note : I am using storyboard for my application & I have subclassed the UISearchBar and this workaround working like a gem for me.
First and foremost add an appearance proxy to UILabel when its contained in the UISearch bar class like this :
[[UILabel appearanceWhenContainedIn:[UISearchBar class], nil] setTextColor:[UIColor whiteColor]];//change the color to whichever color needed
Then the most important thing is If you're using storyboard you must and should write some text in the placeholder field of the attribute inspector like this
If you forget to write something in the placeholder field, definitely this trick will not work when you run the application and the placeholder text will look in usual gray color.
Once you're done with writing some text in placeholder field, set the place holder text in your UISearchBar sub class like this :
self.placeholder = #"My Placeholder text";
Now run the application !!! You'll get the place holder text in the color which you have set in appdelegate:) Hope this helps someone :)
Here is the solution
[searchBar setValue:[UIColor blueColor] forKeyPath:#"_searchField.textColor"];

Setting custom font for UILabel appearance causes UIDatePicker bug

In my app delegate I set the font and fontColor of all UILabels using [UILabel apperance], but this is causing the font in my UIDatePicker to also change, which Apple don't allow, and for obvious reasons because it makes the datePicker buggy by changing to default font while scrolling and other inconsistent and unintended behaviour.
How do I ignore UIDatePicker to keep it default when setting all UILabels?
I haven't found a "proper" solution for this problem short of abandoning UIDatePicker or [UILabel appearance], but I did figure out a hack that at least hides the problem. It seems that when the view is initially loaded, the UILabels holding the text for the selected date may be drawn using the label's appearance proxy, but when the UIDatePicker redraws after having the date reset, it will set the label back to the system font.
To hide the problem, in viewWillAppear:, I set the date to two different date values with different date components, then set the picker back to the proper date, like so:
[datePicker setDate:[NSDate dateWithTimeIntervalSince1970:0] animated:NO]; //1970-01-01
[datePicker setDate:[NSDate dateWithTimeIntervalSince1970:49000000] animated:NO]; //1971-07-22
[datePicker setDate:myDate animated:NO]; //Set back to the correct date
It's not elegant, but it makes the date picker look normal again.
The only simple work-around I found was to create the UIDatePicker in code (not using storyboards). I got what I wanted.
Try this ..
[[UILabel appearance] setTextColor:[UIColor redColor]];
[[UILabel appearance] setFont:[UIFont boldSystemFontOfSize:20.0f]];
[[UILabel appearanceWhenContainedIn:[UIDatePicker class],nil] setTextColor:nil];// default is nil (text draws black)
[[UILabel appearanceWhenContainedIn:[UIDatePicker class],nil] setFont:nil];// default is nil (system font 17 plain)
This will change all labels to red colour and their font except the UIDatePicker one. Hope this helps.
Red colour and bold font are for demonstration purposes. They should be as per your requirement.

Can I make UITextField invisible?

I checked out iPhone: How can I make a UITextField invisible but still clickable?, but the OP has something else going on and the answers didn't seem to help me out of my fix.
I have a UITextField in which the user has to enter text. Instead of the standard UITextField graphic, I want to use a lovely graphic that's been designed for that purpose. The user would still need to be able to enter text and see the text s/he's entering, but I need the textfield to be invisible so that the graphic can show from underneath it.
How can I do this? Or is there another way to do what I'm after?
Adding my comment as an answer. You can try this,
[textField setBackgroundColor:[UIColor clearColor]];
And then set the border style as UITextBorderStyleNone.
something like:
yourTextField.borderStyle = UITextBorderStyleNone;
should do it
Another solution would be hiding the UITextView itself and just adding a transparent button that will call the keyboard to display.
Otherwise, the other answers should work.
Easiest option is to do it in interface builder. Choose the first uitext field style with no border and that's it.

iOS make button that looks like UINavigationItem

Aside from duplicating the look of UINavigationItem into a custom image file, is there any way to add a button to iOS application that looks like a UINavigationItem?
I have UITableView and would like to have buttons on the right side of each cell for specific actions (1 button per cell, but not all cells have the same buttons). So I was looking to base this on the behaviour of "Delete" button that shows up when doing swipe-to-delete on table cells, except I would also need the ability to change the color and text of such a button.
What's the best way to do something like this?
Edit: I know I can just duplicate that look in Photoshop and use an image, but that way to change title and colour I have to go back to editing the image every time. Is there any way to make a button that looks like UINavigationItem programmatically, outside of a UINavigationBar?
The button style I was looking for is UISegmentedControl. It behaves a little bit different than a standard button, but looks a whole lot better. A good alternative to the ugly inflexible UIButton if you don't have hours to spend making buttons in a graphics editor.
UISegmentedControl *btn = [[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObject:#"My Button"]];
btn.segmentedControlStyle = UISegmentedControlStyleBar;
btn.momentary = YES;
btn.tintColor = [UIColor greenColor];
[btn addTarget:self action:#selector(btn_action:) forControlEvents:UIControlEventValueChanged];

Round UIButton

I want to know whether drawing a round UIButton(not rounded rect) is possible.
When I add a round image in a UIButton of type custom, then it looks like a round button. But at the moment the button is clicked the boundary of the button becomes visible, so that it looks like a square button, then again when the click ends it looks like a round button.
I want the button to look like a round button even at the moment the click happens. is this possible?
Tested Code:
.h
-(void)vijayWithApple;
.m
-(void)vijayWithApple{
NSLog(#"vijayWithApple Called");
}
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setImage:[UIImage imageNamed:#"Micky.png"] forState:UIControlStateNormal];
[button addTarget:self action:#selector(vijayWithApple) forControlEvents:UIControlEventTouchUpInside];
[button setTitle:#"Show View" forState:UIControlStateNormal];
button.frame = CGRectMake(135.0, 180.0, 40.0, 40.0);//width and height should be same value
button.clipsToBounds = YES;
button.layer.cornerRadius = 20;//half of the width
button.layer.borderColor=[UIColor redColor].CGColor;
button.layer.borderWidth=2.0f;
[self.view addSubview:button];
Result
Just create two rounded button images, one for the pressed state and one for unpressed.
In IB, create a UIButton of type Custom. Go to the section where you set a background image, and set the dropdown with "All" to normal - now set the image to your unpressed image.
Then change the dropdown to "Selected", and put in your pressed image.
Now change the fill type to be aspect fit, and make the button sqare. Use as a normal UIButton anywhere. You can of course also easily do this all programaitcally with similar steps (setting images for UIControlStateNormal and UIControlStateSelected).
You'd probably have to create a custom control for that, but do you really need a round button?
Every platform has its UI conventions, and the iPhone is no exception. Users expect the buttons to be rounded rectangles.
UPDATE in response to comment:
If I'm getting this right, you're not looking for a round button, but rather a clickable (touchable) image.
You can use an UIImageView and its touchesBegan method.
UPDATE 2:
Wait a second. What kind of radio button are we talking about? For some reason I thought you were trying to imitate a real radio. If you're talking about a radio button group, please use a UISegmentedControl or a UIPicker.
UIButton *but=[UIButton buttonWithType:UIButtonTypeCustom];
but.layer.cornerRadius=50;
From what I know of the SDK (admittedly I have very little experience beyond tutorials in books/screencasts), you'd have to create your own control to have a radio button. There are a couple of suggestions on how to implement that in this question.
That said, from a user's perspective I feel like it would be better to stick to the native controls. iPhone users are used to specific controls (i.e. UITableViews or UIPickerViews) for this type of interaction. Straying from practically universal UI conventions tends to make the user experience more jarring.
take the help of this site for creating Round Button on iPhone.
You can get many custom controls :)
http://www.cocoacontrols.com/controls
http://www.cocoacontrols.com/platforms/ios/controls/uiglossybutton
H#PPY CODING !
Thanks & regards,
Gautam Tiwari

Resources