• Home
  • Basics
  • DSA
  • MAD
  • Concept
  • Practice
  • Misc
  • Tips
  • QA’s
  • Home
  • Basics
  • DSA
  • MAD
  • Concept
  • Practice
  • Misc
  • Tips
  • QA’s
  • #News
  • #APPS
  • #Events
    • #WWDC
    • #I/O
    • #Ignite
  • #Let’s Talk
  • #Interview
  • #Tips

MyCodeTips mycodetips-newlogocopy1

  • Home
  • Basics
  • DSA
  • MAD
  • Concept
  • Practice
  • Misc
  • Tips
  • QA’s
IOS

How to Set Left/Right Padding in UITEXTFIELD in IOS

How to Set Left/Right Padding in UITEXTFIELD in IOS

There is a common ISSUE (How to Set Left/Right Padding in UITEXTFIELD in IOS ) we always faced while designing a IOS form and that is Padding and Margin of a UIControl.

Either way we faced the same issue whether we use Storyboard or Programmatically we create a form in IOS.

There are multiple ways to align the control
1- Programatically
2- Dragdrop ( Non-Constraint parameters)
3- Using Constraint parameters

But we will highlight few tips here

- (CGRect) rightViewRectForBounds:(CGRect)bounds {

CGRect textRect = [super rightViewRectForBounds:bounds];
textRect.origin.x -= 10;
return textRect;
}
UIImageView *imgView = [[UIImageView alloc] initWithFrame:CGRectMake(10, 5, 26, 26)];
imgView.image = [UIImage imageNamed:@"img.png"];
UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 32, 32)];
[paddingView addSubview:imgView];
[txtField setLeftViewMode:UITextFieldViewModeAlways];
[txtField setLeftView:paddingView];
-(UIView*)paddingViewWithImage:(UIImageView*)imageView andPadding:(float)padding
{
float height = CGRectGetHeight(imageView.frame);
float width = CGRectGetWidth(imageView.frame) + padding;

UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, width, height)];

[paddingView addSubview:imageView];

return paddingView;
}
- (void) modifyTextField:(UITextField *)textField
{
// Prepare the imageView with the required image
uint padding = 10;//padding for iOS7
UIImageView * iconImageView = [[UIImageView alloc] initWithImage:iconImage];
iconImageView.frame = CGRectMake(0 + padding, 0, 16, 16);

// Set the imageView to the left of the given text field.
textField.leftView = iconImageView;
textField.leftViewMode = UITextFieldViewModeAlways;
}

class CustomTextField : UITextField {

override func rightViewRect(forBounds bounds: CGRect) -> CGRect {
let offset = 5
let width = 20
let height = width
let x = Int(bounds.width) - width - offset
let y = offset
let rightViewBounds = CGRect(x: x, y: y, width: width, height: height)
return rightViewBounds
}}

Create a new file that’s a subclass of UITextField instead of the default NSObject
Add a new method named – (id)initWithCoder:(NSCoder*)coder to set the image

 (id)initWithCoder:(NSCoder*)coder {
self = [super initWithCoder:coder];

if (self) {

self.clipsToBounds = YES;
[self setRightViewMode:UITextFieldViewModeUnlessEditing];

self.leftView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"textfield_edit_icon.png"]];
}

return self;
}

You may have to import #import <QuartzCore/QuartzCore.h>

Add the rightViewRectForBounds method above

In Interface Builder, click on the TextField you would like to subclass and change the class attribute to the name of this new subclass

let downarrow = UIImageView(image: UIImage(named: "down_arrow"))
downarrow = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"down_arrow"]];
downarrow.frame = CGRectMake(0.0, 0.0, arrow.image.size.width+10.0, arrow.image.size.height);
downarrow.contentMode = UIViewContentModeCenter;

textField.rightView =downarrow;
textField.rightViewMode = UITextFieldViewModeAlways;

In Swift 2:

let downarrow = UIImageView(image: UIImage(named: "down_arrow"))
downarrow.frame = CGRectMake(0.0, 0.0, arrow.image.size.width+10.0, arrow.image.size.height);
downarrow.contentMode = UIViewContentMode.Center
self.textField.rightView =downarrow
self.textField.rightViewMode = UITextFieldViewMode.Always

In Swift 3

let downarrow = UIImageView(image: UIImage(named: "arrowDrop"))
if let size =downarrow.image?.size {
downarrow.frame = CGRect(x: 0.0, y: 0.0, width: size.width + 10.0, height: size.height)
}
downarrow.contentMode = UIViewContentMode.center
self.textField.rightView =downarrow
self.textField.rightViewMode = UITextFieldViewMode.always

In Swift 5

class CustomTextField: UITextField {
func invalidate() {
let errorImage = UIImageView(image: UIImage(named: "errorImage"))
errorImage.frame = CGRect(x: 8, y: 8, width: 16, height: 16)
rightView = UIView(frame: CGRect(x: 0, y: 0, width: 32, height: 32))
rightView?.addSubview(errorImage)
rightViewMode = .always
}
}

func addImageViewInsideMyTextField() {
let someView = UIView(frame: CGRect(x: 0, y: 0, width: 40, height: 24))
let imageView = UIImageView(image: UIImage(named: "accountImage"))
imageView.frame = CGRect(x: 16, y: 0, width: 24, height: 24)
imageView.contentMode = .scaleAspectFit
someView.addSubview(imageView)

self.myTextField.leftView = someView
self.myTextField.leftViewMode = .always
}
  • Click to share on Reddit (Opens in new window)
  • Click to share on Facebook (Opens in new window)
  • Click to share on Twitter (Opens in new window)
  • Click to share on LinkedIn (Opens in new window)
  • Click to share on Tumblr (Opens in new window)
  • More
  • Click to share on Pocket (Opens in new window)
  • Click to share on Pinterest (Opens in new window)
Written by Admin Blogger - February 20, 2020 - 14734 Views
Tags | IOS, Placeholder, UI, UX
AUTHOR
Admin Blogger

This website is basically about of what we learnt from my years of experience as a software engineer on software development specifically on mobile application development, design patterns/architectures and its changing scenarios, security, troubleshooting, tools, tips&tricks and many more.

You Might Also Like

swift-concurrency-await

Concurrency in Swift

November 17, 2021
objective-c-control-statements2

Objective-C control statements and loops !

October 21, 2021
and-or-not-condition

Operators in Swift (AND, OR, or NOT.)

August 6, 2021
Next Post
Previous Post

Support us

Subscribe for updates

Join 8,276 other subscribers

Latest Posts

  • primitive-datatypes-new
    Exploring the Pros and Cons of Primitive Data Types
  • best practice clean code
    Essential Coding Standards and Best Practices for Clean Code
  • YT-Featured-Templates--lld
    What Business Problems Solves in Low Level Design (LLD)
  • SRP-SingleResopnsibility
    SRP : Single Responsibility Principle in Swift and Objective-C
  • Designing Mobile APPS
    Limitation and restriction of designing mobile apps
whiteboard

Whiteboard(PRO)

whiteboard

Whiteboard(lite)

alphabets

Kids Alphabet

do2day

Do2Day

  • #about
  • #myapps
  • #contact
  • #privacy
  • #Advertise
  • #myQuestions

.Net Android Blogging Cloud Concept Database DSA ERROR ExcelTips Flutter Interview IOS IOSQuestions JAVA Javascript MAC-OS No-Mouse Objective-c Programming Quick Tips SEO Software Design & Architecture Swift SwiftUI Tips&Tricks Tools Troubleshoot Videos Web Wordpress Xamarin XCode

  • Exploring the Pros and Cons of Primitive Data Types
  • Essential Coding Standards and Best Practices for Clean Code
  • What Business Problems Solves in Low Level Design (LLD)
  • SRP : Single Responsibility Principle in Swift and Objective-C
  • Limitation and restriction of designing mobile apps
MyCodeTips

©mycodetips.com