[ios] iOS7의 UITextfield leftView / rightView 패딩

Program / 글쓴이

iOS7에서 UITextField의 leftView 및 rightView 뷰는 실제로 텍스트 필드 테두리에 가깝습니다.

해당 항목에 (수평) 패딩을 추가하려면 어떻게해야합니까?

프레임 수정을 시도했지만 작동하지 않았습니다. 

uint padding = 10;//padding for iOS7
UIImageView * iconImageView = [[UIImageView alloc] initWithImage:iconImage];
iconImageView.frame = CGRectMake(0 + padding, 0, 16, 16);
textField.leftView = iconImageView;

UITextBorderStyleNone을 사용하여 UITextField에 대한 패딩 설정 과 같이 텍스트 필드의 텍스트에 패딩을 추가하는 데 관심이 없습니다.

답변

이 작업을 직접 수행하고이 솔루션을 사용했습니다.

- (CGRect) rightViewRectForBounds:(CGRect)bounds {

    CGRect textRect = [super rightViewRectForBounds:bounds];
    textRect.origin.x -= 10;
    return textRect;
}

이렇게하면 iOS 7에서 이미지가 가장자리에 밀착되는 대신 오른쪽에서 10 씩 이미지가 이동합니다.

또한 이것은의 하위 클래스에 UITextField있었으며 다음을 통해 만들 수 있습니다.

  1. UITextField기본값 대신 하위 클래스 인 새 파일 만들기NSObject

  2. - (id)initWithCoder:(NSCoder*)coder이미지를 설정하기 위해 이름이 지정된 새 메소드 추가

    - (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;
}

  3. 가져와야 할 수 있습니다. #import <QuartzCore/QuartzCore.h>

  4. rightViewRectForBounds위 의 방법 추가

  5. Interface Builder에서 하위 클래스를 만들려는 TextField를 클릭하고 클래스 속성을이 새 하위 클래스의 이름으로 변경합니다.

답변

다음을 활용하는 훨씬 간단한 솔루션 contentMode:

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

    textField.rightView = arrow;
    textField.rightViewMode = UITextFieldViewModeAlways;

스위프트 3에서는

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

답변

가장 쉬운 방법은 leftView / righView에 UIView를 추가하고 UIView에 ImageView를 추가하고 원하는 곳 어디에서나 UIView 내에서 ImageView의 원점을 조정하는 것입니다. 몇 줄의 코드 만 필요합니다.

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];

답변

이것은 Swift에서 잘 작동합니다.

let imageView = UIImageView(image: UIImage(named: "image.png"))
imageView.contentMode = UIViewContentMode.Center
imageView.frame = CGRectMake(0.0, 0.0, imageView.image!.size.width + 20.0, imageView.image!.size.height)
textField.rightViewMode = UITextFieldViewMode.Always
textField.rightView = imageView

답변

이것은 나를 위해 작동합니다

UIView *paddingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 10, 20)];
self.passwordTF.leftView = paddingView;
self.passwordTF.leftViewMode = UITextFieldViewModeAlways;

그것이 당신을 도울 수 있기를 바랍니다.

답변

이 솔루션은 한 줄의 코드로 문제를 해결하기 때문에 좋아합니다.

myTextField.layer.sublayerTransform = CATransform3DMakeTranslation(10.0f, 0.0f, 0.0f);

참고 : .. 또는 2 줄에 QuartzCore 포함을 고려하는 경우 🙂

답변

이를 수행하는 가장 좋은 방법은 UITextField의 하위 클래스와 .m 파일을 사용하여 클래스를 만드는 것입니다. 

  #import "CustomTextField.h"
  #import <QuartzCore/QuartzCore.h>
  @implementation CustomTextField


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

if (self) {

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

    self.leftView = [[UIView alloc] initWithFrame:CGRectMake(0, 0,15,46)];
    self.leftViewMode=UITextFieldViewModeAlways;
      }

return self;

}

이렇게하면 스토리 보드 또는 xib로 이동하여 ID 검사기를 클릭하고 클래스 옵션에서 UITextfield를 자신의 “CustomTextField”로 바꿉니다.

참고 : 텍스트 필드에 자동 레이아웃으로 채우기 만하면 애플리케이션이 실행되지 않고 빈 화면 만 표시됩니다.