如何使用图标向UITextField添加填充

时间:2014-03-11 12:51:23

标签: ios objective-c cocoa-touch uitextfield

我目前有以下代码来设置密码文本字段:

  self.passwordTextField = [UITextField new];
  self.passwordTextField.placeholder = @"Password";
  self.passwordTextField.font = [UIFont systemFontOfSize:18.f];
  self.passwordTextField.secureTextEntry = YES;
  self.passwordTextField.returnKeyType = UIReturnKeyDone;
  self.passwordTextField.delegate = self;
  self.passwordTextField.backgroundColor = [UIColor colorWithRed:255 green:255 blue:255 alpha:0.64];
  self.passwordTextField.layer.borderColor = [[UIColor lightGrayColor] CGColor];
  self.passwordTextField.layer.borderWidth = 1.0f;

  CGFloat textFieldHeight = 45.f;
  CGFloat textFieldWidth = 300.f;
  self.passwordTextField.frame = CGRectMake(DIALOG_VIEW_WIDTH/2.f - textFieldWidth / 2.f, 240.f, textFieldWidth, textFieldHeight);

  UIImageView *icon = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"text-input-icon-password-key.png"]];
  icon.frame = CGRectMake(0, 0, 45.f, 45.f);
  icon.backgroundColor = [UIColor lightGrayColor];
  self.passwordTextField.leftView = icon;
  self.passwordTextField.leftViewMode = UITextFieldViewModeAlways;

  [self.dialogView addSubview:self.passwordTextField];

给了我这个:

enter image description here

但是,我想在占位符文本的左侧和显示图标的图像视图的右侧添加一些更透明的填充。任何想法如何做到这一点?


更新:感谢您的回复。我最终通过为整个对象创建一个UIView来实现这一点,其中UIImageView用于图标,UITextField嵌入另一个UIView用于文本。结果如下:

enter image description here

4 个答案:

答案 0 :(得分:14)

  

" 更新:感谢您的回复。我最终通过为整个对象创建一个UIView来实现这一点,其中包含用于图标的UIImageView和用于文本的另一个UIView中嵌入的UITextField。"

您可以继续使用leftView的{​​{1}}属性,例如:

UITextField

答案 1 :(得分:2)

如果您想完全控制自定义布局,那么您应该继承UITextField并覆盖leftViewRectForBounds:placeholderRectForBounds:方法。然后,您可以返回两个区域的帧,从而指定它们之间的填充。

答案 2 :(得分:1)

这是一个UITextField子类,它允许对leftView(图标),文本和占位符文本进行插入。这些都可以在IB中配置

class UITextFieldWithInsets: UITextField {
    @IBInspectable var horizontalInset:CGFloat = 0
    @IBInspectable var verticalInset:CGFloat = 0

    @IBInspectable var leftViewHorizontalInset:CGFloat = 0
    @IBInspectable var leftViewVerticalInset:CGFloat = 0

    override func textRectForBounds(bounds: CGRect) -> CGRect {
        return CGRectInset(bounds , horizontalInset , verticalInset)
    }

    override func editingRectForBounds(bounds: CGRect) -> CGRect {
        return CGRectInset(bounds , horizontalInset + leftViewHorizontalInset + leftViewWidth, verticalInset)
    }

    override func placeholderRectForBounds(bounds: CGRect) -> CGRect {
        return CGRectInset(bounds, horizontalInset + leftViewHorizontalInset + leftViewWidth, verticalInset)
    }

    override func leftViewRectForBounds(bounds: CGRect) -> CGRect {
        let verticalInsetForCentered = (bounds.height - leftViewHeight) / 2
        return CGRect(x: leftViewHorizontalInset, y: leftViewVerticalInset > 0 ? leftViewVerticalInset : verticalInsetForCentered, width: leftViewWidth, height: leftViewHeight)
    }

    private var leftViewWidth : CGFloat { get { return leftView?.frame.width ?? 0 } }
    private var leftViewHeight : CGFloat { get { return leftView?.frame.width ?? 0 } }
}

答案 3 :(得分:0)

您可以使用更宽的图像作为带右透明列的图标。