关于UITextField左侧图标的设置

在开发iOS注册登录界面时,作者探讨了如何设置UITextField左侧图标。文章提到了两种方案:一是自定义视图,二是利用UITextField的内置左侧视图。针对遇到的图标紧贴边界的难题,提出了通过调整视图宽度或使用带有透明区域的图片来实现间距。作者推荐使用方法二,避免特殊切图,以保持代码的简洁性和一致性。
摘要由CSDN通过智能技术生成
背景:

这几天在写一个注册、登陆的界面。想模仿一些热门的app的登录注册界面,输入框肯定是少不了的啦~~所以,就自然而然遇到了输入框左侧图标的设置的问题。


设计思路:
  • 方案一:
    左侧的图标是一个UIImageView来设置,右边放一个UITextField。当然,这种方法是很low的,建议用方案二。因为UITextField自带左侧视图,直接用就行了。
  • 方案二:直接用UITextField自带的左侧视图,因为左侧视图是一个UIView,可以创建一个UIImageView,然后把这个UIImageView的赋值给左侧视图UIView

会遇到的问题:

你会发现,左侧的UIImageView无论你怎么设置X轴的距离,它都紧贴着UITextField的左侧。


解决办法:
  • 办法一:让美工给你切一个这样的图标,就可以让左侧视图看起来有点距离了。这个图片除了图标之外,其余都是透明色的。

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在 iOS 中,UITextField 的光标大小和颜色是由系统控制的,我们不能直接修改其大小,但是可以通过修改 UITextField 的 tint 属性来改变光标的颜色。 虽然不能直接修改光标大小,但我们可以通过设置 UITextField 的边框样式为 None,然后通过添加一个自定义的 UIView 作为光标来模拟实现。 以下是一个示例代码,可以在 UITextField 中添加一个自定义的光标: ```swift let customCursorView = UIView(frame: CGRect(x: 0, y: 0, width: 2, height: textField.frame.height)) customCursorView.backgroundColor = UIColor.red textField.tintColor = UIColor.clear textField.addSubview(customCursorView) ``` 在这个代码中,我们创建了一个自定义的 UIView,用于模拟光标。我们将其宽度设置为 2,高度设置UITextField 的高度,颜色设置为红色,并将其添加到 UITextField 上。最后,我们将 UITextField 的 tint 设置为 clear,以隐藏系统的光标。 需要注意的是,为了保证自定义光标的位置和系统光标的位置一致,我们还需要在 UITextField 的代理方法中添加以下代码: ```swift func textFieldDidChangeSelection(_ textField: UITextField) { if let selectedRange = textField.selectedTextRange { let cursorPosition = textField.offset(from: textField.beginningOfDocument, to: selectedRange.start) if let customCursorView = textField.subviews.last { customCursorView.frame.origin.x = textField.frame.origin.x + textField.textRect(forBounds: textField.bounds).origin.x + textField.font!.size(of: String(textField.text![..<textField.text!.index(textField.text!.startIndex, offsetBy: cursorPosition)]), constrainedToWidth: textField.frame.width).width } } } ``` 在这个代理方法中,我们获取了 UITextField 中被选中的文本范围,然后计算了光标在 UITextField 中的位置,并将自定义光标的位置进行了调整。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值