Enter a rightview UIImageView to a UITextField - ios

Question

I have a target action that when a button is pressed, I validate the UITextField:
// Get the text from the UITextField
NSString *nameStr = _name.text;
_name.rightView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"error.png"]];
[self.view addSubview:_name];
if (nameStr.length == 0)
{
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:#"Invalid Name"
message:#"You must enter a name."
delegate:nil
cancelButtonTitle:#"OK"
otherButtonTitles:nil];
[alert show];
}
My UITextField are added to the view in viewDidLoad like so:
[self.view addSubview:_name];
How do I make a rightView UIImageView appear?

Answer 1

You have to set rightViewMode of the Textfield because The default value for this property is UITextFieldViewModeNever.
so You have to set Mode from following,
UITextFieldViewModeWhileEditing,
UITextFieldViewModeUnlessEditing,
UITextFieldViewModeAlways

Answer 2

Are you sure you are not missing the UITextField frame ? And are you setting the rightViewMode ?
This is an example i just wrote seem to be working fine.
UITextField *rightField = [[UITextField alloc] initWithFrame:CGRectMake(0, 0, 140, 50)];
rightField.backgroundColor = [UIColor redColor]; // For testing purpose
rightField.rightViewMode = UITextFieldViewModeAlways;// Set rightview mode
UIImageView *rightImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Tick_white_color"]];
rightField.rightView = rightImageView; // Set right view as image view
[self.view addSubview:rightField];
Here is the tick image as result :

Answer 3

For Swift 3.To show image before placeholder text in UITextField
func setPaddingView(strImgname: String,txtField: UITextField){
let imageView = UIImageView(image: UIImage(named: strImgname))
imageView.frame = CGRect(x: 0, y: 5, width: imageView.image!.size.width , height: imageView.image!.size.height)
let paddingView: UIView = UIView.init(frame: CGRect(x: 0, y: 0, width: 50, height: 30))
paddingView.addSubview(imageView)
txtField.leftViewMode = .always
txtField.leftView = paddingView
}
To call Function
self.setPaddingView(strImgname: "mail", txtField: txtEmail)

Answer 4

Solution in Swift 3:
class CustomText: UITextField {
#IBInspectable var rightImage : UIImage?{
didSet{
self.rightView = UIImageView(image: rightImage)
// select mode -> .never .whileEditing .unlessEditing .always
self.rightViewMode = .always
}
}
}

Answer 5

Solution with #IBDesignable and Swift 3
Firstly, you can create #IBDesignable for UITextField like this.
#IBDesignable extension UITextField{
#IBInspectable var setImageName: String {
get{
return ""
}
set{
let imageView: UIImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
imageView.image = UIImage(named: newValue)!
self.rightView = imageView
self.rightViewMode = UITextFieldViewMode.always
}
}
Note: You must be write get and set points for #IBInspactable block because Swift has warn to apply getter and setter together. We've not need to use the get statement, so returned empty string. Also the attribute name has include Button but not confuse, its a mistake.
Then click the UITextField on StoryBoard and give the spesific image name to the setAButtonImageName attribute.
Then you will get the following result
The other situation is the create rightView with seems like has right margin
Here is the screenshot.
You can use a UIView as container than can add the UIImageView into the this UIView. In here, you must calculate the right margin, container view's width and `UIImageViews' width.
#IBInspectable var setImageName: String {
get{
return ""
}
set{
let containerView: UIView = UIView(frame: CGRect(x: 0, y: 0, width:50, height: self.frame.height))
let imageView: UIImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
imageView.image = UIImage(named: newValue)!
containerView.addSubview(imageView)
imageView.center = containerView.center
self.rightView = containerView
self.rightViewMode = UITextFieldViewMode.always
}
}

Answer 6

If you have two or more field then try this code! its working for me.
dropDownImageViewForTextField1 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 20, 20)];
dropDownImageViewForTextField1.image = [UIImage imageNamed:#"dropdown_n_icon.png"];
dropDownImageViewForTextField2 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 20, 20)];
dropDownImageViewForTextField2.image = [UIImage imageNamed:#"dropdown_n_icon.png"];
txtField1.rightViewMode = UITextFieldViewModeAlways;
txtField1.rightView = dropDownImageViewForTextField1;
txtField2.rightViewMode = UITextFieldViewModeAlways;
txtField2.rightView = dropDownImageViewForTextField2;
Do check 2 things
txtField.rightViewMode = UITextFieldViewModeAlways
Separate imageView for each textField